# 🌓 Thème Mix Monokai-Gruvbox

## Vue d'ensemble

Le thème **Mix Monokai-Gruvbox** est un thème hybride qui combine le meilleur des deux palettes populaires :
- **Arrière-plans** : Monokai (noir profond et contraste élevé)
- **Couleurs d'accent** : Gruvbox (palette chaleureuse et rétro)
- **Texte** : Gruvbox (beige/crème pour une meilleure lisibilité)

## Philosophie du thème

Ce thème a été créé pour les utilisateurs qui :
- Aiment le **contraste élevé** des fonds sombres Monokai
- Préfèrent les **couleurs chaleureuses** de Gruvbox aux couleurs néon de Monokai
- Veulent une **expérience visuelle unique** qui se démarque

## Palette de couleurs

### Arrière-plans (Monokai)
```css
--bg-primary: #1e1e1e     /* Noir profond */
--bg-secondary: #2d2d2d   /* Gris très foncé */
--bg-tertiary: #3e3e3e    /* Gris foncé */
--bg-hover: #4e4e4e       /* Gris moyen pour survol */
```

### Texte (Gruvbox)
```css
--text-primary: #ebdbb2   /* Beige clair */
--text-secondary: #d5c4a1 /* Beige moyen */
--text-muted: #a89984     /* Beige foncé */
```

### Couleurs d'accent (Gruvbox)
```css
--color-red: #fb4934      /* Rouge vif */
--color-orange: #fe8019   /* Orange chaud */
--color-yellow: #fabd2f   /* Jaune doré */
--color-green: #b8bb26    /* Vert lime */
--color-cyan: #8ec07c     /* Cyan/aqua */
--color-blue: #83a598     /* Bleu grisé */
--color-purple: #d3869b   /* Violet/rose */
```

### Couleurs sémantiques
```css
--color-success: #b8bb26  /* Vert Gruvbox */
--color-warning: #fabd2f  /* Jaune Gruvbox */
--color-danger: #fb4934   /* Rouge Gruvbox */
--color-info: #83a598     /* Bleu Gruvbox */
--color-primary: #b8bb26  /* Vert (couleur principale de l'app) */
```

## Comparaison avec les autres thèmes

| Caractéristique | Monokai Dark | Gruvbox Dark | Mix Monokai-Gruvbox |
|----------------|--------------|--------------|---------------------|
| Fond principal | `#1e1e1e` | `#282828` | `#1e1e1e` (Monokai) |
| Texte principal | `#f8f8f2` | `#ebdbb2` | `#ebdbb2` (Gruvbox) |
| Couleur primaire | `#a6e22e` | `#b8bb26` | `#b8bb26` (Gruvbox) |
| Température | Froide | Chaude | Chaude |
| Contraste | Très élevé | Élevé | Très élevé |

## Cas d'usage

### ✅ Idéal pour :
- Sessions de travail prolongées (fond noir profond = moins de fatigue oculaire)
- Environnements très faiblement éclairés
- Utilisateurs qui trouvent Monokai trop "néon"
- Utilisateurs qui trouvent Gruvbox Dark pas assez contrasté
- Ceux qui veulent une ambiance chaleureuse sans sacrifier le contraste

### ❌ Moins adapté pour :
- Environnements lumineux (préférer un thème Light)
- Utilisateurs préférant une palette cohérente d'un seul thème
- Ceux qui n'aiment pas mélanger les styles

## Exemples visuels

### Boutons
- **Primary** : Fond vert `#b8bb26` (Gruvbox) sur fond noir `#1e1e1e` (Monokai)
- **Danger** : Fond rouge `#fb4934` (Gruvbox) sur fond noir
- **Info** : Fond bleu `#83a598` (Gruvbox) sur fond noir

### Badges
- **Success** : Vert chaud Gruvbox au lieu du vert néon Monokai
- **Warning** : Jaune doré Gruvbox au lieu du jaune vif Monokai
- **Danger** : Rouge vif Gruvbox

### Cartes et sections
- Arrière-plan des cartes : `#2d2d2d` (gris très foncé Monokai)
- Titres et headers : Couleurs Gruvbox (bleu `#83a598`, vert `#b8bb26`)
- Bordures : Tons Gruvbox `#504945`

## Installation

Le thème est déjà intégré dans l'application. Pour l'activer :

1. Ouvrez [Settings](http://localhost:8087/settings.html)
2. Dans la section "Thème d'interface", sélectionnez **"Mix Monokai-Gruvbox"**
3. Cliquez sur "Appliquer le thème"
4. La page se recharge automatiquement avec le nouveau thème

## Personnalisation

Pour créer votre propre variante de ce thème :

1. Copiez le fichier `frontend/css/themes/mix-monokai-gruvbox.css`
2. Modifiez les couleurs selon vos préférences
3. Déclarez le nouveau thème dans `theme-manager.js`
4. Ajoutez l'option dans `settings.html`

### Exemple de personnalisation

```css
/* Rendre le fond encore plus noir */
--bg-primary: #000000;

/* Utiliser le vert Monokai au lieu de Gruvbox */
--color-primary: #a6e22e;

/* Mixer texte Monokai et couleurs Gruvbox */
--text-primary: #f8f8f2;  /* Texte Monokai */
--color-success: #b8bb26; /* Vert Gruvbox */
```

## Feedback

Ce thème a été créé suite à une demande utilisateur. Si vous avez des suggestions d'amélioration ou d'autres idées de thèmes hybrides, n'hésitez pas à les partager !

**Autres combinaisons possibles** :
- Mix Gruvbox-Monokai (inverse : fonds Gruvbox + couleurs Monokai)
- Mix Monokai-Light-Gruvbox-Dark (fond clair + couleurs sombres)
- Thèmes avec d'autres palettes (Nord, Dracula, Solarized, etc.)

---

**Fichier** : `frontend/css/themes/mix-monokai-gruvbox.css`
**Déclaré dans** : `frontend/js/theme-manager.js`
**Créé le** : 2026-01-11