Hugging Face's logo

Spaces:
Nonoms9
/
nono
Running

App Files Community
Nonoms9 commited on
Commit
3b0390b
·
verified ·
1 Parent(s): 3039f4d

📄 PRD – Site web pour garage spécialisé en pompes à injection diesel 🧾 1. Contexte du projet Electrodiesel Baia est un garagiste indépendant spécialisé dans la réparation et la reprogrammation de pompes à injection diesel, souhaitant disposer d’un site web professionnel, simple, moderne et sécurisé. Objectif : présenter ses services, gagner en visibilité, et générer des demandes de contact/devis ou de rendez-vous. 🎯 2. Objectifs fonctionnels ✅ Objectifs principaux : • Présenter clairement l’activité (services + expertise spécifique) • Crédibiliser le garage (avis, photos, certifications…) • Faciliter la prise de contact et de rendez-vous • Permettre au client de demander un devis en ligne • Optimiser le site pour un bon référencement local SEO 🗂 3. Fonctionnalités attendues 🔹 Pages principales : 1. Accueil • Présentation rapide • Services en avant • Call-to-action "Demander un devis" / "Prendre RDV" 2. À propos • Parcours du garagiste • Expertise sur les pompes à injection • Certifications et marques couvertes 3. Services • Diagnostic électronique • Réparation pompe à injection • Reprogrammation / calibrage • Entretien général4. Avis clients (témoignages manuels ou Google intégrés) 5. Devis en ligne (formulaire interactif avec : • Type de véhicule • Symptômes rencontrés • Téléchargement de photos • Coordonnées du client) 6. Prendre RDV (intégration Google Agenda ou outil simple) 7. Contact • Adresse, téléphone, WhatsApp • Carte Google Maps intégrée • Horaires 8. Mentions légales & Politique RGPD 🔐 4. Contraintes techniques & sécurité • Site sécurisé en HTTPS • Protection anti-spam (Google reCAPTCHA v3) • Anti-injection (validation des formulaires côté serveur) • Données personnelles stockées localement ou envoyées par email sécurisé 🧱 5. Architecture technique Composant Techno possible (selon profil étudiant) Frontend HTML/CSS/JS + Bootstrap ou Tailwind Backend léger PHP simple (ou Flask/Node.js si niveau OK) CMS (facultatif) WordPress personnalisé Formulaire Envoi par email (PHPMailer, Formspree…) Base de données Pas nécessaire (optionnelle pour les devis) Hébergement Local (pour test) + version en ligne (GitHub Pages ou OVH/IONOS) 🎨 6. Charte graphique simplifiée • Couleurs : bleu foncé (propre, technique), gris métal, touches orange ou rouge • Typographie : sans-serif lisible • Icônes mécaniques / automobile• Photos haute qualité du garage et de pompes à injection 🔍 7. SEO & performance • Titres et balises optimisés • Vitesse de chargement soignée • Optimisation mobile (responsive à 100 %) • Sitemap.xml + robots.txt • Google My Business intégré 🧪 8. Tests & validation • Test affichage mobile • Test performance (Lighthouse) • Test sécurité basique • Validation formulaire (spam, injection) • Présentation au client final 🗃 9. Livrables attendus • Code source complet • Fiche utilisateur (mode d’emploi) • Vidéo de présentation du site • Journal des tests • Démo en ligneBonjour, Essaies de voir d'autres styles plus moderne et qui mettent en avant et en valeur les services (par exemple chaque service dans une section a part) et qui mettent en avant le partenariat avec la marque Bosch Le reste (a porpos de nous, témoignages, formauliares le smettres dans d'autres paeg séparées)voici 2 exemples de pages d'accueil a utiliser. tu peux commencer par developper la 01 en ajoutant un menu avec logo (le nom : ElectroDiesel Baia en bleu foncé) et un menu simple (accueil, nos services, nos clients, contact) - Follow Up Deployment

Browse files
Files changed (1) hide show
  1. index.html +341 -18
index.html CHANGED
@@ -1,20 +1,343 @@
1
  <!DOCTYPE html>
2
- <html>
3
- <head>
4
- <title>My app</title>
5
- <meta name="viewport" content="width=device-width, initial-scale=1.0" />
6
- <meta charset="utf-8">
7
  <script src="https://cdn.tailwindcss.com"></script>
8
- </head>
9
- <body class="flex justify-center items-center h-screen overflow-hidden bg-white font-sans text-center px-6">
10
- <div class="w-full">
11
- <span class="text-xs rounded-full mb-2 inline-block px-2 py-1 border border-amber-500/15 bg-amber-500/15 text-amber-500">🔥 New version dropped!</span>
12
- <h1 class="text-4xl lg:text-6xl font-bold font-sans">
13
- <span class="text-2xl lg:text-4xl text-gray-400 block font-medium">I'm ready to work,</span>
14
- Ask me anything.
15
- </h1>
16
- </div>
17
- <img src="https://enzostvs-deepsite.hf.space/arrow.svg" class="absolute bottom-8 left-0 w-[100px] transform rotate-[30deg]" />
18
- <script></script>
19
- <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=Nonoms9/nono" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
20
- </html>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
  <!DOCTYPE html>
2
+ <html lang="fr">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>ElectroDiesel Baia - Spécialiste pompes à injection diesel</title>
7
  <script src="https://cdn.tailwindcss.com"></script>
8
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
9
+ <style>
10
+ .hero {
11
+ background-image: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url('https://images.unsplash.com/photo-1600861195091-690c92f1d2cc?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2070&q=80');
12
+ background-size: cover;
13
+ background-position: center;
14
+ }
15
+
16
+ .service-card:hover {
17
+ transform: translateY(-10px);
18
+ box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
19
+ }
20
+
21
+ .partner-logo {
22
+ filter: grayscale(100%);
23
+ opacity: 0.6;
24
+ transition: all 0.3s ease;
25
+ }
26
+
27
+ .partner-logo:hover {
28
+ filter: grayscale(0);
29
+ opacity: 1;
30
+ }
31
+ </style>
32
+ </head>
33
+ <body class="font-sans bg-gray-50">
34
+ <!-- Header -->
35
+ <header class="bg-white shadow-md sticky top-0 z-50">
36
+ <div class="container mx-auto px-4 py-3 flex justify-between items-center">
37
+ <div class="flex items-center">
38
+ <div class="w-12 h-12 bg-blue-800 rounded-full flex items-center justify-center mr-3">
39
+ <i class="fas fa-car text-white text-xl"></i>
40
+ </div>
41
+ <a href="#" class="text-2xl font-bold text-blue-800">ElectroDiesel Baia</a>
42
+ </div>
43
+
44
+ <nav class="hidden md:flex space-x-8">
45
+ <a href="#" class="text-blue-800 font-medium hover:text-orange-500 transition">Accueil</a>
46
+ <a href="#" class="text-gray-600 font-medium hover:text-orange-500 transition">Nos services</a>
47
+ <a href="#" class="text-gray-600 font-medium hover:text-orange-500 transition">Nos clients</a>
48
+ <a href="#" class="text-gray-600 font-medium hover:text-orange-500 transition">Contact</a>
49
+ </nav>
50
+
51
+ <button class="md:hidden text-gray-600" id="mobile-menu-button">
52
+ <i class="fas fa-bars text-2xl"></i>
53
+ </button>
54
+ </div>
55
+
56
+ <!-- Mobile menu -->
57
+ <div class="md:hidden hidden bg-white py-4 px-4 shadow-lg" id="mobile-menu">
58
+ <a href="#" class="block py-2 text-blue-800 font-medium">Accueil</a>
59
+ <a href="#" class="block py-2 text-gray-600 font-medium">Nos services</a>
60
+ <a href="#" class="block py-2 text-gray-600 font-medium">Nos clients</a>
61
+ <a href="#" class="block py-2 text-gray-600 font-medium">Contact</a>
62
+ </div>
63
+ </header>
64
+
65
+ <!-- Hero Section -->
66
+ <section class="hero text-white py-20 md:py-32">
67
+ <div class="container mx-auto px-4 text-center">
68
+ <h1 class="text-4xl md:text-5xl font-bold mb-6">Expert en pompes à injection diesel</h1>
69
+ <p class="text-xl md:text-2xl mb-8 max-w-3xl mx-auto">Réparation, diagnostic et reprogrammation par des spécialistes certifiés</p>
70
+ <div class="flex flex-col md:flex-row justify-center gap-4">
71
+ <a href="#" class="bg-orange-500 hover:bg-orange-600 text-white font-bold py-3 px-6 rounded-lg transition duration-300">Demander un devis</a>
72
+ <a href="#" class="bg-transparent hover:bg-white hover:text-blue-800 text-white font-bold py-3 px-6 border-2 border-white rounded-lg transition duration-300">Prendre rendez-vous</a>
73
+ </div>
74
+ </div>
75
+ </section>
76
+
77
+ <!-- Services Section -->
78
+ <section class="py-16 bg-white">
79
+ <div class="container mx-auto px-4">
80
+ <div class="text-center mb-16">
81
+ <h2 class="text-3xl md:text-4xl font-bold text-blue-800 mb-4">Nos services experts</h2>
82
+ <div class="w-20 h-1 bg-orange-500 mx-auto"></div>
83
+ </div>
84
+
85
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8">
86
+ <!-- Service 1 -->
87
+ <div class="service-card bg-gray-50 rounded-lg overflow-hidden shadow-md transition duration-300">
88
+ <div class="h-48 bg-gray-200 flex items-center justify-center">
89
+ <i class="fas fa-microchip text-6xl text-blue-800"></i>
90
+ </div>
91
+ <div class="p-6">
92
+ <h3 class="text-xl font-bold text-blue-800 mb-3">Diagnostic électronique</h3>
93
+ <p class="text-gray-600 mb-4">Analyse précise des défauts de votre système d'injection avec des outils professionnels.</p>
94
+ <a href="#" class="text-orange-500 font-medium hover:text-orange-600 flex items-center">
95
+ En savoir plus <i class="fas fa-arrow-right ml-2"></i>
96
+ </a>
97
+ </div>
98
+ </div>
99
+
100
+ <!-- Service 2 -->
101
+ <div class="service-card bg-gray-50 rounded-lg overflow-hidden shadow-md transition duration-300">
102
+ <div class="h-48 bg-gray-200 flex items-center justify-center">
103
+ <i class="fas fa-tools text-6xl text-blue-800"></i>
104
+ </div>
105
+ <div class="p-6">
106
+ <h3 class="text-xl font-bold text-blue-800 mb-3">Réparation pompe à injection</h3>
107
+ <p class="text-gray-600 mb-4">Réparation complète de votre pompe à injection par des techniciens qualifiés.</p>
108
+ <a href="#" class="text-orange-500 font-medium hover:text-orange-600 flex items-center">
109
+ En savoir plus <i class="fas fa-arrow-right ml-2"></i>
110
+ </a>
111
+ </div>
112
+ </div>
113
+
114
+ <!-- Service 3 -->
115
+ <div class="service-card bg-gray-50 rounded-lg overflow-hidden shadow-md transition duration-300">
116
+ <div class="h-48 bg-gray-200 flex items-center justify-center">
117
+ <i class="fas fa-laptop-code text-6xl text-blue-800"></i>
118
+ </div>
119
+ <div class="p-6">
120
+ <h3 class="text-xl font-bold text-blue-800 mb-3">Reprogrammation / calibrage</h3>
121
+ <p class="text-gray-600 mb-4">Optimisation des performances de votre moteur diesel grâce à notre expertise en reprogrammation.</p>
122
+ <a href="#" class="text-orange-500 font-medium hover:text-orange-600 flex items-center">
123
+ En savoir plus <i class="fas fa-arrow-right ml-2"></i>
124
+ </a>
125
+ </div>
126
+ </div>
127
+
128
+ <!-- Service 4 -->
129
+ <div class="service-card bg-gray-50 rounded-lg overflow-hidden shadow-md transition duration-300">
130
+ <div class="h-48 bg-gray-200 flex items-center justify-center">
131
+ <i class="fas fa-oil-can text-6xl text-blue-800"></i>
132
+ </div>
133
+ <div class="p-6">
134
+ <h3 class="text-xl font-bold text-blue-800 mb-3">Entretien général</h3>
135
+ <p class="text-gray-600 mb-4">Maintenance préventive pour prolonger la durée de vie de votre système d'injection.</p>
136
+ <a href="#" class="text-orange-500 font-medium hover:text-orange-600 flex items-center">
137
+ En savoir plus <i class="fas fa-arrow-right ml-2"></i>
138
+ </a>
139
+ </div>
140
+ </div>
141
+ </div>
142
+ </div>
143
+ </section>
144
+
145
+ <!-- Bosch Partnership Section -->
146
+ <section class="py-16 bg-blue-800 text-white">
147
+ <div class="container mx-auto px-4">
148
+ <div class="flex flex-col md:flex-row items-center">
149
+ <div class="md:w-1/2 mb-8 md:mb-0 md:pr-8">
150
+ <h2 class="text-3xl md:text-4xl font-bold mb-6">Partenariat officiel Bosch</h2>
151
+ <p class="text-lg mb-6">Nous sommes fiers d'être un centre agréé Bosch, garantissant l'utilisation de pièces d'origine et de procédures de réparation certifiées.</p>
152
+ <ul class="space-y-3 mb-8">
153
+ <li class="flex items-center">
154
+ <i class="fas fa-check-circle text-orange-500 mr-3"></i>
155
+ <span>Pièces d'origine garanties</span>
156
+ </li>
157
+ <li class="flex items-center">
158
+ <i class="fas fa-check-circle text-orange-500 mr-3"></i>
159
+ <span>Formation continue des techniciens</span>
160
+ </li>
161
+ <li class="flex items-center">
162
+ <i class="fas fa-check-circle text-orange-500 mr-3"></i>
163
+ <span>Outils de diagnostic spécifiques</span>
164
+ </li>
165
+ </ul>
166
+ <a href="#" class="inline-block bg-orange-500 hover:bg-orange-600 text-white font-bold py-3 px-6 rounded-lg transition duration-300">Découvrir nos certifications</a>
167
+ </div>
168
+ <div class="md:w-1/2 flex justify-center">
169
+ <img src="https://upload.wikimedia.org/wikipedia/commons/thumb/1/16/Bosch-logo.svg/1200px-Bosch-logo.svg.png" alt="Bosch Logo" class="w-64 h-auto">
170
+ </div>
171
+ </div>
172
+ </div>
173
+ </section>
174
+
175
+ <!-- Why Choose Us Section -->
176
+ <section class="py-16 bg-gray-50">
177
+ <div class="container mx-auto px-4">
178
+ <div class="text-center mb-16">
179
+ <h2 class="text-3xl md:text-4xl font-bold text-blue-800 mb-4">Pourquoi choisir ElectroDiesel Baia ?</h2>
180
+ <div class="w-20 h-1 bg-orange-500 mx-auto"></div>
181
+ </div>
182
+
183
+ <div class="grid grid-cols-1 md:grid-cols-3 gap-8">
184
+ <div class="text-center p-6">
185
+ <div class="w-20 h-20 bg-blue-100 rounded-full flex items-center justify-center mx-auto mb-6">
186
+ <i class="fas fa-medal text-3xl text-blue-800"></i>
187
+ </div>
188
+ <h3 class="text-xl font-bold text-blue-800 mb-3">Expertise certifiée</h3>
189
+ <p class="text-gray-600">Nos techniciens sont formés et certifiés par les plus grands équipementiers automobiles.</p>
190
+ </div>
191
+
192
+ <div class="text-center p-6">
193
+ <div class="w-20 h-20 bg-blue-100 rounded-full flex items-center justify-center mx-auto mb-6">
194
+ <i class="fas fa-clock text-3xl text-blue-800"></i>
195
+ </div>
196
+ <h3 class="text-xl font-bold text-blue-800 mb-3">Rapidité d'intervention</h3>
197
+ <p class="text-gray-600">Diagnostic rapide et réparations effectuées dans les meilleurs délais pour minimiser votre immobilisation.</p>
198
+ </div>
199
+
200
+ <div class="text-center p-6">
201
+ <div class="w-20 h-20 bg-blue-100 rounded-full flex items-center justify-center mx-auto mb-6">
202
+ <i class="fas fa-euro-sign text-3xl text-blue-800"></i>
203
+ </div>
204
+ <h3 class="text-xl font-bold text-blue-800 mb-3">Tarifs transparents</h3>
205
+ <p class="text-gray-600">Devis détaillé avant toute intervention, sans surprise. Prix compétitifs pour une qualité premium.</p>
206
+ </div>
207
+ </div>
208
+ </div>
209
+ </section>
210
+
211
+ <!-- Call to Action -->
212
+ <section class="py-16 bg-orange-500 text-white">
213
+ <div class="container mx-auto px-4 text-center">
214
+ <h2 class="text-3xl md:text-4xl font-bold mb-6">Prêt à redonner vie à votre moteur diesel ?</h2>
215
+ <p class="text-xl mb-8 max-w-2xl mx-auto">Contactez-nous dès aujourd'hui pour un diagnostic gratuit ou prenez rendez-vous en ligne.</p>
216
+ <div class="flex flex-col md:flex-row justify-center gap-4">
217
+ <a href="#" class="bg-white hover:bg-gray-100 text-orange-500 font-bold py-3 px-6 rounded-lg transition duration-300">
218
+ <i class="fas fa-phone-alt mr-2"></i> 04 12 34 56 78
219
+ </a>
220
+ <a href="#" class="bg-blue-800 hover:bg-blue-900 text-white font-bold py-3 px-6 rounded-lg transition duration-300">
221
+ <i class="fas fa-calendar-alt mr-2"></i> Prendre rendez-vous
222
+ </a>
223
+ </div>
224
+ </div>
225
+ </section>
226
+
227
+ <!-- Partners Section -->
228
+ <section class="py-16 bg-white">
229
+ <div class="container mx-auto px-4">
230
+ <div class="text-center mb-12">
231
+ <h3 class="text-xl text-gray-600">Ils nous font confiance</h3>
232
+ </div>
233
+
234
+ <div class="flex flex-wrap justify-center items-center gap-8 md:gap-16">
235
+ <img src="https://upload.wikimedia.org/wikipedia/commons/thumb/1/16/Bosch-logo.svg/1200px-Bosch-logo.svg.png" alt="Bosch" class="partner-logo h-12 md:h-16">
236
+ <img src="https://upload.wikimedia.org/wikipedia/commons/thumb/4/46/Denso_logo.svg/2560px-Denso_logo.svg.png" alt="Denso" class="partner-logo h-12 md:h-16">
237
+ <img src="https://upload.wikimedia.org/wikipedia/commons/thumb/7/7a/Delphi_Technologies_logo_2017.svg/1200px-Delphi_Technologies_logo_2017.svg.png" alt="Delphi" class="partner-logo h-12 md:h-16">
238
+ <img src="https://upload.wikimedia.org/wikipedia/commons/thumb/4/44/Siemens_logo.svg/1200px-Siemens_logo.svg.png" alt="Siemens" class="partner-logo h-12 md:h-16">
239
+ <img src="https://upload.wikimedia.org/wikipedia/commons/thumb/9/90/Valeo_Logo.svg/2560px-Valeo_Logo.svg.png" alt="Valeo" class="partner-logo h-12 md:h-16">
240
+ </div>
241
+ </div>
242
+ </section>
243
+
244
+ <!-- Footer -->
245
+ <footer class="bg-gray-900 text-white py-12">
246
+ <div class="container mx-auto px-4">
247
+ <div class="grid grid-cols-1 md:grid-cols-4 gap-8">
248
+ <div>
249
+ <h3 class="text-xl font-bold mb-4">ElectroDiesel Baia</h3>
250
+ <p class="mb-4">Spécialiste en réparation et reprogrammation de pompes à injection diesel.</p>
251
+ <div class="flex space-x-4">
252
+ <a href="#" class="text-gray-400 hover:text-white"><i class="fab fa-facebook-f"></i></a>
253
+ <a href="#" class="text-gray-400 hover:text-white"><i class="fab fa-instagram"></i></a>
254
+ <a href="#" class="text-gray-400 hover:text-white"><i class="fab fa-linkedin-in"></i></a>
255
+ </div>
256
+ </div>
257
+
258
+ <div>
259
+ <h3 class="text-lg font-bold mb-4">Nos services</h3>
260
+ <ul class="space-y-2">
261
+ <li><a href="#" class="text-gray-400 hover:text-white">Diagnostic électronique</a></li>
262
+ <li><a href="#" class="text-gray-400 hover:text-white">Réparation pompe à injection</a></li>
263
+ <li><a href="#" class="text-gray-400 hover:text-white">Reprogrammation / calibrage</a></li>
264
+ <li><a href="#" class="text-gray-400 hover:text-white">Entretien général</a></li>
265
+ </ul>
266
+ </div>
267
+
268
+ <div>
269
+ <h3 class="text-lg font-bold mb-4">Contact</h3>
270
+ <ul class="space-y-2">
271
+ <li class="flex items-start">
272
+ <i class="fas fa-map-marker-alt mt-1 mr-3 text-orange-500"></i>
273
+ <span class="text-gray-400">123 Rue du Garage, 75000 Paris</span>
274
+ </li>
275
+ <li class="flex items-center">
276
+ <i class="fas fa-phone-alt mr-3 text-orange-500"></i>
277
+ <span class="text-gray-400">04 12 34 56 78</span>
278
+ </li>
279
+ <li class="flex items-center">
280
+ <i class="fas fa-envelope mr-3 text-orange-500"></i>
281
+ <span class="text-gray-400">contact@electrodieselbaia.fr</span>
282
+ </li>
283
+ </ul>
284
+ </div>
285
+
286
+ <div>
287
+ <h3 class="text-lg font-bold mb-4">Horaires</h3>
288
+ <ul class="space-y-2 text-gray-400">
289
+ <li class="flex justify-between">
290
+ <span>Lundi - Vendredi</span>
291
+ <span>8h - 18h</span>
292
+ </li>
293
+ <li class="flex justify-between">
294
+ <span>Samedi</span>
295
+ <span>9h - 12h</span>
296
+ </li>
297
+ <li class="flex justify-between">
298
+ <span>Dimanche</span>
299
+ <span>Fermé</span>
300
+ </li>
301
+ </ul>
302
+ </div>
303
+ </div>
304
+
305
+ <div class="border-t border-gray-800 mt-12 pt-8 text-center text-gray-400">
306
+ <p>&copy; 2023 ElectroDiesel Baia. Tous droits réservés.</p>
307
+ <div class="mt-4">
308
+ <a href="#" class="text-sm hover:text-white">Mentions légales</a>
309
+ <span class="mx-2">•</span>
310
+ <a href="#" class="text-sm hover:text-white">Politique de confidentialité</a>
311
+ <span class="mx-2">•</span>
312
+ <a href="#" class="text-sm hover:text-white">CGV</a>
313
+ </div>
314
+ </div>
315
+ </div>
316
+ </footer>
317
+
318
+ <script>
319
+ // Mobile menu toggle
320
+ document.getElementById('mobile-menu-button').addEventListener('click', function() {
321
+ const menu = document.getElementById('mobile-menu');
322
+ menu.classList.toggle('hidden');
323
+ });
324
+
325
+ // Smooth scrolling for anchor links
326
+ document.querySelectorAll('a[href^="#"]').forEach(anchor => {
327
+ anchor.addEventListener('click', function (e) {
328
+ e.preventDefault();
329
+
330
+ const targetId = this.getAttribute('href');
331
+ if (targetId === '#') return;
332
+
333
+ const targetElement = document.querySelector(targetId);
334
+ if (targetElement) {
335
+ targetElement.scrollIntoView({
336
+ behavior: 'smooth'
337
+ });
338
+ }
339
+ });
340
+ });
341
+ </script>
342
+ <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=Nonoms9/nono" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
343
+ </html>