Ajout de la page d'accueil, règles du jeu, confidentialité, mentions légales et contact

frontend/src/components/Footer.jsx

@@ -0,0 +1,217 @@
+import { Link } from 'react-router-dom'
+
+export default function Footer() {
+  return (
+    <footer className="bg-green-900 text-white">
+
+
+      {/* Partie principale */}
+      <div className="max-w-7xl mx-auto px-6 py-12 grid md:grid-cols-4 gap-10">
+
+
+        {/* Logo */}
+        <div>
+
+          <Link to="/accueil">
+            <h3 className="text-xl font-bold mb-3">
+              Thé Tip Top
+            </h3>
+          </Link>
+
+
+          <p className="text-green-100 text-sm leading-relaxed">
+            Participez au jeu-concours Thé Tip Top et tentez de gagner
+            des lots gourmands autour du thé.
+          </p>
+
+        </div>
+
+
+
+        {/* Navigation */}
+        <div>
+
+          <h3 className="text-lg font-semibold mb-5">
+            Navigation
+          </h3>
+
+
+          <ul className="space-y-3 text-green-100">
+
+            <li>
+              <Link
+                to="/accueil"
+                className="hover:text-white transition"
+              >
+                Accueil
+              </Link>
+            </li>
+
+
+            <li>
+              <Link
+                to="/regles-jeu"
+                className="hover:text-white transition"
+              >
+                Règles du jeu
+              </Link>
+            </li>
+
+
+            <li>
+              <Link
+                to="/saisir-code-unique"
+                className="hover:text-white transition"
+              >
+                Tester mon code
+              </Link>
+            </li>
+
+
+            <li>
+              <Link
+                to="/inscription"
+                className="hover:text-white transition"
+              >
+                Créer un compte
+              </Link>
+            </li>
+
+          </ul>
+
+        </div>
+
+
+
+
+        {/* Informations légales */}
+        <div>
+
+          <h3 className="text-lg font-semibold mb-5">
+            Informations
+          </h3>
+
+
+          <ul className="space-y-3 text-green-100">
+
+            <li>
+              <Link
+                to="/mentions-legales"
+                className="hover:text-white transition"
+              >
+                Mentions légales
+              </Link>
+            </li>
+
+
+            <li>
+              <Link
+                to="/confidentialite"
+                className="hover:text-white transition"
+              >
+                Politique de confidentialité
+              </Link>
+            </li>
+
+
+            <li>
+              <Link
+                to="/contact"
+                className="hover:text-white transition"
+              >
+                Contact
+              </Link>
+            </li>
+
+          </ul>
+
+        </div>
+
+
+
+
+        {/* Contact */}
+        <div>
+
+          <h3 className="text-lg font-semibold mb-5">
+            Contact
+          </h3>
+
+          <p className="text-green-100 text-sm mb-3">
+            Une question sur le jeu ?
+          </p>
+
+          <a href="tel:+33184802034" className="block mt-2 font-medium hover:text-green-300">
+            01 84 80 20 34
+          </a>
+
+          <a href="mailto:contact@thetiptop.fr" className="inline-block mt-3 font-medium hover:text-green-300">
+            contact@thetiptop.fr
+          </a>
+
+          <p className="text-green-100 text-sm mt-2">
+            18 rue Léon Frot
+            <br />
+            75011 Paris, France
+          </p>
+
+
+        </div>
+
+
+      </div>
+
+
+
+      {/* Barre basse */}
+
+      <div className="border-t border-green-800">
+
+        <div className="max-w-7xl mx-auto px-6 py-5 flex flex-col md:flex-row justify-between items-center gap-3">
+
+
+          <p className="text-green-200 text-sm">
+            © {new Date().getFullYear()} Thé Tip Top. Tous droits réservés.
+          </p>
+
+          <div className="flex gap-5 text-sm text-green-200">
+            <a
+              href="https://www.facebook.com/profile.php?id=61590449280854"
+              target="_blank"
+              rel="noopener noreferrer"
+              className="hover:text-white transition"
+            >
+              Facebook
+            </a>
+
+
+            <a
+              href="https://www.instagram.com/thetiptop.gp4?igsh=MXZ3YzZ0d3dkazBpeg%3D%3D&utm_source=qr"
+              target="_blank"
+              rel="noopener noreferrer"
+              className="hover:text-white transition"
+            >
+              Instagram
+            </a>
+
+
+            <a
+              href="https://www.tiktok.com/@thetiptop4"
+              target="_blank"
+              rel="noopener noreferrer"
+              className="hover:text-white transition"
+            >
+              TikTok
+            </a>
+
+          </div>
+
+
+        </div>
+
+      </div>
+
+
+    </footer>
+  )
+}