at-container-registry/pkg/appview/templates/components/nav.html

{{ define "nav" }}
<nav class="navbar">
    <div class="nav-brand">
        <a href="/"><span class="at-protocol">at://</span>Container Registry</a>
    </div>

    <div class="nav-search">
        <form action="/search" method="get">
            <input type="text" name="q" placeholder="Search images..." value="{{ .Query }}" />
        </form>
    </div>

    <div class="nav-links">
        {{ if .User }}
            <div class="user-dropdown">
                <button class="user-menu-btn" id="user-menu-btn" aria-expanded="false" aria-haspopup="true">
                    {{ if .User.Avatar }}
                        <img src="{{ .User.Avatar }}" alt="{{ .User.Handle }}" class="user-avatar">
                    {{ else }}
                        <div class="user-avatar-placeholder">{{ firstChar .User.Handle }}</div>
                    {{ end }}
                    <span class="user-handle">@{{ .User.Handle }}</span>
                    <svg class="dropdown-arrow" width="12" height="12" viewBox="0 0 12 12" fill="currentColor">
                        <path d="M6 9L1 4h10z"/>
                    </svg>
                </button>
                <div class="dropdown-menu" id="user-dropdown-menu" hidden>
                    <a href="/u/{{ .User.Handle }}" class="dropdown-item">Your Repositories</a>
                    <a href="/settings" class="dropdown-item">Settings</a>
                    <hr class="dropdown-divider">
                    <form action="/auth/logout" method="POST">
                        <button type="submit" class="dropdown-item logout-btn">Logout</button>
                    </form>
                </div>
            </div>
        {{ else }}
            <a href="/auth/oauth/login?return_to=/" class="btn-primary">Login</a>
        {{ end }}
    </div>
</nav>
{{ end }}