From 4f99d51f9eb2220ceaa5c47e4f963ec2a5951924 Mon Sep 17 00:00:00 2001 From: Erik Thiele Date: Mon, 20 Jul 2026 23:01:22 +0200 Subject: [PATCH] Redesign header: theme toggle, user avatar, burger menu MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit The app was dark-only with the email shown as plain text and a bare "Abmelden" button. Header now has: - A light/dark theme toggle (sun/moon icon). Choice persists via localStorage and is applied before first paint (inline script in ) to avoid a flash of the wrong theme; falls back to the system preference on first visit. Added a light CSS variable set alongside the existing dark palette. - A circular user icon (head-and-shoulders) showing the email as a tooltip, replacing the plain-text address. - A burger-menu dropdown with the email, disabled placeholder items ("Tags verwalten", "Einstellungen" — marked "bald") to make room for future features, and the actual Abmelden action. Dropdown opens/closes via a small vanilla-JS handler in base.html (click outside or Escape closes it), consistent with the project's no-build-step, mostly-HTMX frontend. Co-Authored-By: Claude Sonnet 5 --- app/templates/_icons.html | 28 ++++++++++++ app/templates/base.html | 90 +++++++++++++++++++++++++++++++++++++++ app/templates/index.html | 30 +++++++++++-- 3 files changed, 144 insertions(+), 4 deletions(-) diff --git a/app/templates/_icons.html b/app/templates/_icons.html index cb8ad39..e3c0373 100644 --- a/app/templates/_icons.html +++ b/app/templates/_icons.html @@ -49,3 +49,31 @@ {% macro spinner(size=16) -%} {{ base('', size) }} {%- endmacro %} + +{% macro sun(size=16) -%} +{{ base('', size) }} +{%- endmacro %} + +{% macro moon(size=16) -%} +{{ base('', size) }} +{%- endmacro %} + +{% macro menu(size=16) -%} +{{ base('', size) }} +{%- endmacro %} + +{% macro user(size=16) -%} +{{ base('', size) }} +{%- endmacro %} + +{% macro log_out(size=16) -%} +{{ base('', size) }} +{%- endmacro %} + +{% macro sliders(size=16) -%} +{{ base('', size) }} +{%- endmacro %} + +{% macro tag(size=16) -%} +{{ base('', size) }} +{%- endmacro %} diff --git a/app/templates/base.html b/app/templates/base.html index 33aa95c..0abdd11 100644 --- a/app/templates/base.html +++ b/app/templates/base.html @@ -4,13 +4,34 @@ {% block title %}LinkVault{% endblock %} + @@ -156,5 +202,49 @@
© {{ app_author }} · Version {{ app_version }} · {{ app_host }}
+ + diff --git a/app/templates/index.html b/app/templates/index.html index 8a68662..33effd1 100644 --- a/app/templates/index.html +++ b/app/templates/index.html @@ -10,10 +10,32 @@ {{ icons.alert(size=14) }} KI aus {% endif %} - {{ user.email }} -
- -
+ + + +
+ + + + +