From 7cacf9f3ff9c3956d26989fe4e708aa3ff581179 Mon Sep 17 00:00:00 2001 From: stiti Date: Mon, 15 Jan 2024 18:32:55 +0100 Subject: [PATCH] Ajout de FAQ --- css/contact.css | 3 +- css/faq.css | 37 ++++++++++ css/index.css | 1 + css/reservation.css | 2 - css/styles.css | 109 +++++++++++++++++++----------- html/contact.html | 21 +++--- html/faq.html | 154 ++++++++++++++++++++++++++++++++++++++++++ html/index.html | 38 +++++++---- html/reservation.html | 21 +++--- js/faq.js | 22 ++++++ 10 files changed, 334 insertions(+), 74 deletions(-) create mode 100644 css/faq.css create mode 100644 css/index.css create mode 100644 html/faq.html create mode 100644 js/faq.js diff --git a/css/contact.css b/css/contact.css index 82234d5..d1182d5 100644 --- a/css/contact.css +++ b/css/contact.css @@ -47,5 +47,4 @@ background-color: #f0f0f0; border-radius: 8px; overflow: hidden; -} - +} \ No newline at end of file diff --git a/css/faq.css b/css/faq.css new file mode 100644 index 0000000..56af532 --- /dev/null +++ b/css/faq.css @@ -0,0 +1,37 @@ +.faq-section { + max-width: 800px; + margin: 0 auto; +} + +.faq-item { + margin-bottom: 20px; +} + + +.faq-question-btn { + background-color: #FFB039; + color: white; + padding: 10px; + border: none; + border-radius: 5px; + cursor: pointer; + width: 100%; + text-align: left; +} + +.faq-answer { + display: none; + padding: 10px; + border: 1px solid #ccc; + border-radius: 5px; + margin-top: 10px; +} + +.faq-answer p { + margin: 0; +} + +.faq-item.active .faq-question-btn { + background-color: #4A305A; +} + diff --git a/css/index.css b/css/index.css new file mode 100644 index 0000000..d432d3d --- /dev/null +++ b/css/index.css @@ -0,0 +1 @@ +/*enlever les trucs supplémentaires dans styles.css de index.html et les mettre ici */ \ No newline at end of file diff --git a/css/reservation.css b/css/reservation.css index c6bc118..75213f3 100644 --- a/css/reservation.css +++ b/css/reservation.css @@ -1,4 +1,3 @@ -/* Ajoutez les styles nécessaires pour le formulaire de réservation */ .content { text-align: center; } @@ -47,4 +46,3 @@ .reservation-form { text-align: center; /* Centre le formulaire */ } -/* Ajoutez les styles nécessaires pour le formulaire de réservation */ diff --git a/css/styles.css b/css/styles.css index 45f01b8..f2c57a3 100644 --- a/css/styles.css +++ b/css/styles.css @@ -10,7 +10,6 @@ body { padding-top: 80px; font-family: 'Arial', sans-serif; background-color: #F2F2F2; - display: flex; flex-direction: column; min-height: 100vh; } @@ -35,18 +34,6 @@ body { margin-left: 1cm; } -.nav-links { - display: flex; - align-items: center; -} - -.nav-link { - color: white; - text-decoration: none; - margin: 0 15px; - transition: color 0.3s ease; -} - .reserve-btn { background-color: #FFB039; padding: 10px 20px; @@ -66,9 +53,6 @@ body { margin: 6px 0; } -.nav-link:hover { - color: #87CEEB; -} @media screen and (max-width: 768px) { .nav-links { @@ -94,6 +78,14 @@ body { .burger-menu { display: block; } + + .footer-content { + flex-wrap: wrap; + } + + .footer-section { + flex: 1; + } } .content { @@ -179,6 +171,7 @@ p { width: 80%; /* largeur de la fenêtre de la vidéo */ max-height: 400px; margin-bottom: 20px; + margin-top: 10px; } .plats-populaires { @@ -246,6 +239,10 @@ p { text-align: center; } +.footer p { + color: white; +} + .footer-content { display: flex; justify-content: space-around; @@ -260,14 +257,14 @@ p { order: 1; } -.social-icons { +.logo-reseaux { display: flex; align-items: center; - justify-content: center; /* Centrez les icônes sur les petits écrans */ - margin-top: 10px; /* Ajoutez une marge pour séparer les icônes du texte */ + justify-content: center; /* Centrer les icônes sur les petits écrans */ + margin-top: 10px; /* Ajouter une marge pour séparer les icônes du texte */ } -.social-icon img { +.logo-reseaux img { width: 30px; height: 30px; } @@ -282,33 +279,19 @@ p { margin-right: 5px; } -/* Style pour les petits écrans */ -@media screen and (max-width: 768px) { - .footer-content { - flex-wrap: wrap; - } - - .footer-section { - flex: 1; - } -} - - - - -.client-reviews { +.client-evaluations { text-align: center; padding: 20px 0; } -.client-review-container { +.client-evaluation-container { display: flex; overflow-x: auto; justify-content: center; margin-top: 20px; } -.client-review { +.client-evaluation { flex: 1; max-width: 300px; margin: 10px; @@ -319,19 +302,19 @@ p { padding: 15px; } -.client-review img { +.client-evaluation img { max-width: 100%; border-radius: 50%; margin-bottom: 10px; } -.client-review p { +.client-evaluation p { color: #333; font-size: 16px; line-height: 1.5; } -.client-review h3 { +.client-evaluation h3 { margin-top: 10px; color: #4A305A; } @@ -347,3 +330,49 @@ p { margin-top: 20px; border-radius: 8px; } + +/* MENU DROPDOWN -> Pour à propos*/ + +.dropdown { + position: relative; + display: inline-block; +} + +.dropdown-content { + display: none; + position: absolute; + background-color: #FFB039; + box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1); + border-radius: 8px; + z-index: 1; +} + +.dropdown-content a { + text-decoration: none; + padding: 12px 16px; + display: block; + transition: background-color 0.3s, color 0.3s; +} + +.dropdown:hover .dropdown-content { + display: block; +} + +/*Couleur des éléments de la nav bar Accueil, Menu, À propos ... */ +.nav-links a { + color: white; + text-decoration: none; /*Enlève le soulignement hyperlink*/ + margin: 0 15px; +} + +/* Couleur de survol de Accueil, Menu, À propos, and Contact */ +.nav-links a:hover, +.dropdown:hover .dropdown-btn { + color: #FFB039; +} + +/* Couleur du survol de Réserver une table, FAQ, Nos chefs, Nos fournisseurs, Nos équipes */ +.nav-link.reserve-btn:hover, +.dropdown-content a:hover { + color: #4A305A; +} diff --git a/html/contact.html b/html/contact.html index 0f8db3e..300853e 100644 --- a/html/contact.html +++ b/html/contact.html @@ -13,13 +13,21 @@ Neo Eat Logo - +
@@ -80,7 +88,7 @@

Réseaux sociaux

-
Neo Eat Logo

© 2024 Neo Eat. Tous droits réservés.

-

Une bouchée dans le futur.

diff --git a/html/faq.html b/html/faq.html new file mode 100644 index 0000000..7a097cf --- /dev/null +++ b/html/faq.html @@ -0,0 +1,154 @@ + + + + + + + + FAQ - Neo Eat + + +
+ + +
+
+
+
+
+
+ +
+
+

Foire aux questions

+ +
+ +
+

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed pulvinar libero vel ligula ultrices, eget accumsan velit congue.

+
+
+ +
+ +
+

Maecenas eu lectus vitae nulla consectetur fermentum. Aliquam auctor, elit vel tincidunt molestie, purus elit placerat ex.

+
+
+ +
+ +
+

Vestibulum sed ligula non arcu feugiat ultrices. Duis fermentum ultrices urna, at feugiat tortor bibendum id.

+
+
+ +
+ +
+

Vestibulum sed ligula non arcu feugiat ultrices. Duis fermentum ultrices urna, at feugiat tortor bibendum id.

+
+
+ +
+ +
+

Vestibulum sed ligula non arcu feugiat ultrices. Duis fermentum ultrices urna, at feugiat tortor bibendum id.

+
+
+ +
+ +
+

Vestibulum sed ligula non arcu feugiat ultrices. Duis fermentum ultrices urna, at feugiat tortor bibendum id.

+
+
+ + + +
+ +
+

Vestibulum sed ligula non arcu feugiat ultrices. Duis fermentum ultrices urna, at feugiat tortor bibendum id.

+
+
+
+
+ + + + + + + + diff --git a/html/index.html b/html/index.html index 0730361..b7f0be9 100644 --- a/html/index.html +++ b/html/index.html @@ -4,6 +4,7 @@ + Neo Eat @@ -12,13 +13,21 @@ Neo Eat Logo - +
@@ -30,16 +39,15 @@
-

Bienvenue chez Neo Eat !

-

Notre Concept

+

Bienvenue chez Neo Eat !

- Bienvenue chez Neo Eat, où la créativité des chefs étoilés s'unit à la précision de la technologie. Nos chefs renommés imaginent des recettes exceptionnelles, harmonisant saveurs raffinées et innovations culinaires. Dans nos cuisines, des robots de pointe, guidés par ces recettes d'exception, assurent une expérience gastronomique unique. + Neo Eat, où la créativité des chefs étoilés s'unit à la précision de la technologie. Nos chefs renommés imaginent des recettes exceptionnelles, harmonisant saveurs raffinées et innovations culinaires. Dans nos cuisines, des robots de pointe, guidés par ces recettes d'exception, assurent une expérience gastronomique unique.
Découvrez l'alliance parfaite entre l'art culinaire humain et la précision technologique des robots. Vous avez la chance de voir ces machines à l'œuvre, créant vos plats sous vos yeux. Laissez-vous séduire par cette fusion unique de talent culinaire et d'innovation. Chez Neo Eat, chaque plat est une expérience mémorable, alliant la passion des chefs au futur de la cuisine.

Tables du restaurant @@ -105,10 +113,10 @@
-
+

Avis de nos clients

-
-
+
+
Client 1

Marie Dubois

@@ -117,7 +125,7 @@ ★★★★★

-
+
Client 2

Lucas Martin

@@ -126,7 +134,7 @@ ★★★★★

-
+
Client 3

Sophie Leroux

@@ -136,6 +144,9 @@

+
+ Voir plus d'évaluations +
@@ -156,7 +167,7 @@

Réseaux sociaux

-