add CSS migration plan (Tailwind + DaisyUI to modern CSS)

9-phase plan to replace Tailwind v4 and DaisyUI with hand-written
CSS using @layer, native nesting, container queries, oklch, and
@property. Visual regression testing at each phase. ~22h across
14 sessions.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
jamey
2026-02-16 22:15:10 +00:00
parent 504c895157
commit 1a61f4bb62
2 changed files with 417 additions and 8 deletions

View File

@@ -27,7 +27,7 @@
Ordered by dependency level — admin shell chain first (unblocks most downstream work).
Plans: [admin-redesign.md](docs/plans/admin-redesign.md) | [setup-wizard.md](docs/plans/setup-wizard.md) | [search.md](docs/plans/search.md) | [products-refactor.md](/home/jamey/.claude/plans/snug-roaming-zebra.md) | [shipping-sync.md](docs/plans/shipping-sync.md) | [printful-integration.md](docs/plans/printful-integration.md) | [provider-strategy.md](docs/plans/provider-strategy.md)
Plans: [admin-redesign.md](docs/plans/admin-redesign.md) | [setup-wizard.md](docs/plans/setup-wizard.md) | [search.md](docs/plans/search.md) | [products-refactor.md](/home/jamey/.claude/plans/snug-roaming-zebra.md) | [shipping-sync.md](docs/plans/shipping-sync.md) | [printful-integration.md](docs/plans/printful-integration.md) | [provider-strategy.md](docs/plans/provider-strategy.md) | [css-migration.md](docs/plans/css-migration.md)
| # | Task | Depends on | Est | Status |
|---|------|------------|-----|--------|
@@ -60,14 +60,20 @@ Plans: [admin-redesign.md](docs/plans/admin-redesign.md) | [setup-wizard.md](doc
| | **Next up** | | | |
| 30 | Admin UI tweaks for Printful | 25 | 1h | |
| 31 | Printful tests + integration testing | 24-30 | 4.5h | |
| | **CSS migration (after admin stable)** | | | |
| 19 | Admin design tokens (`admin-tokens.css`) | 12 | 30m | |
| 20 | Admin component styles (`app-admin.css`) | 19 | 3-4h | |
| 21 | Migrate core_components.ex off DaisyUI | 20 | 2h | |
| 22 | Remove DaisyUI | 21 | 1h | |
| 23 | CSS migration tests + visual QA | 22 | 1h | |
| | **CSS migration — Tailwind + DaisyUI to modern CSS** | | | |
| 32 | Phase 0: Foundation + screenshot tooling | 30-31 | 1.5h | |
| 33 | Phase 1: Layout primitives + reset | 32 | 1.5h | |
| 34 | Phase 2: Extract product inline styles | 33 | 3h | |
| 35 | Phase 3: Extract layout + cart inline styles | 33 | 3h | |
| 36 | Phase 4: Extract content + template inline styles | 33 | 2.5h | |
| 37 | Phase 5: Remove Tailwind from shop | 34-36 | 3h | |
| 38 | Phase 6: Replace DaisyUI (admin) | 37 | 3h | |
| 39 | Phase 7: Remove Tailwind entirely | 38 | 1.5h | |
| 40 | Phase 8: Optimisation + modern enhancements | 39 | 2.5h | |
**Total remaining: ~13-15 hours across ~7-8 sessions** (admin Printful tweaks, Printful tests, CSS migration)
**Total remaining: ~27-28 hours across ~16 sessions** (admin Printful tweaks, Printful tests, CSS migration)
See [css-migration.md](docs/plans/css-migration.md) for full plan with architecture, visual regression testing strategy, and acceptance criteria per phase.
## Usability fixes (16/18 done)