Site vitrine pour le restaurant et bar à vin BARBARES. Design "Punk" : Brut, contrasté, bruyant et vivant.

• Framework : Astro 5
• Styling : Tailwind CSS v4
• CMS : Decap CMS (anciennement Netlify CMS)
• Content : Markdown (Content Collections)

npm run dev

Le site sera accessible sur http://localhost:4321.

• Node.js : Version 18 ou supérieure.
• NPM : Inclus avec Node.js.

/ ├── public/ │ ├── admin/ # Configuration Decap CMS │ └── images/ # Assets statiques (uploads CMS) ├── src/ │ ├── content/ # Collections de contenu (Markdown) │ │ ├── menu/ # Items du menu │ │ └── vins/ # Carte des vins │ ├── layouts/ # Layouts globaux (Layout.astro) │ ├── pages/ # Pages du site (index.astro) │ └── styles/ # CSS Global & Tailwind Config └── astro.config.mjs # Configuration Astro 

Ce projet utilise Tailwind CSS v4. Contrairement à la v3, la configuration se fait principalement en CSS pur dans src/styles/global.css via la directive @theme. Il n'y a pas de fichier tailwind.config.js classique.

Exemple de modification de thème :

/* src/styles/global.css */ @theme { --color-neon-red: #FF0D0A; /* Modifier ici */ /* ... */ }

Le contenu est géré via des fichiers Markdown dans src/content/. Vous pouvez éditer ces fichiers manuellement ou utiliser l'interface d'administration Decap CMS.

Pour accéder au CMS en local ou en production : http://votre-site.com/admin

Note : En local, Decap CMS peut nécessiter un proxy backend si vous n'utilisez pas Netlify Identity. Pour le développement simple, l'édition directe des fichiers .md est recommandée.

• Menu (src/content/menu/) : Plats et entrées.
  • Champs : Titre, Prix, Description, Catégorie, Ordre.
• Vins (src/content/vins/) : Carte des vins.
  • Champs : Nom, Domaine, Région, Type (Rouge, Blanc, etc.), Prix (Verre/Bouteille), Nature (Oui/Non).

Le design est contrôlé via Tailwind CSS v4 et des variables CSS globales.

• neon-red (#FF0D0A) : Actions, accents, énergie.
• blood-red (#660000) : Fonds, profondeur.
• deep-black (#000000) : Structure, texte principal.
• paper (#F5F5F0) : Contenu textuel, contraste.

• Titres : Anton (Uppercase, Impact).
• Texte : Inter (Lisibilité).
• Technique : Courier Prime (Détails, Prix, Vibe "Machine à écrire").

• Grain : Overlay de bruit SVG fixe (.grain dans Layout.astro).
• Glitch : Animation CSS sur les boutons au survol (.btn-punk).
• Target : Élément graphique rotatif en fond (.target-bg).
• Marquee : Bandeau défilant infini.

Pour générer la version de production :

npm run build

Le dossier dist/ contiendra les fichiers statiques prêts à être déployés.

Hébergement recommandé : Netlify (pour l'intégration native avec Decap CMS Identity).