From c79bf1fac838da984d11d08e8867eb893ce465f1 Mon Sep 17 00:00:00 2001 From: Moncef STITI Date: Sun, 14 Jan 2024 15:32:04 +0100 Subject: [PATCH] =?UTF-8?q?Modification=20de=20bugs=20+=20ajouts=20de=20no?= =?UTF-8?q?uvelles=20fonctionnalit=C3=A9s?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- css/reservation.css | 50 +++++++ css/styles.css | 58 ++++---- html/contact.html | 2 +- html/index.html | 90 ++++++------ html/reservation.html | 136 ++++++++++++++++++ .../client1.png | Bin .../client2.png | Bin .../client3.png | Bin js/reservation.js | 12 ++ js/script.js | 5 +- 10 files changed, 272 insertions(+), 81 deletions(-) create mode 100644 css/reservation.css create mode 100644 html/reservation.html rename img/{Avis clients => Avis_clients}/client1.png (100%) rename img/{Avis clients => Avis_clients}/client2.png (100%) rename img/{Avis clients => Avis_clients}/client3.png (100%) create mode 100644 js/reservation.js diff --git a/css/reservation.css b/css/reservation.css new file mode 100644 index 0000000..c6bc118 --- /dev/null +++ b/css/reservation.css @@ -0,0 +1,50 @@ +/* Ajoutez les styles nécessaires pour le formulaire de réservation */ +.content { + text-align: center; +} + +.reservation-section { + max-width: 600px; + margin: 0 auto; + text-align: center; + padding: 20px 0; +} + +.reservation-form { + max-width: 600px; + margin: 0 auto; + text-align: center; +} + +.reservation-form label { + display: block; + margin-bottom: 8px; +} + +.reservation-form input, +.reservation-form select { + width: 100%; + padding: 10px; + margin-bottom: 16px; + border: 1px solid #ccc; + border-radius: 5px; +} + +.reservation-form button { + margin-top: 10px; /* Ajoute un espace en haut du bouton */ + background-color: #FFB039; + padding: 10px 20px; + border: none; + border-radius: 5px; + color: white; + cursor: pointer; +} + +.reservation-form button:hover { + background-color: #E59800; +} + +.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 69672f4..45f01b8 100644 --- a/css/styles.css +++ b/css/styles.css @@ -239,11 +239,10 @@ p { position: relative; margin-bottom: 120px; } - .footer { - background-color: #4A305A; + background-color: #4A305A; /* Couleur de fond du pied de page */ color: white; - padding: 20px; /*hauteur du pied de page*/ + padding: 20px; /* Hauteur du pied de page */ text-align: center; } @@ -252,53 +251,50 @@ p { justify-content: space-around; } -.footer-section.horizontally-aligned { - display: flex; - align-items: center; +.footer-section { + text-align: center; + margin: 10px; +} + +.footer-signature { + order: 1; } .social-icons { display: flex; align-items: center; - gap: 10px; + 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 */ } .social-icon img { - width: 30px; - height: 30px; -} - - -.footer-section { - flex: 1; -} - -.footer-section p { - color:white; -} - -.footer-section img { - width: 30px; /* taille logo*/ + width: 30px; height: 30px; - margin-right: 5px; /* Ajoute de l'espace entre les logos et les noms */ } .footer-section h3 { margin-bottom: 10px; } -.footer-signature { - margin-top: 20px; +.footer-section img { + width: 30px; + height: 30px; + margin-right: 5px; } -.footer-signature p { - color:white; +/* Style pour les petits écrans */ +@media screen and (max-width: 768px) { + .footer-content { + flex-wrap: wrap; + } + + .footer-section { + flex: 1; + } } -.footer-signature img { - width: 200px; /* taille du logo */ - margin-bottom: 10px; -} + + .client-reviews { text-align: center; diff --git a/html/contact.html b/html/contact.html index 250e5a1..0f8db3e 100644 --- a/html/contact.html +++ b/html/contact.html @@ -17,7 +17,7 @@ Menu À propos Contact - Réserver une table + Réserver une table diff --git a/html/index.html b/html/index.html index c28f8a2..0730361 100644 --- a/html/index.html +++ b/html/index.html @@ -12,11 +12,11 @@ Neo Eat Logo @@ -37,6 +37,7 @@
+

Notre Concept

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.
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. @@ -97,49 +98,46 @@ Plat 3

Burger Ritz accompagné de frites croustillantes et d'une sauce maison secrète.

+ +
+ Voir plus de plats +
+
+ + +
+

Avis de nos clients

+
+
+ Client 1 +

Marie Dubois

+

+ "Délicieux ! J'ai adoré chaque bouchée. Une expérience culinaire exceptionnelle." +
+ ★★★★★ +

+
+
+ Client 2 +

Lucas Martin

+

+ "Le service était impeccable, et les plats étaient à la hauteur de mes attentes. Bravo Neo Eat !" +
+ ★★★★★ +

+
+
+ Client 3 +

Sophie Leroux

+

+ "Une explosion de saveurs dans chaque plat. Certainement l'un des meilleurs restaurants de la ville." +
+ ★★★★★ +

+
+
+
-
- Voir plus de plats -
- - - -
-

Avis de nos clients

-
-
- Client 1 -

Marie Dubois

-

- "Délicieux ! J'ai adoré chaque bouchée. Une expérience culinaire exceptionnelle." -
- ★★★★★ -

-
-
- Client 2 -

Lucas Martin

-

- "Le service était impeccable, et les plats étaient à la hauteur de mes attentes. Bravo Neo Eat !" -
- ★★★★★ -

-
-
- Client 3 -

Sophie Leroux

-

- "Une explosion de saveurs dans chaque plat. Certainement l'un des meilleurs restaurants de la ville." -
- ★★★★★ -

-
-
-
- - - - - - diff --git a/html/reservation.html b/html/reservation.html new file mode 100644 index 0000000..f25706e --- /dev/null +++ b/html/reservation.html @@ -0,0 +1,136 @@ + + + + + + + + Réserver une table - Neo Eat + + +
+ + + + +
+
+
+
+
+
+ +
+
+

Réserver une table

+

Choisissez une date et une heure parmi les disponibilités ci-dessous pour réserver une table.

+ + +
+ + + + + + + + + + + + + + + + + + + +
+ + +
+
+ + + + + + + + diff --git a/img/Avis clients/client1.png b/img/Avis_clients/client1.png similarity index 100% rename from img/Avis clients/client1.png rename to img/Avis_clients/client1.png diff --git a/img/Avis clients/client2.png b/img/Avis_clients/client2.png similarity index 100% rename from img/Avis clients/client2.png rename to img/Avis_clients/client2.png diff --git a/img/Avis clients/client3.png b/img/Avis_clients/client3.png similarity index 100% rename from img/Avis clients/client3.png rename to img/Avis_clients/client3.png diff --git a/js/reservation.js b/js/reservation.js new file mode 100644 index 0000000..7c60b0d --- /dev/null +++ b/js/reservation.js @@ -0,0 +1,12 @@ +// Pour que la date de réservation ne soit jamais inférieur à celle d'aujourd'hui +document.addEventListener('DOMContentLoaded', function () { + const today = new Date().toISOString().split('T')[0]; + document.getElementById('date').min = today; +}); + + +// Pour afficher un message de confirmation que la table à bien été réserver +function showReservationConfirmation() { + var confirmationMessage = document.getElementById("confirmation-message"); + confirmationMessage.style.display = "block"; +} \ No newline at end of file diff --git a/js/script.js b/js/script.js index 0e9cb9b..dff1636 100644 --- a/js/script.js +++ b/js/script.js @@ -1,3 +1,4 @@ +// Menu burger document.addEventListener('DOMContentLoaded', function () { const burgerMenu = document.querySelector('.burger-menu'); const navLinks = document.querySelector('.nav-links'); @@ -7,6 +8,7 @@ document.addEventListener('DOMContentLoaded', function () { }); }); +// Scroll jusqu'en au de la page function scrollToTop() { window.scrollTo({ top: 0, @@ -14,7 +16,7 @@ function scrollToTop() { }); } -// Afficher ou masquer le bouton en fonction de la position de défilement +// Afficher ou masquer le bouton de scroll en fonction de la position dans la page document.addEventListener('scroll', function () { const scrollTopBtn = document.getElementById('scrollTopBtn'); if (window.scrollY > 200) { @@ -23,3 +25,4 @@ document.addEventListener('scroll', function () { scrollTopBtn.style.display = 'none'; } }); +