• feat(ui): theme system — amber/slate/rose, profile picker, full token migration
    Some checks failed
    CI / Backend (pull_request) Successful in 44s
    CI / UI (pull_request) Successful in 25s
    CI / UI (push) Successful in 27s
    Release / Test backend (push) Successful in 42s
    CI / Backend (push) Successful in 44s
    Release / Check ui (push) Successful in 24s
    Release / Docker / caddy (push) Failing after 1m4s
    Release / Docker / backend (push) Failing after 44s
    Release / Docker / ui (push) Failing after 29s
    Release / Docker / runner (push) Failing after 54s
    Release / Gitea Release (push) Has been skipped

    kamil released this 2026-03-28 23:57:16 +05:00

    • Add CSS custom property token system in app.css (@theme + [data-theme] overrides)
    • Three themes: amber (default), slate (indigo/dark), rose (dark pink)
    • Flash prevention via inline <script> in svelte:head sets data-theme before paint
    • Theme context (setContext/getContext) in +layout.svelte for live preview
    • Theme persisted via PocketBase user_settings (PBUserSettings.theme field)
    • /api/settings GET/PUT updated to handle theme field alongside existing settings
    • Profile page: new Appearance section with 3 colour-swatch theme picker
    • Full token migration across all 36 route/component files:
      zinc/amber hardcoded Tailwind classes → CSS var utilities (bg-(--color-surface), etc.)
    • UI primitives (Badge, Button, Card, Dialog, Separator, Textarea) migrated
    • accent-amber-400 replaced with inline style accent-color: var(--color-brand)
    Downloads