Hemera/nixie-ci
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add user-dropdown

Browse source 
Signed-off-by: Marcel Müller <neikos@neikos.email>
This commit is contained in:
Marcel Müller 2026-01-18 15:37:34 +01:00
parent 79305724f2
commit f45a43c852
7 changed files with 107 additions and 18 deletions
Download patch file Download diff file Expand all files Collapse all files

24
nixie-server/templates/base.tera.html
View file

@ -5,6 +5,7 @@
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<script src="https://cdn.jsdelivr.net/npm/@tailwindcss/browser@4"></script>
<script type="module" src="https://cdn.jsdelivr.net/gh/starfederation/datastar@1.0.0-RC.7/bundles/datastar.js"></script>
{% block head %}
<title>{% block title %}{% endblock title%} - Nixie CI</title>
{% endblock head%}
@ -12,15 +13,32 @@
<body class="min-h-screen flex flex-col">
<nav class="bg-orange-300 px-2 py-2 inset-shadow-2xs border-b-2 border-orange-900">
<div class="mx-auto container flex select-none">
<div class="mx-auto container flex select-none space-x-4">
<a href="/" class="outline-2 outline-gray-800 bg-gray-700 rounded text-white p-2">
<span class="text-green-200">>_</span>
Nixie CI ❄️
</a>
<div></div>
<a href="/jobs/" class="outline-2 outline-cyan-800 bg-cyan-700 rounded text-white p-2">Jobs</a>
<div class="grow"></div>
<a href="/login" class="outline-2 outline-r-none hover:outline-emerald-900 outline-emerald-700 p-2 select-none rounded-l bg-emerald-600 text-white">Sign in</a>
<a href="/register" class="outline-2 hover:outline-emerald-900 outline-blue-700 p-2 select-none rounded-r bg-blue-600 text-white">Register</a>
{% if not logged_in %}
<a href="/login" class="outline-2 outline-r-none hover:outline-emerald-900 outline-emerald-700 p-2 select-none rounded-l bg-emerald-600 text-white">Sign in</a>
<a href="/register" class="outline-2 hover:outline-emerald-900 outline-blue-700 p-2 select-none rounded-r bg-blue-600 text-white">Register</a>
{% else %}
<div class="relative flex" data-on:click__outside="$openProfileDropdown = false">
<a href="/users/{{ current_user.id }}" class="inline-block border-2 border-r-1 hover:border-emerald-900 border-emerald-700 p-2 select-none rounded-l bg-emerald-600 text-white">
{{ current_user.username }}
</a>
<button data-on:click="$openProfileDropdown = !$openProfileDropdown"
class="border-2 border-l-1 hover:border-emerald-900 border-emerald-700 p-2 select-none rounded-r bg-emerald-600 text-white cursor-pointer">&#9660;</button>
<div data-class:hidden="!$openProfileDropdown"
class="hidden absolute top-[calc(100%+0.4rem)] right-0 bg-orange-300 p-2 rounded-b border border-orange-800 shadow-lg md:min-w-40 flex flex-col divide-y divide-orange-800">
<a class="block p-2 hover:bg-orange-800 hover:text-white" href="/users/{{ current_user.id }}">Profile</a>
<a class="block p-2 hover:bg-orange-800 hover:text-white" href="/logout">Logout</a>
</div>
</div>
{% endif %}
</div>
</nav>
<main class="grow px-2 flex flex-col inset-shadow-sm">