mirror of
https://github.com/nunocoracao/blowfish.git
synced 2026-10-22 11:45:22 +00:00
Metalhearf
134a044262
The submenu panel carried both `pt-2` and `p-5`. Tailwind emits shorthand utilities before their longhand counterparts, so `padding-top` resolved to `0.5rem` while the other three sides stayed at `1.25rem`, regardless of the order the classes appear in the markup. The first submenu entry sat flush against the top edge. This went unnoticed while the panel was translucent. v3 made it opaque, which draws the edge and exposes the imbalance. Drop `pt-2` so the panel keeps the uniform `p-5` it was styled for. No new utility classes, so the compiled stylesheet is unchanged.
126 lines
4.4 KiB
HTML
126 lines
4.4 KiB
HTML
<nav aria-label="{{ i18n "nav.main_menu" }}" class="flex items-center gap-x-5 h-12">
|
|
{{ if .Site.Menus.main }}
|
|
{{ range .Site.Menus.main }}
|
|
{{ template "DesktopMenu" . }}
|
|
{{ end }}
|
|
{{ end }}
|
|
|
|
{{ partial "header/components/translations.html" . }}
|
|
{{ if .Site.Params.enableA11y | default false }}
|
|
{{ partial "header/components/a11y.html" (dict "prefix" "desktop-") }}
|
|
{{ end }}
|
|
|
|
{{ if .Site.Params.footer.showAppearanceSwitcher | default false }}
|
|
<div class="flex items-center">
|
|
<button
|
|
id="appearance-switcher"
|
|
aria-label="{{ i18n "footer.dark_appearance" }}"
|
|
type="button"
|
|
class="text-sm bf-icon-color-hover"
|
|
title="{{ i18n "footer.dark_appearance" }}">
|
|
<div class="flex items-center justify-center dark:hidden">
|
|
{{ partial "icon.html" "moon" }}
|
|
</div>
|
|
<div class="items-center justify-center hidden dark:flex">
|
|
{{ partial "icon.html" "sun" }}
|
|
</div>
|
|
</button>
|
|
</div>
|
|
{{ end }}
|
|
|
|
{{ if .Site.Params.enableSearch | default false }}
|
|
<button
|
|
id="search-button"
|
|
aria-label="{{ i18n "search.open_button_title" }}"
|
|
class="flex items-center gap-2 rounded-lg border bf-border-color bf-border-color-hover bg-neutral-100/50 px-2 py-1 text-sm text-neutral-500 transition-colors hover:text-primary-600 dark:bg-neutral-800/50 dark:text-neutral-400 dark:hover:text-primary-400"
|
|
title="{{ i18n "search.open_button_title" }}">
|
|
{{ partial "icon.html" "search" }}
|
|
<kbd
|
|
id="search-shortcut-hint"
|
|
class="pointer-events-none font-sans text-xs text-neutral-500 dark:text-neutral-400"
|
|
aria-hidden="true">
|
|
⌘K
|
|
</kbd>
|
|
</button>
|
|
{{ end }}
|
|
</nav>
|
|
|
|
{{ define "DesktopMenu" }}
|
|
{{ if .HasChildren }}
|
|
<div class="nested-menu">
|
|
<div class="cursor-pointer flex items-center">
|
|
<a
|
|
{{ if .URL }}
|
|
href="{{ .URL }}"
|
|
{{ if or (strings.HasPrefix .URL "http:" ) (strings.HasPrefix .URL "https:" ) }}
|
|
target="_blank"
|
|
{{ end }}
|
|
{{ else }}
|
|
tabindex="0"
|
|
{{ end }}
|
|
{{ with or .Name .Pre }}aria-label="{{ . }}"{{ end }}
|
|
aria-haspopup="true"
|
|
aria-expanded="false"
|
|
class="flex items-center text-sm font-medium bf-icon-color-hover"
|
|
title="{{ .Title }}">
|
|
{{ if .Pre }}
|
|
<span {{ if and .Pre .Name }}class="mr-1"{{ end }}>
|
|
{{ partial "icon.html" .Pre }}
|
|
</span>
|
|
{{ end }}
|
|
<span class="text-sm font-medium break-normal" title="{{ .Title }}">
|
|
{{ .Name | markdownify }}
|
|
</span>
|
|
<span>
|
|
{{ partial "icon.html" "chevron-down" }}
|
|
</span>
|
|
</a>
|
|
</div>
|
|
<div class="menuhide">
|
|
<div class="p-5 mt-2 rounded-xl border border-neutral-200/80 bg-neutral/95 shadow-2xl shadow-neutral-900/20 dark:border-neutral-700/80 dark:bg-neutral-800/95">
|
|
<div class="flex flex-col space-y-3">
|
|
{{ range .Children }}
|
|
<a
|
|
href="{{ .URL }}"
|
|
{{ if or (strings.HasPrefix .URL "http:" ) (strings.HasPrefix .URL "https:" ) }}
|
|
target="_blank"
|
|
{{ end }}
|
|
{{ with or .Name .Pre }}aria-label="{{ . }}"{{ end }}
|
|
class="flex items-center bf-icon-color-hover">
|
|
{{ if .Pre }}
|
|
<span {{ if and .Pre .Name }}class="mr-1"{{ end }}>
|
|
{{ partial "icon.html" .Pre }}
|
|
</span>
|
|
{{ end }}
|
|
<span class="text-sm font-sm" title="{{ .Title }}">
|
|
{{ .Name | markdownify }}
|
|
</span>
|
|
</a>
|
|
{{ end }}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{{ else }}
|
|
<a
|
|
href="{{ .URL }}"
|
|
{{ if or (strings.HasPrefix .URL "http:" ) (strings.HasPrefix .URL "https:" ) }}
|
|
target="_blank"
|
|
{{ end }}
|
|
class="flex items-center bf-icon-color-hover"
|
|
{{ with or .Name .Pre }}aria-label="{{ . }}"{{ end }}
|
|
title="{{ .Title }}">
|
|
{{ if .Pre }}
|
|
<span {{ if and .Pre .Name }}class="mr-1"{{ end }}>
|
|
{{ partial "icon.html" .Pre }}
|
|
</span>
|
|
{{ end }}
|
|
{{ if .Name }}
|
|
<span class="text-sm font-medium break-normal">
|
|
{{ .Name | markdownify }}
|
|
</span>
|
|
{{ end }}
|
|
</a>
|
|
{{ end }}
|
|
{{ end }}
|