changement des Nav.Link pour des Link avec nav-link en class. Permet de ne pas reloader la page quand on la change tout en changeant l'URL
This commit is contained in:
		| @@ -1,10 +1,42 @@ | ||||
| import React from "react"; | ||||
| import { Link } from "react-router-dom"; | ||||
|  | ||||
|  | ||||
| const Footer = () => { | ||||
|  | ||||
|     return ( | ||||
|         <footer> | ||||
|             Footer | ||||
|         <footer className="footer-container footer"> | ||||
|             <div className="row"> | ||||
|                 <div className="col-4"> | ||||
|                     <Link to="/aboutUs" className="text-light">À Propos</Link> | ||||
|                 </div> | ||||
|                 <div className="col-4"> | ||||
|                     <a className="text-light" >Nous Contacter</a> | ||||
|                 </div> | ||||
|                 <div className="col-4"> | ||||
|                     <a className="text-light" >Vie Privée</a> | ||||
|                 </div> | ||||
|             </div> | ||||
|             <br /> | ||||
|             <div> | ||||
|                 <h4 className="footer-msg"> | ||||
|                     Joignez les plus de 1 000 Québécois qui ont décidés d'acheter GM! | ||||
|                 </h4> | ||||
|             </div> | ||||
|             <div > | ||||
|                 <h6 >- Nos partenaires -</h6> | ||||
|             </div> | ||||
|             <div className="row"> | ||||
|                 <div className="col-4"> | ||||
|                 </div> | ||||
|                 <div className="col-4"> | ||||
|                 </div> | ||||
|                 <div className="col-4"> | ||||
|                 </div> | ||||
|             </div> | ||||
|             <div className="row text-white"> | ||||
|                 © 2022 - Les Grosses Mitaines à Ginette et Monique, inc. | ||||
|             </div> | ||||
|         </footer> | ||||
|     ); | ||||
| } | ||||
|   | ||||
| @@ -1,32 +1,32 @@ | ||||
| import React from "react"; | ||||
| import { Link } from "react-router-dom"; | ||||
| import Container from 'react-bootstrap/Container'; | ||||
| import Nav from 'react-bootstrap/Nav'; | ||||
| import Navbar from 'react-bootstrap/Navbar'; | ||||
| import NavDropdown from 'react-bootstrap/NavDropdown'; | ||||
| import { Link } from "react-router-dom"; | ||||
|  | ||||
|  | ||||
| const Topbar = () => { | ||||
|     return ( | ||||
|         <Navbar expand="sm" className="topbar-container"> | ||||
|             <Container> | ||||
|                 <Navbar.Brand href="/"> | ||||
|                 <Link className="navbar-brand" to="/"> | ||||
|                     <img src="/images/LesGrossesMitaines.png" height="45"/> | ||||
|                 </Navbar.Brand> | ||||
|                 </Link> | ||||
|                 <Navbar.Toggle aria-controls="basic-navbar-nav" /> | ||||
|                 <Navbar.Collapse id="basic-navbar-nav"> | ||||
|                     <Nav className="me-auto"> | ||||
|                         <Nav.Link href="/" > | ||||
|                         <Link className="nav-link" to="/" > | ||||
|                             Maison | ||||
|                         </Nav.Link> | ||||
|                         <Nav.Link href="/aboutUs" > | ||||
|                         </Link> | ||||
|                         <Link className="nav-link" to="/aboutUs" > | ||||
|                             À propos de nous | ||||
|                         </Nav.Link> | ||||
|                         <Nav.Link href="/contactUs" > | ||||
|                         </Link> | ||||
|                         <Link className="nav-link" to="/contactUs" > | ||||
|                             Contactez-nous | ||||
|                         </Nav.Link> | ||||
|                         <Nav.Link href="/privacy" > | ||||
|                         </Link> | ||||
|                         <Link className="nav-link" to="/privacy" > | ||||
|                             Vie privée | ||||
|                         </Nav.Link> | ||||
|                         </Link> | ||||
|                     </Nav> | ||||
|                 </Navbar.Collapse> | ||||
|             </Container> | ||||
|   | ||||
| @@ -106,6 +106,11 @@ body { | ||||
|     background-color: plum; | ||||
| } | ||||
|  | ||||
| .footer-container{ | ||||
|     margin-top: 5%; | ||||
|     background-color: black; | ||||
| } | ||||
|  | ||||
| /* specification pour les écrans plus petits / cells */ | ||||
| @media (max-width:450px) { | ||||
|     .featured-img { | ||||
|   | ||||
		Reference in New Issue
	
	Block a user