mirror of
https://github.com/Memo-2023/mana-monorepo.git
synced 2026-05-16 07:39:39 +02:00
53b3746b98
Complete rename across the entire monorepo pre-launch: - Module, routes, API, i18n, standalone landing app directories - All code identifiers, display names, logo component - German user-facing label: "Essen" (English brand stays "Food") - Dexie table nutriFavorites -> foodFavorites - Infra configs (docker-compose, cloudflared, nginx, wrangler) Zero residue of nutriphi remains. No data migration needed (pre-launch). Follow-up: run pnpm install, update Cloudflare DNS (food.mana.how), rename Cloudflare Pages project. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
51 lines
1.9 KiB
Markdown
51 lines
1.9 KiB
Markdown
# Frontend Consistency Improvements
|
|
|
|
Tracked improvements for UI/styling consistency across the Mana unified app.
|
|
|
|
## 1. Standardize ListView Styling Approach
|
|
|
|
**Status:** Open
|
|
**Priority:** Low (no functional impact, maintenance concern)
|
|
**Effort:** Medium (13 modules to migrate)
|
|
|
|
### Problem
|
|
|
|
Module ListViews use two different styling approaches:
|
|
|
|
- **Scoped CSS + `hsl(var(--color-*))` theme tokens** — 27 modules (65%)
|
|
- todo, notes, drink, contacts, journal, dreams, habits, firsts, calendar, chat, places, inventory, finance, news, body, calc, events, photos, automations, cycles, uload, picture, recipes
|
|
- **Tailwind utility classes** — 13 modules (35%)
|
|
- food, plants, moodlit, cards, presi, storage, skilltree, context, guides, memoro, who, music, playground, citycorners, questions, times
|
|
|
|
### Why it matters
|
|
|
|
- Tailwind modules sometimes hardcode colors (`bg-white/5`, `text-white/80`) instead of using theme tokens, breaking theme consistency.
|
|
- `transition-all` in Tailwind classes can cause rendering bugs with CSS custom properties (recipe module had invisible text until hover — fixed by switching to specific transition properties).
|
|
- Mixed approaches make it harder to audit theme compliance and onboard new contributors.
|
|
|
|
### Recommendation
|
|
|
|
Migrate the 13 Tailwind-based ListViews to scoped CSS with `hsl(var(--color-*))` tokens, matching the majority pattern. Key rules:
|
|
|
|
1. Use `hsl(var(--color-foreground))`, `hsl(var(--color-muted))`, etc. — not hardcoded colors.
|
|
2. Use specific `transition: transform 0.15s, box-shadow 0.15s` — never `transition-all` (causes CSS variable animation bugs).
|
|
3. Keep scoped `<style>` blocks — no Tailwind utility classes in ListView templates.
|
|
|
|
### Modules to migrate
|
|
|
|
- [ ] food
|
|
- [ ] plants
|
|
- [ ] moodlit
|
|
- [ ] cards
|
|
- [ ] presi
|
|
- [ ] storage
|
|
- [ ] skilltree
|
|
- [ ] context
|
|
- [ ] guides
|
|
- [ ] memoro
|
|
- [ ] who
|
|
- [ ] music
|
|
- [ ] playground
|
|
- [ ] citycorners
|
|
- [ ] questions
|
|
- [ ] times
|