Add UI themes (Dark, Light, Midnight, Sunset)

Four preset color themes, switchable from Profile settings with instant
preview and server-side persistence (User.theme, applied via a data-theme
attribute the CSS custom-property overrides in themes.css key off). Dark
stays the existing DarkSingularity palette and default. Light is a genuine
new light-mode design; Midnight is a higher-contrast OLED-friendly dark
variant; Sunset swaps in a warm amber/coral accent family.

Custom theme building (pick-your-own-colors) is out of scope for this
pass -- presets only.

Also: fixed the PATCH /api/auth/me handler to only apply fields actually
present in the request body. It previously always overwrote display_name
unconditionally, which happened to be harmless when it was the only
field on ProfileUpdate but would have silently cleared it on any
theme-only update. And switched two hardcoded hex colors
(.btn-primary:hover, .role-badge-admin) to token-derived color-mix()
values so they adapt across themes instead of staying fixed to the
original cyan/violet palette.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
2026-08-15 22:02:38 -06:00
co-authored by Claude Sonnet 5
parent d7e777cbd8
commit afdd573182
14 changed files with 316 additions and 6 deletions
+1
View File
@@ -18,6 +18,7 @@ class User(Base):
is_site_admin: Mapped[bool] = mapped_column(Boolean, default=False, nullable=False)
is_active: Mapped[bool] = mapped_column(Boolean, default=True, nullable=False)
display_name: Mapped[str | None] = mapped_column(String(50))
theme: Mapped[str | None] = mapped_column(String(20))
avatar_filename: Mapped[str | None] = mapped_column(String(64))
avatar_content_type: Mapped[str | None] = mapped_column(String(50))
created_at: Mapped[datetime] = mapped_column(
+9 -2
View File
@@ -74,8 +74,15 @@ async def update_profile(
current_user: User = Depends(get_current_user),
db: AsyncSession = Depends(get_db),
) -> User:
display_name = data.display_name.strip() if data.display_name else None
current_user.display_name = display_name or None
# Only apply fields actually present in the request body -- a call that
# only wants to change the theme must not clobber display_name back to
# None, and vice versa.
updates = data.model_dump(exclude_unset=True)
if "display_name" in updates:
display_name = updates["display_name"].strip() if updates["display_name"] else None
current_user.display_name = display_name or None
if "theme" in updates:
current_user.theme = updates["theme"]
await db.commit()
await db.refresh(current_user)
return current_user
+8
View File
@@ -1,5 +1,6 @@
import uuid
from datetime import datetime
from typing import Literal
from pydantic import BaseModel, ConfigDict, EmailStr, Field
@@ -19,12 +20,19 @@ class UserRead(BaseModel):
is_bot: bool
is_site_admin: bool
display_name: str | None
theme: str | None
avatar_filename: str | None
created_at: datetime
class ProfileUpdate(BaseModel):
# Both fields are independently optional-and-settable -- the router
# only applies keys actually present in the request body
# (model_dump(exclude_unset=True)), so a call that only wants to change
# the theme doesn't clobber display_name back to None, and vice versa.
display_name: str | None = Field(default=None, max_length=50)
# Kept in sync with frontend/src/styles/themes.css's theme blocks.
theme: Literal["dark", "light", "midnight", "sunset"] | None = Field(default=None)
class UserDirectoryRead(BaseModel):