mirror of
https://github.com/git-pkgs/proxy.git
synced 2026-07-06 22:33:19 -04:00
8c28b02035- Move third-party JS into static/vendor/ and add lucide for icons; refine .gitignore so embedded vendor dirs aren't caught by the Go vendor rule. - Replace folder/file emojis in the source browser with lucide icons. - Wrap the header logo and title in a single anchor so the icon is clickable. - Drop the redundant "Powered by git-pkgs" footer block; add a GitHub repo link to the About column and bump the ecosystem count from 16+ to 17+. - Sticky footer pattern: body is min-h-full flex column with main growing to fill, so the footer sits at the bottom of short pages. - Hamburger menu under md: search and nav links collapse into a drawer toggled by a menu button; theme toggle stays visible at both sizes.
60 lines
3.9 KiB
HTML
60 lines
3.9 KiB
HTML
{{define "header"}}
|
|
<header class="sticky top-0 z-50 border-b border-gray-200 dark:border-gray-800 bg-white/80 dark:bg-gray-900/80 backdrop-blur-sm">
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
<div class="flex justify-between items-center h-16 gap-4">
|
|
<a href="/ui/" class="flex items-center gap-2 text-xl font-semibold hover:text-gray-700 dark:hover:text-gray-300 shrink-0">
|
|
<svg class="w-8 h-8 text-primary-600 dark:text-primary-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M20 7l-8-4-8 4m16 0l-8 4m8-4v10l-8 4m0-10L4 7m8 4v10M4 7v10l8 4"/>
|
|
</svg>
|
|
<span>git-pkgs proxy</span>
|
|
</a>
|
|
<div class="hidden md:block flex-1 max-w-md mx-4">
|
|
{{template "search_form" .}}
|
|
</div>
|
|
<nav class="hidden md:flex items-center gap-6">
|
|
{{template "nav_links" .}}
|
|
</nav>
|
|
<div class="flex items-center gap-2">
|
|
<button id="theme-toggle" class="p-2 rounded-lg hover:bg-gray-100 dark:hover:bg-gray-800 transition-colors" aria-label="Toggle theme">
|
|
<svg class="w-5 h-5 hidden dark:block" fill="currentColor" viewBox="0 0 20 20">
|
|
<path d="M10 2a1 1 0 011 1v1a1 1 0 11-2 0V3a1 1 0 011-1zm4 8a4 4 0 11-8 0 4 4 0 018 0zm-.464 4.95l.707.707a1 1 0 001.414-1.414l-.707-.707a1 1 0 00-1.414 1.414zm2.12-10.607a1 1 0 010 1.414l-.706.707a1 1 0 11-1.414-1.414l.707-.707a1 1 0 011.414 0zM17 11a1 1 0 100-2h-1a1 1 0 100 2h1zm-7 4a1 1 0 011 1v1a1 1 0 11-2 0v-1a1 1 0 011-1zM5.05 6.464A1 1 0 106.465 5.05l-.708-.707a1 1 0 00-1.414 1.414l.707.707zm1.414 8.486l-.707.707a1 1 0 01-1.414-1.414l.707-.707a1 1 0 011.414 1.414zM4 11a1 1 0 100-2H3a1 1 0 000 2h1z"/>
|
|
</svg>
|
|
<svg class="w-5 h-5 block dark:hidden" fill="currentColor" viewBox="0 0 20 20">
|
|
<path d="M17.293 13.293A8 8 0 016.707 2.707a8.001 8.001 0 1010.586 10.586z"/>
|
|
</svg>
|
|
</button>
|
|
<button id="nav-toggle" type="button" class="md:hidden p-2 rounded-lg hover:bg-gray-100 dark:hover:bg-gray-800 transition-colors" aria-label="Toggle menu" aria-expanded="false" aria-controls="mobile-nav">
|
|
<span class="nav-icon-open"><i data-lucide="menu" class="w-5 h-5"></i></span>
|
|
<span class="nav-icon-close hidden"><i data-lucide="x" class="w-5 h-5"></i></span>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
<div id="mobile-nav" class="hidden md:hidden pb-4 space-y-3">
|
|
{{template "search_form" .}}
|
|
<nav class="flex flex-col">
|
|
{{template "nav_links" .}}
|
|
</nav>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
{{end}}
|
|
|
|
{{define "search_form"}}
|
|
<form action="/ui/search" method="get" class="relative">
|
|
<input
|
|
type="text"
|
|
name="q"
|
|
placeholder="Search packages..."
|
|
class="w-full px-4 py-2 pl-10 text-sm bg-gray-100 dark:bg-gray-800 border border-gray-300 dark:border-gray-700 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400"
|
|
/>
|
|
<svg class="absolute left-3 top-1/2 transform -translate-y-1/2 w-4 h-4 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"/>
|
|
</svg>
|
|
</form>
|
|
{{end}}
|
|
|
|
{{define "nav_links"}}
|
|
<a href="/ui/install" class="text-sm text-gray-600 dark:text-gray-400 hover:text-gray-900 dark:hover:text-gray-100 py-2 md:py-0">Install</a>
|
|
<a href="/health" class="text-sm text-gray-600 dark:text-gray-400 hover:text-gray-900 dark:hover:text-gray-100 py-2 md:py-0">Health</a>
|
|
<a href="/stats" class="text-sm text-gray-600 dark:text-gray-400 hover:text-gray-900 dark:hover:text-gray-100 py-2 md:py-0">API</a>
|
|
{{end}}
|