74 lines
4.4 KiB
HTML
74 lines
4.4 KiB
HTML
{{ $page := .page }}
|
|
<nav class="print:hidden bg-primary shadow-md dark:shadow-none text-neutral-200">
|
|
<div class="container mx-auto flex flex-col md:flex-row px-2 sm:px-4">
|
|
<div class="flex flex-row justify-between items-center">
|
|
<a href="/" class="block pr-4 py-4 md:my-0">
|
|
<img class="block" src="/media/logo-text.png" width="154" height="28" alt="Blake Rain">
|
|
</a>
|
|
<button id="nav-menu-toggle" type="button" class="md:hidden p-4">
|
|
{{ partial "icons/icon" (dict "vendor" "lucide" "name" "menu") }}
|
|
<span class="sr-only">Toggle Menu</span>
|
|
</button>
|
|
</div>
|
|
{{ with site.Menus.main }}
|
|
<div id="nav-menu" class="md:flex flex-col md:flex-row hidden">
|
|
{{ range . }}
|
|
{{ $active := $page.IsMenuCurrent .Menu . }}
|
|
{{ $active = or $active ($page.HasMenuCurrent .Menu .) }}
|
|
<a
|
|
href="{{ .URL }}"
|
|
class="px-4 py-6 transition-colors hover:bg-primary-dark/50 hover:text-neutral-50
|
|
{{ if $active }}bg-primary-dark/50 text-neutral-50{{ end }}">
|
|
{{ .Name }}
|
|
</a>
|
|
{{ end }}
|
|
</div>
|
|
{{ end }}
|
|
<div class="hidden md:flex flex-row items-center gap-2 ml-auto">
|
|
<a href="https://git.blakerain.com"
|
|
class="text-neutral-200/75 hover:text-neutral-200"
|
|
title="Gitea instance"
|
|
target="_blank"
|
|
rel="noreferrer">
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
viewBox="0 0 24 24"
|
|
style="width: 1.5em"
|
|
fill="currentColor">
|
|
<path d="M4.209 4.603c-.247 0-.525.02-.84.088-.333.07-1.28.283-2.054 1.027C-.403 7.25.035 9.685.089 10.052c.065.446.263 1.687 1.21 2.768 1.749 2.141 5.513 2.092 5.513 2.092s.462 1.103 1.168 2.119c.955 1.263 1.936 2.248 2.89 2.367 2.406 0 7.212-.004 7.212-.004s.458.004 1.08-.394c.535-.324 1.013-.893 1.013-.893s.492-.527 1.18-1.73c.21-.37.385-.729.538-1.068 0 0 2.107-4.471 2.107-8.823-.042-1.318-.367-1.55-.443-1.627-.156-.156-.366-.153-.366-.153s-4.475.252-6.792.306c-.508.011-1.012.023-1.512.027v4.474l-.634-.301c0-1.39-.004-4.17-.004-4.17-1.107.016-3.405-.084-3.405-.084s-5.399-.27-5.987-.324c-.187-.011-.401-.032-.648-.032zm.354 1.832h.111s.271 2.269.6 3.597C5.549 11.147 6.22 13 6.22 13s-.996-.119-1.641-.348c-.99-.324-1.409-.714-1.409-.714s-.73-.511-1.096-1.52C1.444 8.73 2.021 7.7 2.021 7.7s.32-.859 1.47-1.145c.395-.106.863-.12 1.072-.12zm8.33 2.554c.26.003.509.127.509.127l.868.422-.529 1.075a.686.686 0 0 0-.614.359.685.685 0 0 0 .072.756l-.939 1.924a.69.69 0 0 0-.66.527.687.687 0 0 0 .347.763.686.686 0 0 0 .867-.206.688.688 0 0 0-.069-.882l.916-1.874a.667.667 0 0 0 .237-.02.657.657 0 0 0 .271-.137 8.826 8.826 0 0 1 1.016.512.761.761 0 0 1 .286.282c.073.21-.073.569-.073.569-.087.29-.702 1.55-.702 1.55a.692.692 0 0 0-.676.477.681.681 0 1 0 1.157-.252c.073-.141.141-.282.214-.431.19-.397.515-1.16.515-1.16.035-.066.218-.394.103-.814-.095-.435-.48-.638-.48-.638-.467-.301-1.116-.58-1.116-.58s0-.156-.042-.27a.688.688 0 0 0-.148-.241l.516-1.062 2.89 1.401s.48.218.583.619c.073.282-.019.534-.069.657-.24.587-2.1 4.317-2.1 4.317s-.232.554-.748.588a1.065 1.065 0 0 1-.393-.045l-.202-.08-4.31-2.1s-.417-.218-.49-.596c-.083-.31.104-.691.104-.691l2.073-4.272s.183-.37.466-.497a.855.855 0 0 1 .35-.077z"/>
|
|
</svg>
|
|
</a>
|
|
<a href="https://github.com/BlakeRain"
|
|
class="text-neutral-200/75 hover:text-neutral-200"
|
|
title="GitHub profile"
|
|
target="_blank"
|
|
rel="noreferrer">
|
|
{{ partial "icons/icon" (dict "vendor" "bootstrap" "name" "github") }}
|
|
</a>
|
|
<a href="https://mastodonapp.uk/@BlakeRain"
|
|
class="text-neutral-200/75 hover:text-neutral-200"
|
|
title="@BlakeRain@mastodonapp.uk"
|
|
target="_blank"
|
|
rel="noreferrer">
|
|
{{ partial "icons/icon" (dict "vendor" "bootstrap" "name" "mastodon") }}
|
|
</a>
|
|
<a href="/blog/index.xml"
|
|
class="text-neutral-200/75 hover:text-neutral-200"
|
|
title="Blog RSS feed"
|
|
target="_blank"
|
|
rel="noreferrer">
|
|
{{ partial "icons/icon" (dict "vendor" "lucide" "name" "rss") }}
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
<script type="text/javascript">
|
|
window.addEventListener("DOMContentLoaded", () => {
|
|
const navMenu = document.getElementById("nav-menu");
|
|
document.getElementById("nav-menu-toggle").addEventListener("click", () => {
|
|
navMenu.classList.toggle("hidden");
|
|
navMenu.classList.toggle("flex");
|
|
});
|
|
});
|
|
</script>
|