Sistema de Temes Millorat

Aquest 茅s el nou sistema de temes que permet combinar brands (Fluight, Iberia) amb modes (clar, fosc) mantenint total compatibilitat amb el sistema actual.

Selectors de Temes

Selector Original (Compatibilitat)

Selector original amb els 3 temes: Clar, Fosc, Iberia + Iberia Fosc

Selector Millorat - Mode Simple

Mode simple amb els mateixos temes per貌 millor organitzaci贸

Selector Millorat - Mode Avan莽at

Mode avan莽at que permet triar brand i mode per separat

Selector Millorat - Adaptatiu

L'usuari pot triar entre mode simple i avan莽at

Informaci贸 del Tema Actual

Tema actiu: light
Nom del tema: light
Color primari: #969332
Fons primari: #FFFFFF
Text primari: #0F172A
// 脷s del nou sistema:
import { createTheme, brands, modes } from '../utils/theme';

// Crear qualsevol combinaci贸
const iberiaLight = createTheme('iberia', 'light');
const iberiaDark = createTheme('iberia', 'dark');
const fluightDark = createTheme('fluight', 'dark');

// O usar els predefinits
import { fluightLight, iberiaLight, iberiaDark } from '../utils/theme';

Components de Prova

Aquests components mostren com s'adapten autom脿ticament al tema actual

Targeta d'Exemple

Aquesta targeta utilitza les variables de tema autom脿ticament:

  • Fons: var(--theme-color-background-tertiary)
  • Borde: var(--theme-color-border-secondary)
  • Text: var(--theme-color-text-primary)

Colors Disponibles

El sistema suporta:

  • Brands: fluight, iberia
  • Modes: light, dark
  • Total combinacions: 4

Proves R脿pides

Prova els diferents temes disponibles: