# 📁 Logos Directory

Ce dossier contient les fichiers de logo pour l'application Thé Tip Top.

## 📝 Instructions pour ajouter votre logo

### Étape 1 : Préparer votre logo

Placez vos fichiers de logo dans ce dossier. Formats recommandés :

1. **logo.svg** - Format vectoriel (recommandé)
   - Taille : Scalable
   - Avantages : Qualité parfaite à toutes les tailles, fichier léger

2. **logo.png** - Format PNG avec fond transparent
   - Taille recommandée : 500x500px minimum
   - Avantages : Compatible partout, fond transparent

3. **logo-white.svg** ou **logo-white.png** - Version blanche pour le footer
   - Pour affichage sur fond sombre

### Étape 2 : Nommer vos fichiers

```
public/logos/
├── logo.svg          # Logo principal (couleur)
├── logo.png          # Alternative PNG
├── logo-white.svg    # Logo blanc pour footer
├── logo-icon.svg     # Icône seule (favicon)
└── README.md         # Ce fichier
```

### Étape 3 : Le code est déjà configuré !

Les fichiers Header.tsx et Footer.tsx sont déjà configurés pour utiliser automatiquement votre logo.

Le système utilise :
- `logo.svg` si disponible (priorité)
- `logo.png` en alternative
- 🍵 Emoji par défaut si aucun logo

### Formats de fichier acceptés

- ✅ SVG (recommandé) - Scalable, léger
- ✅ PNG - Avec transparence
- ✅ WEBP - Format moderne
- ⚠️ JPG - Moins recommandé (pas de transparence)

### Dimensions recommandées

**Logo principal (Header):**
- Largeur : 150-200px
- Hauteur : 40-60px
- Format : Horizontal ou carré

**Logo footer:**
- Largeur : 120-150px
- Hauteur : 40-50px

**Favicon/Icon:**
- 512x512px (carré)
- Format : SVG ou PNG

## 🎨 Exemple de création rapide

Si vous n'avez pas encore de logo, vous pouvez :

1. **Créer un SVG simple** avec un éditeur comme :
   - Figma (gratuit)
   - Canva (gratuit)
   - Inkscape (gratuit, open-source)

2. **Utiliser un générateur** en ligne :
   - Canva Logo Maker
   - Looka
   - Hatchful by Shopify

3. **Commander un logo** sur :
   - Fiverr
   - 99designs
   - Upwork

## 🔧 Comment vérifier si ça fonctionne

1. Placez votre logo dans ce dossier
2. Rafraîchissez la page (F5)
3. Le logo devrait apparaître dans le Header et Footer

Si vous voyez toujours 🍵, vérifiez :
- Le nom du fichier (logo.svg ou logo.png)
- Le chemin (/public/logos/logo.svg)
- La console du navigateur pour les erreurs

## 💡 Astuce

Pour un meilleur rendu, utilisez un logo SVG optimisé :
```bash
# Installer SVGO pour optimiser votre SVG
npm install -g svgo

# Optimiser votre logo
svgo logo.svg -o logo-optimized.svg
```