🎨 Thèmes MyHome
Le thème définit l'apparence générale du projet.
Il influence :
- le fond ;
- les couleurs ;
- les cards ;
- les widgets ;
- les menus ;
- les effets visuels ;
- l'ambiance globale.
🎭 Thèmes détectés dans le zip actuel
| ID | Nom | Description | Sombre | Cards de thème |
|---|---|---|---|---|
| dark_navy | Dark Navy | Thème sombre flat navy, style Homepage — sans glassmorphism, coins nets | Oui | default, light, temperature, opening, energy, menu |
| dark_neon | Dark Neon | Thème sombre glassmorphism avec accent cyan | Oui | default, light, temperature, opening, energy, menu |
| dark_tech | Dark Tech | Dashboard domotique sombre style DSFR Tech — accent violet, font Rajdhani, scanlines | Oui | default, light, temperature, opening, energy, menu |
| electric | Electric | Thème sombre flat avec accent bleu électrique | Oui | default, light, temperature, opening, energy, menu |
| glass_night | Glass Night | Thème glassmorphism nuit profonde avec accent cyan | Oui | default, light, temperature, opening, energy, menu |
| light_glass | Light Glass | Thème clair glassmorphism style Material | Non | default, light, temperature, opening, energy, menu |
| modern_soft | Modern Soft | Thème clair et épuré | Oui | |
| warm_amber | Warm Amber | Thème sombre organique, tons chauds ambrés, glassmorphism léger | Oui | default, light, temperature, opening, energy, menu |
🎯 Rôle du thème
Un thème MyHome sert à unifier l'interface.
Lorsqu'un thème est appliqué :
- les widgets héritent des variables visuelles ;
- les cards utilisent les couleurs cohérentes ;
- le menu reprend l'accent du thème ;
- les fonds et bordures gardent une cohérence globale.
🖼️ Fond du thème ou image personnalisée
Dans le projet, le fond peut être :
| Mode | Usage |
|---|---|
| Fond du thème | Recommandé pour garder une cohérence automatique |
| Image / URL | Utile pour une interface plus personnalisée |
🎨 Accent couleur
Le menu peut suivre le thème ou utiliser un accent personnalisé.
Accents proposés dans l'interface :
| Couleur | Exemple |
|---|---|
| Cyan | #62d5ff |
| Jaune | #ffd166 |
| Vert | #55efc4 |
| Orange | #ff9f43 |
| Violet | #a29bfe |
| Rose | #fd79a8 |
| Rouge | #ff6b6b |
⚙️ Édition avancée des variables
L'onglet Thème permet de charger, modifier puis appliquer des variables CSS du thème actif.
Actions disponibles :
| Action | Rôle |
|---|---|
| Charger les valeurs | Lire les valeurs du thème actif |
| Appliquer au fichier CSS | Sauvegarder les modifications dans le fichier CSS |
| Réinitialiser | Revenir aux valeurs précédentes |
attention
Cette partie modifie l'apparence du thème. À utiliser après avoir validé le rendu général du projet.
📷 Capture à ajouter
Image commentée à préparer : montrer le sélecteur de thème, le mode fond et un aperçu du rendu.