blob: 050f27f16981f128113b14a4126c2edd5f2ebea7 (
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
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
|
<header class="fixed top-0 left-0 right-0 z-50 frosted-bar border-b group/header">
<nav class="container mx-auto px-4 py-4 flex items-center justify-between">
<!-- Logo and Site Name -->
{{ $homeLink := "/" }}
{{ if eq .Lang "it" }}
{{ $homeLink = "/it/" }}
{{ end }}
<a href="{{ $homeLink }}" class="flex items-center gap-2 hover:opacity-80 transition-opacity">
<img src="/images/lampD.png" alt="Logo" style="width: 40px; height: 40px; max-width: none;" class="flex-shrink-0">
<span class="hidden md:inline font-bold text-lg text-accent font-oxanium">danix.xyz</span>
</a>
<!-- Desktop menu (hidden on mobile) -->
<div class="hidden md:flex items-center gap-8">
{{ $currentPath := strings.TrimSuffix "/" .RelPermalink }}
{{ range .Site.Menus.main }}
{{ $menuPath := strings.TrimSuffix "/" .URL }}
{{ $isActive := eq $menuPath $currentPath }}
{{ $isExternal := .Params.external }}
{{ if .HasChildren }}
{{/* Parent link only here; its children render as a full-width
second row below the bar (see the submenu band after </nav>).
No ARIA menu roles: CSS-only hover/focus, not an arrow-key menu;
group-focus-within on the header gives keyboard reveal. */}}
<a
href="{{ .URL }}"
class="text-sm transition-colors inline-flex items-center gap-1 rounded focus:outline-none focus:ring-2 focus:ring-accent {{ if $isActive }}text-accent font-bold{{ else }}hover:text-accent{{ end }}"
{{ if $isActive }}aria-current="page"{{ end }}
>
{{ i18n .Name }}
<i data-feather="chevron-down" class="w-3 h-3" aria-hidden="true"></i>
</a>
{{ else }}
<a
href="{{ .URL }}"
class="text-sm transition-colors {{ if $isActive }}text-accent font-bold{{ else }}hover:text-accent{{ end }}"
{{ if $isActive }}aria-current="page"{{ end }}
{{ if $isExternal }}target="_blank" rel="noopener noreferrer"{{ end }}
>
{{ if $isExternal }}{{ .Name }}{{ else }}{{ i18n .Name }}{{ end }}
</a>
{{ end }}
{{ end }}
</div>
<!-- Right side controls: Search, Language, Theme, Menu -->
<div class="flex items-center gap-4 md:gap-6">
<!-- Search button (desktop only) -->
<button
x-data
@click="$dispatch('open-search')"
aria-label="{{ i18n "searchArticles" }}"
class="hidden md:flex p-2 rounded hover:bg-surface transition-colors focus:outline-none focus:ring-2 focus:ring-accent"
>
<i data-feather="search" class="w-5 h-5" aria-hidden="true"></i>
</button>
<!-- Language switcher (desktop) -->
<div class="hidden md:flex gap-2">
{{ $currentLang := .Page.Language }}
{{ $currentPath := .RelPermalink }}
{{ range site.Languages }}
{{ $langCode := .Lang }}
{{ $langName := .LanguageName }}
{{ $current := eq $langCode $currentLang }}
<!-- Build the translated URL by replacing language prefix -->
{{ $url := $currentPath }}
{{ if eq $langCode "en" }}
{{ if hasPrefix $currentPath "/it/" }}
{{ $url = strings.TrimPrefix "/it" $currentPath }}
{{ end }}
{{ else }}
{{ if not (hasPrefix $currentPath "/it/") }}
{{ $url = printf "/it%s" $currentPath }}
{{ end }}
{{ end }}
<a
href="{{ $url }}"
class="px-2 py-1 text-sm rounded transition-colors {{ if $current }}bg-accent text-white{{ else }}hover:bg-surface{{ end }}"
>
{{ $langName }}
</a>
{{ end }}
</div>
<!-- Theme toggle button -->
<button
id="theme-toggle"
aria-label="{{ i18n "toggleTheme" }}"
class="p-2 rounded hover:bg-surface transition-colors"
>
<i id="theme-icon-sun" data-feather="sun" class="w-5 h-5" aria-hidden="true"></i>
<i id="theme-icon-moon" data-feather="moon" class="w-5 h-5" aria-hidden="true"></i>
</button>
<!-- Hamburger menu button (mobile only) -->
<button
x-data
@click="$dispatch('toggle-menu')"
aria-label="{{ i18n "toggleMenu" }}"
aria-controls="hamburger-menu"
class="md:hidden p-2 rounded hover:bg-surface transition-colors"
>
<i data-feather="menu" class="w-5 h-5"></i>
</button>
</div>
</nav>
<!-- Desktop submenu: second row inside the same frosted glass, revealed on
hover/focus of the bar (no separate background — header expands) -->
{{ range .Site.Menus.main }}
{{ if .HasChildren }}
<div class="hidden md:group-hover/header:flex md:group-focus-within/header:flex">
<ul class="container mx-auto px-4 py-3 flex items-center justify-center gap-8">
{{ range .Children }}
{{ $childExternal := .Params.external }}
{{/* Curated entries (Packages) carry an i18n key as .Name; project
pages may set a literal menu name, else fall back to the page
title. */}}
{{ $label := "" }}
{{ if $childExternal }}
{{ $label = .Name }}
{{ else if and .Name (ne (i18n .Name) "") }}
{{ $label = i18n .Name }}
{{ else if .Name }}
{{ $label = .Name }}
{{ else if .Page }}
{{ $label = .Page.LinkTitle }}
{{ else }}
{{ $label = .Name }}
{{ end }}
<li>
<a
href="{{ .URL }}"
class="text-sm whitespace-nowrap text-text-dim hover:text-accent transition-colors rounded focus:outline-none focus:ring-2 focus:ring-accent"
{{ if $childExternal }}target="_blank" rel="noopener noreferrer"{{ end }}
>
{{ $label }}
</a>
</li>
{{ end }}
</ul>
</div>
{{ end }}
{{ end }}
<!-- Mobile hamburger overlay menu -->
{{ partial "hamburger-menu.html" . }}
</header>
|
