happyDomain/website
2
0
Fork 0
Code Issues Pull requests Releases Activity

WIP new home page design
Some checks failed
ci/woodpecker/push/woodpecker Pipeline failed
Details

Browse source
This commit is contained in:
nemunaire 2026-05-17 21:46:29 +08:00
commit ca60e3088d
11 changed files with 557 additions and 148 deletions
Download patch file Download diff file Expand all files Collapse all files

72
layouts/partials/big-idea.html Normal file
View file

@ -0,0 +1,72 @@
<!-- ── The big idea: services not records ─────────────── -->
<section class="section section--paper" id="idea">
<div class="container">
<div class="section-head">
<span class="eyebrow"><span class="dot"></span>The big idea</span>
<h2 class="h2">Stop reading zone files.<br>Start managing services.</h2>
<p class="lede">DNS records are an implementation detail. happyDomain groups them by what they actually <em>do</em> — your email, your website, your delegation — so you can edit with intent instead of decoding RFCs.</p>
</div>
<div class="idea-grid">
<div class="idea-col">
<div class="idea-tag"><span class="num">A</span>Without happyDomain</div>
<h3><span class="strike">happydomain.org</span> · zone file</h3>
<pre class="zone-pre"><span class="c">; Zone: happydomain.org.</span>
<span class="c">; TTL = 3600</span>
@ IN <span class="k">SOA</span> ns1 admin 2024010101 3600 900 604800 300
@ IN <span class="k">NS</span> ns1.happydomain.org.
@ IN <span class="k">NS</span> ns2.happydomain.org.
@ IN <span class="k">A</span> <span class="v">93.184.216.34</span>
@ IN <span class="k">AAAA</span> <span class="v">2606:2800:220:1:248:1893:25c8:1946</span>
@ IN <span class="k">MX</span> 10 mail.happydomain.org.
@ IN <span class="k">TXT</span> <span class="v">"v=spf1 include:_spf.eu ~all"</span>
_dmarc IN <span class="k">TXT</span> <span class="v">"v=DMARC1; p=none; rua=…"</span>
mail IN <span class="k">A</span> <span class="v">93.184.216.40</span>
www IN <span class="k">CNAME</span> @
@ IN <span class="k">CAA</span> <span class="v">0 issue "letsencrypt.org"</span></pre>
</div>
<div class="idea-col">
<div class="idea-tag"><span class="num">B</span>With happyDomain</div>
<h3>happydomain.org · services</h3>
<div class="svc">
<div class="svc-row">
<div class="svc-l">
<div class="svc-ico"><i class="bi bi-globe2"></i></div>
<div><div class="svc-name">Website</div><div class="svc-desc">A, AAAA on @ · CNAME on www</div></div>
</div>
<div class="svc-r"><span class="svc-cnt">3</span><span class="svc-ok"><i class="bi bi-check-circle-fill"></i> OK</span></div>
</div>
</div>
<div class="svc">
<div class="svc-row">
<div class="svc-l">
<div class="svc-ico"><i class="bi bi-envelope"></i></div>
<div><div class="svc-name">Email</div><div class="svc-desc">MX, SPF and DMARC policy</div></div>
</div>
<div class="svc-r"><span class="svc-cnt">3</span><span class="svc-ok"><i class="bi bi-check-circle-fill"></i> OK</span></div>
</div>
</div>
<div class="svc">
<div class="svc-row">
<div class="svc-l">
<div class="svc-ico"><i class="bi bi-diagram-3"></i></div>
<div><div class="svc-name">Delegation</div><div class="svc-desc">2 nameservers</div></div>
</div>
<div class="svc-r"><span class="svc-cnt">2</span><span class="svc-ok"><i class="bi bi-check-circle-fill"></i> OK</span></div>
</div>
</div>
<div class="svc">
<div class="svc-row">
<div class="svc-l">
<div class="svc-ico"><i class="bi bi-shield-check"></i></div>
<div><div class="svc-name">TLS / Security</div><div class="svc-desc">CAA · Let's Encrypt only</div></div>
</div>
<div class="svc-r"><span class="svc-cnt">1</span><span class="svc-ok"><i class="bi bi-check-circle-fill"></i> OK</span></div>
</div>
</div>
<p style="font-size:12.5px; color: var(--fg-3); margin: 16px 0 0;">Same zone. Edit by intent, not by record type.</p>
</div>
</div>
</div>
</section>

86
layouts/partials/features.html
View file

@ -1,48 +1,11 @@
<section id="features" class="bg-light" style="scroll-margin-top: 2em">
<div class="container py-4">
<div class="section-title text-center mt-5 mb-5">
<h2 class="mb-3 display-4">{{ i18n "features-title" }}</h2>
<div class="row">
<p
class="offset-sm-1 col-sm-10 offset-md-2 col-md-8 text-muted"
style="font-size: 1.15rem"
>
{{ i18n "features-lead" }}
</p>
</div>
</div>
<div class="alert alert-warning my-5 d-flex">
<div class="display-2">🏗️</div>
<div class="ms-2 flex-fill">
<p class="lead">{{ i18n "features-wip-lead" }}</p>
<p>
{{ i18n "features-wip-p1-start" }}
<strong
>{{ i18n "features-wip-p1-strong" }}
<a
href="https://github.com/happyDomain/happydomain/"
target="_blank"
rel="noopener"
data-umami-event="goto-issue"
>{{ i18n "features-wip-p1-link" }}</a
>.</strong
>
{{ i18n "features-wip-p1-end" }}
</p>
<p>
<a
href="https://feedback.happydomain.org"
target="_blank"
rel="noopener"
data-umami-event="goto-feedback"
>{{ i18n "features-wip-p2-feedback" }}</a
>
{{ i18n "features-wip-p2-start" }}
<u>{{ i18n "features-wip-p2-emph" }}</u>{{ i18n
"features-wip-p2-end" }}
</p>
</div>
<section id="features" class="section" style="scroll-margin-top: 2em">
<div class="container">
<div class="section-head">
<span class="eyebrow"
><span class="dot"></span>{{ i18n "features-eyebrow" }}</span
>
<h2 class="h2">{{ i18n "features-title" }}</h2>
<p class="lede">{{ i18n "features-lead" }}</p>
</div>
<div class="row row-cols-1 row-cols-md-2 row-cols-lg-3">
@ -86,5 +49,38 @@
</div>
{{ end }} {{ end }}
</div>
<div class="alert alert-warning mt-5 d-flex">
<div class="display-2">🏗️</div>
<div class="ms-2 flex-fill">
<p class="lead">{{ i18n "features-wip-lead" }}</p>
<p>
{{ i18n "features-wip-p1-start" }}
<strong
>{{ i18n "features-wip-p1-strong" }}
<a
href="https://github.com/happyDomain/happydomain/"
target="_blank"
rel="noopener"
data-umami-event="goto-issue"
>{{ i18n "features-wip-p1-link" }}</a
>.</strong
>
{{ i18n "features-wip-p1-end" }}
</p>
<p>
<a
href="https://feedback.happydomain.org"
target="_blank"
rel="noopener"
data-umami-event="goto-feedback"
>{{ i18n "features-wip-p2-feedback" }}</a
>
{{ i18n "features-wip-p2-start" }}
<u>{{ i18n "features-wip-p2-emph" }}</u>{{ i18n
"features-wip-p2-end" }}
</p>
</div>
</div>
</div>
</section>

5
layouts/partials/jumbo.html
View file

@ -1,7 +1,6 @@
<style>
.jumbo-hero {
padding: 5rem 0 4rem;
margin-top: -1px;
padding: 8rem 0 5rem;
background: linear-gradient(135deg, var(--hd-accent-subtle, #f0fdf4) 0%, var(--hd-bg-canvas, white) 60%);
}
.hero-eyebrow {
@ -35,7 +34,7 @@
}
.hero-meta .check { color: var(--hd-accent, #22c55e); margin-right: .25rem; }
/* Browser mockup */
.hero-stack { position: relative; padding: 0 20px 20px 0; }
.hero-stack { position: relative; }
.hero-stack .browser:last-child {
position: absolute;
bottom: 0; right: 0;

53
layouts/partials/nav.html
View file

@ -1,7 +1,4 @@
<nav
class="navbar navbar-expand-md sticky-top navbar-light bg-light"
id="mainnav"
>
<nav class="navbar navbar-expand-md fixed-top" id="mainnav">
<div class="container">
<a
class="h1 navbar-brand d-flex align-items-top gap-2 mb-0"
@ -55,7 +52,29 @@
</li>
{{ end }}
</ul>
<div class="d-flex">
<div class="d-flex align-items-center">
<div class="nav-item dropdown">
<a
class="btn btn-sm btn-outline-secondary dropdown-toggle"
href="#"
id="navbarLangDropdown"
role="button"
data-bs-toggle="dropdown"
aria-expanded="false"
>
<i class="bi bi-translate"></i> {{ .Language.Lang | upper }}
</a>
<div
class="dropdown-menu dropdown-menu-end"
aria-labelledby="navbarLangDropdown"
>
{{ range .Site.Home.AllTranslations }}
<a href="{{ .Permalink }}" class="dropdown-item">
{{ .Language }}
</a>
{{ end }}
</div>
</div>
<div class="nav-item nav-ext-links">
{{ if .Site.Params.others_links }} {{ range
.Site.Params.others_links }}
@ -65,33 +84,13 @@
class="nav-icon-link {{ .class }}"
data-umami-event="nav-{{ .id }}"
>
{{ if .icon }}
<i class="bi {{ .icon }}"></i>
{{ end }}
{{ .text }}
</a>
{{ end }} {{ end }}
</div>
<div class="nav-item dropdown">
<a
class="btn btn-outline-secondary dropdown-toggle"
href="#"
id="navbarLangDropdown"
role="button"
data-bs-toggle="dropdown"
aria-expanded="false"
>
<i class="bi bi-globe"></i> {{ .Language.Lang | upper }}
</a>
<div
class="dropdown-menu dropdown-menu-end"
aria-labelledby="navbarLangDropdown"
>
{{ range .Site.Home.AllTranslations }}
<a href="{{ .Permalink }}" class="dropdown-item"
>{{ .Language.LanguageName }}</a
>
{{ end }}
</div>
</div>
</div>
</div>
</div>

18
layouts/partials/work-with.html Normal file
View file

@ -0,0 +1,18 @@
<!-- ── Trust strip ──────────────────────────────────────── -->
<section class="trust">
<div class="container trust-grid">
<div class="trust-tag"><span class="dot"></span>Works with</div>
<div class="trust-list">
<span><i class="bi bi-globe2"></i>OVH</span>
<span><i class="bi bi-leaf"></i>Gandi</span>
<span><i class="bi bi-droplet"></i>DigitalOcean</span>
<span><i class="bi bi-cloud"></i>Cloudflare</span>
<span><i class="bi bi-server"></i>Hetzner</span>
<span><i class="bi bi-tag"></i>Namecheap</span>
<span><i class="bi bi-terminal"></i>BIND</span>
<span><i class="bi bi-hdd-network"></i>Knot DNS</span>
<span><i class="bi bi-cpu"></i>PowerDNS</span>
</div>
<a class="trust-more" href="https://app.happydomain.org/providers/features" target="_blank" rel="noopener">+ 46 more →</a>
</div>
</section>