blob: 17fe7db02354d5ed95358d55efc772c5ea19333f (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
|
{{ $status := .Params.status | default "active" }}
{{/* status -> theme-aware bg/text var pair (all defined in main.css).
active=green, maintained=blue, wip=amber, archived=muted. */}}
{{ $bgVar := "--type-quote" }}{{ $txtVar := "--type-quote-text" }}
{{ if eq $status "maintained" }}{{ $bgVar = "--type-link" }}{{ $txtVar = "--type-link-text" }}{{ end }}
{{ if eq $status "wip" }}{{ $bgVar = "--type-life" }}{{ $txtVar = "--type-life-text" }}{{ end }}
{{ if eq $status "archived" }}{{ $bgVar = "--text-dim" }}{{ $txtVar = "--bg" }}{{ end }}
{{ $badgeStyle := printf "background-color: var(%s); color: var(%s);" $bgVar $txtVar | safeCSS }}
{{/* Full-width banner: page resource named header.* in the project bundle. */}}
{{ $headerImg := .Resources.GetMatch "header.*" }}
<header class="mb-10">
{{ with $headerImg }}
<img src="{{ .RelPermalink }}" alt="" class="w-full h-48 md:h-64 object-cover rounded-lg mb-6" loading="lazy" />
{{ end }}
<div class="flex flex-wrap items-center justify-between gap-3 mb-2">
<h1 class="text-4xl md:text-5xl font-bold text-accent font-oxanium">{{ .Title }}</h1>
<span class="flex-shrink-0 px-3 py-1 rounded-full text-xs font-semibold" style="{{ $badgeStyle }}">
{{ i18n (printf "status-%s" $status) }}
</span>
</div>
{{ with .Params.tagline }}
<p class="text-xl text-text-dim mb-4">{{ . }}</p>
{{ end }}
<div class="flex flex-wrap items-center justify-between gap-3">
{{ with .Params.repo_url }}
<a href="{{ . }}" target="_blank" rel="noopener noreferrer" class="btn btn-sm inline-flex items-center gap-2">
{{ i18n "viewRepo" }}
<i data-feather="external-link" class="w-4 h-4" aria-hidden="true"></i>
<span class="sr-only">{{ i18n "opensInNewTab" }}</span>
</a>
{{ end }}
{{ with .Params.tags }}
<ul class="flex flex-wrap gap-2 ml-auto">
{{ range . }}
<li><a href="/tags/{{ . | urlize }}/" class="px-2 py-1 rounded text-xs bg-surface text-text hover:text-accent transition-colors focus:outline-none focus:ring-2 focus:ring-accent">{{ . }}</a></li>
{{ end }}
</ul>
{{ end }}
</div>
</header>
|
