3.2-A: CSS Custom Properties + tailwind.config bovites #247

New Issue

kincses · 2026-06-08T20:04:56+02:00

kincses commented

2026-06-08 20:04:56 +02:00

Merfoldko: Frontend Architektura 2.0 & Dinamikus Megjelenitesi Rendszer
Cel: CSS Custom Properties bevezetese a tailwind.config.js-be es a main.css-be a dinamikus temavaltas tamogatasahoz.

Fuggosegek (Dependencies)

Bemenet: #228 (JSONB visual_settings), #229 (RBAC feature flag-ek)
Kimenet: #234-B (AppThemeStore)

Implementacios Reszletek

tailwind.config.js bovites CSS variable referenciakkal:
colors.theme-bg: var(--theme-bg, #ffffff)
colors.theme-primary: var(--theme-primary, #004B63)
colors.theme-text: var(--theme-text, #1a1a1a)
colors.theme-accent: var(--theme-accent, #008CA4)
colors.theme-glass: var(--theme-glass, rgba(255,255,255,0.8))
colors.theme-card: var(--theme-card, #f8fafc)
colors.theme-border: var(--theme-border, #e2e8f0)
Meglevo sf-* szinek megtartasa
main.css bovites :root valtozokkal:
:root { --theme-bg, --theme-primary, --theme-text, --theme-accent, --theme-glass, --theme-card, --theme-border }
.dark { sotet mod valtozok }
Transition hozzaadasa: *, *::before, *::after { transition: background-color 0.3s, color 0.3s, border-color 0.3s }

Erintett fajlok

frontend/tailwind.config.js
frontend/src/assets/main.css

**Merfoldko:** Frontend Architektura 2.0 & Dinamikus Megjelenitesi Rendszer **Cel:** CSS Custom Properties bevezetese a tailwind.config.js-be es a main.css-be a dinamikus temavaltas tamogatasahoz. ### Fuggosegek (Dependencies) - **Bemenet:** #228 (JSONB visual_settings), #229 (RBAC feature flag-ek) - **Kimenet:** #234-B (AppThemeStore) ### Implementacios Reszletek 1. **tailwind.config.js bovites CSS variable referenciakkal:** colors.theme-bg: var(--theme-bg, #ffffff) colors.theme-primary: var(--theme-primary, #004B63) colors.theme-text: var(--theme-text, #1a1a1a) colors.theme-accent: var(--theme-accent, #008CA4) colors.theme-glass: var(--theme-glass, rgba(255,255,255,0.8)) colors.theme-card: var(--theme-card, #f8fafc) colors.theme-border: var(--theme-border, #e2e8f0) Meglevo sf-* szinek megtartasa 2. **main.css bovites :root valtozokkal:** :root { --theme-bg, --theme-primary, --theme-text, --theme-accent, --theme-glass, --theme-card, --theme-border } .dark { sotet mod valtozok } Transition hozzaadasa: *, *::before, *::after { transition: background-color 0.3s, color 0.3s, border-color 0.3s } ### Erintett fajlok - frontend/tailwind.config.js - frontend/src/assets/main.css

kincses added the Status: To Do Scope: Frontend Type: Feature labels 2026-06-08 20:04:56 +02:00

kincses referenced this issue

2026-06-08 20:05:15 +02:00

3.2-B: AppThemeStore letrehozasa + applyTheme() fuggveny #248

kincses added this to the Frontend Architektúra 2.0 & Dinamikus Megjelenítési Rendszer milestone 2026-06-08 20:07:43 +02:00

Sign in to join this conversation.

1 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: kincses/service-finder#247