The landing sections had ids but no visible anchor, unlike About/Legal. Add a hover-revealed # link on each section title (Status, Features, Screenshots, Values, FAQ, Collaborate, Get it) and widen the reveal rule beyond .doc so it applies to the home too.
130 lines
4.6 KiB
HTML
130 lines
4.6 KiB
HTML
{{ define "main" }}
|
|
{{ $lang := .Site.Language.Lang }}
|
|
<section class="hero" id="top">
|
|
<div class="hero-copy">
|
|
<h1>{{ .Params.hero.title }}</h1>
|
|
<p class="tagline">{{ .Params.hero.tagline }}</p>
|
|
<p class="lead">{{ .Params.hero.lead }}</p>
|
|
{{ .Content }}
|
|
{{ with .Site.GetPage "/about" }}
|
|
<p><a class="text-link" href="{{ .RelPermalink }}">{{ T "aboutCta" }} →</a></p>
|
|
{{ end }}
|
|
{{ partial "store-badges.html" . }}
|
|
</div>
|
|
{{ $shot := resources.Get (printf "screenshots/%s/home.png" $lang) | fingerprint }}
|
|
{{ with $shot }}
|
|
<div class="hero-shot">
|
|
<div class="phone"><img src="{{ .RelPermalink }}" alt="Tane" loading="eager" /></div>
|
|
</div>
|
|
{{ end }}
|
|
</section>
|
|
|
|
<section class="status" id="status">
|
|
<span class="badge-beta">{{ T "statusBadge" }}</span>
|
|
<div>
|
|
<h2>{{ T "statusTitle" }} <a class="heading-anchor" href="#status" aria-label="Permalink">#</a></h2>
|
|
<p>{{ T "statusBody" }}</p>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="pillars" id="pillars">
|
|
{{ range .Params.pillars }}
|
|
<article class="pillar">
|
|
<div class="pillar-icon" aria-hidden="true">{{ .icon }}</div>
|
|
<h2>{{ .title }}</h2>
|
|
<p>{{ .body }}</p>
|
|
</article>
|
|
{{ end }}
|
|
</section>
|
|
|
|
{{ with .Params.features }}
|
|
<section class="features" id="features">
|
|
<h2>{{ .title }} <a class="heading-anchor" href="#features" aria-label="Permalink">#</a></h2>
|
|
{{ with .intro }}<p class="features-intro">{{ . }}</p>{{ end }}
|
|
<div class="feature-groups">
|
|
{{ range .groups }}
|
|
<article class="feature-group">
|
|
<div class="feature-icon" aria-hidden="true">{{ .icon }}</div>
|
|
<h3>{{ .title }}</h3>
|
|
<ul>
|
|
{{ range .items }}<li>{{ . }}</li>{{ end }}
|
|
</ul>
|
|
</article>
|
|
{{ end }}
|
|
</div>
|
|
</section>
|
|
{{ end }}
|
|
|
|
{{ $screens := slice "home" "inventory" "market" "calendar" "detail" }}
|
|
<section class="shots" id="screenshots">
|
|
<h2>{{ T "screenshotsTitle" }} <a class="heading-anchor" href="#screenshots" aria-label="Permalink">#</a></h2>
|
|
<div class="shot-row">
|
|
{{ range $s := $screens }}
|
|
{{ $img := resources.Get (printf "screenshots/%s/%s.png" $lang $s) | fingerprint }}
|
|
{{ with $img }}
|
|
<figure class="phone-fig">
|
|
<div class="phone"><img src="{{ .RelPermalink }}" alt="Tane {{ $s }}" loading="lazy" /></div>
|
|
<figcaption>{{ T (printf "screenCap%s" (title $s)) }}</figcaption>
|
|
</figure>
|
|
{{ end }}
|
|
{{ end }}
|
|
</div>
|
|
{{ $rtl := resources.Get "screenshots/rtl/inventory.png" | fingerprint }}
|
|
{{ with $rtl }}
|
|
<div class="rtl-note">
|
|
<div class="phone phone-sm"><img src="{{ .RelPermalink }}" alt="Tane RTL" loading="lazy" dir="rtl" /></div>
|
|
<div>
|
|
<h3>{{ T "rtlNoteTitle" }}</h3>
|
|
<p>{{ T "rtlNoteBody" }}</p>
|
|
</div>
|
|
</div>
|
|
{{ end }}
|
|
</section>
|
|
|
|
<section class="values" id="values">
|
|
<h2>{{ .Params.values.title }} <a class="heading-anchor" href="#values" aria-label="Permalink">#</a></h2>
|
|
<ul>
|
|
{{ range .Params.values.points }}<li>{{ . }}</li>{{ end }}
|
|
</ul>
|
|
</section>
|
|
|
|
<section class="faq" id="faq">
|
|
<h2>{{ T "faqTitle" }} <a class="heading-anchor" href="#faq" aria-label="Permalink">#</a></h2>
|
|
<dl>
|
|
<dt>{{ T "faqFreeQ" }}</dt><dd>{{ T "faqFreeA" }}</dd>
|
|
<dt>{{ T "faqAccountQ" }}</dt><dd>{{ T "faqAccountA" }}</dd>
|
|
<dt>{{ T "faqOfflineQ" }}</dt><dd>{{ T "faqOfflineA" }}</dd>
|
|
<dt>{{ T "faqLegalQ" }}</dt><dd>{{ T "faqLegalA" }} <a href="{{ "/legal/seeds/" | relLangURL }}">→</a></dd>
|
|
<dt>{{ T "faqDataQ" }}</dt><dd>{{ T "faqDataA" }} <a href="{{ "/legal/privacy/" | relLangURL }}">→</a></dd>
|
|
</dl>
|
|
</section>
|
|
|
|
<section class="collab" id="collab">
|
|
<h2>{{ T "collabTitle" }} <a class="heading-anchor" href="#collab" aria-label="Permalink">#</a></h2>
|
|
<p class="lead">{{ T "collabIntro" }}</p>
|
|
<div class="collab-grid">
|
|
<article>
|
|
<h3>{{ with .Site.Params.weblateURL }}<a href="{{ . }}">{{ T "collabTranslateT" }}</a>{{ else }}{{ T "collabTranslateT" }}{{ end }}</h3>
|
|
<p>{{ T "collabTranslateB" }}</p>
|
|
</article>
|
|
<article>
|
|
<h3>{{ T "collabTestT" }}</h3>
|
|
<p>{{ T "collabTestB" }}</p>
|
|
</article>
|
|
<article>
|
|
<h3>{{ with .Site.Params.sourceURL }}<a href="{{ . }}">{{ T "collabCodeT" }}</a>{{ else }}{{ T "collabCodeT" }}{{ end }}</h3>
|
|
<p>{{ T "collabCodeB" }}</p>
|
|
</article>
|
|
<article>
|
|
<h3>{{ T "collabFundT" }}</h3>
|
|
<p>{{ T "collabFundB" }}</p>
|
|
</article>
|
|
</div>
|
|
<p><a class="badge" href="mailto:{{ .Site.Params.email }}">{{ T "collabContact" }}</a></p>
|
|
</section>
|
|
|
|
<section class="get-it" id="get">
|
|
<h2>{{ T "getItTitle" }} <a class="heading-anchor" href="#get" aria-label="Permalink">#</a></h2>
|
|
{{ partial "store-badges.html" . }}
|
|
</section>
|
|
{{ end }}
|