refactor(dev): dogfood framework CSS in theme adapter panel

Replace all inline styles in theme-adapter.js with framework classes.
The panel now uses its own tokens (var(--bg-1), var(--fg-0), etc.) so
it visually adapts when you change theme colors — true dogfooding.

New framework components added to fill gaps:
- popover.css — fixed-position floating panel (.popover, .popover-br)
- chip.css + chip.cljc — selectable preset buttons (.chip, .chip-active)
- swatch.css — color preview strips (.swatch-row, .swatch)
- button.css — icon-only buttons (.btn-icon, .btn-icon-round)
- card.css — sectioned card variant (.card-flush, .card-section)
- utilities.css — text/flex helpers (.text-xs, .font-semibold, .flex-1, etc.)

Theme adapter JS shrunk from 340 to 250 lines by removing the 60-line
inline style object and applyStyle() helper.
This commit is contained in:
Florian Schroedl
2026-03-11 16:53:08 +01:00
parent 59d46700bc
commit 9f3ebe453f
10 changed files with 300 additions and 186 deletions

2
bb.edn
View File

@@ -38,6 +38,7 @@
[ui.form-test]
[ui.icon-test]
[ui.sidebar-test]
[ui.chip-test]
[ui.theme-test])
:task (let [{:keys [fail error]} (t/run-tests
'ui.button-test
@@ -57,6 +58,7 @@
'ui.form-test
'ui.icon-test
'ui.sidebar-test
'ui.chip-test
'ui.theme-test)]
(when (pos? (+ fail error))
(System/exit 1)))}