Thème

Vos pages ressemblent à votre site web. Le CSS est ajouté par <FloconPage />. Rien à importer.

Rendu par défaut

  • Votre site web utilise shadcn ? La page reprend vos couleurs, votre rayon, votre police et votre mode sombre. Rien à faire.
  • Pas de shadcn ? La page utilise les couleurs Flocon. Elle devient sombre seulement si votre site web a un mode sombre : color-scheme: dark (ou light dark avec un navigateur sombre) sur votre page, ou une classe .dark (Tailwind).

Les variables

Surchargez-les sur .flocon-page :

  • --flocon-primary
  • --flocon-background
  • --flocon-foreground
  • --flocon-card
  • --flocon-muted
  • --flocon-muted-foreground
  • --flocon-border
  • --flocon-radius
  • --flocon-font
.flocon-page {
--flocon-primary: #e11d48;
--flocon-radius: 4px;
}

Surcharger le CSS

Tout le CSS par défaut est dans @layer flocon. Votre CSS qui n'est dans aucune couche gagne. Vous pouvez donc restyler un élément avec son nom de classe :

.flocon-page h1 {
font-size: 3rem;
}

L'ancien shadcn (Tailwind v3) n'est pas encore supporté. Ses couleurs sont des nombres HSL comme 222 47% 11%. Définissez vous-même les variables --flocon-*.

Mis à jour