feat: add user theme preference

- Add theme field to User model (common)
- Create migration for theme field
- Add theme selection to Account Settings (html-router)
- Implement server-side theme rendering in base template
- Update JS for system/preference theme handling
- Remove header theme toggle for authenticated users
This commit is contained in:
Per Stark
2026-01-16 13:54:07 +01:00
parent 0df2b9810c
commit b25cfb4633
12 changed files with 282 additions and 42 deletions
@@ -55,6 +55,20 @@
</select>
{% endblock %}
</label>
<label class="w-full">
<div class="text-xs uppercase tracking-wide opacity-70 mb-1">Theme</div>
{% block theme_section %}
<select name="theme" class="nb-select w-full" hx-patch="/update-theme" hx-swap="outerHTML">
{% for option in theme_options %}
<option value="{{ option }}" {% if option==user.theme %}selected{% endif %}>{{ option }}</option>
{% endfor %}
</select>
<script>
document.documentElement.setAttribute('data-theme-preference', '{{ user.theme }}');
</script>
{% endblock %}
</label>
{% endblock %}
{% block settings_right_column %}
+1 -1
View File
@@ -1,5 +1,5 @@
<!DOCTYPE html>
<html lang="en" data-theme="light">
<html lang="en" data-theme="{{ initial_theme|default('light') }}" data-theme-preference="{{ user_theme|default('system') }}">
<head>
<meta charset="UTF-8">
@@ -8,5 +8,7 @@
<label for="my-drawer" aria-label="open sidebar" class="hover:cursor-pointer lg:hidden">
{% include "icons/hamburger_icon.html" %}
</label>
{% if not is_authenticated %}
{% include "theme_toggle.html" %}
{% endif %}
{% endblock %}