configuration menu page admin OK

src/App.js

@@ -3,14 +3,18 @@ import { BrowserRouter, Routes, Route } from 'react-router-dom';
 import Compte from './pages/Compte';
 import Connexion from './pages/Connexion';
 import Admin from './pages/Admin.js';
+import Admin_modif from './pages/Admin_modif.js';
+import Admin_supp from './pages/Admin_supp.js';
 
 const App = () => {
   return (
     <BrowserRouter>
      <Routes>
-       <Route path="/" element={<Connexion />} />
-       <Route path="/Admin" element={<Admin />} />
-       <Route path="/Account" element={<Compte />} />
+      <Route path="/" element={<Connexion />} />
+      <Route path="/Admin" element={<Admin />} />
+      <Route path="/Account" element={<Compte />} />
+      <Route path="/Admin_modif" element={<Admin_modif />} />
+      <Route path="/Admin_supp" element={<Admin_supp />} />
      </Routes>
     </BrowserRouter>
   );

src/components/NavigationAdmin.js

@@ -6,15 +6,15 @@ const NavigationAdmin = () => {
 
         <div className="nav_bar_verticale">
             <img className="logo" srcSet="./LogoApp.svg"></img>
-            <div className="create_user">
+            <NavLink className="create_user" to="/Admin">
                 <button id="user" className="bouton" type="button" value="Créer un utilisateur" onClick="Create_user()">Créer un nouvel utilisateur</button>
-            </div>
-            <div className="modify_user">
+            </NavLink>
+            <NavLink className="modify_user" to="/Admin_modif">
                 <button id="user" className="bouton" type="button" value="Modifier un utilisateur" /*onClick="Modify_user()"*/>Modifier un utilisateur</button>
-            </div>
-            <div className="delete_user">
+            </NavLink>
+            <NavLink className="delete_user" to="/Admin_supp">
                 <button id="user" className="bouton" type="button" value="Supprimer un utilisateur" /*onClick="Delete_user()"*/>Supprimer un utilisateur</button>
-            </div>
+            </NavLink>
         </div>
 
     );

src/pages/Admin.js

@@ -1,22 +1,12 @@
 import React from 'react';
+import NavigationAdmin from '../components/NavigationAdmin.js';
 
 
 const Admin = () => {
     return (
         <div className="page_admin">
+            <NavigationAdmin />
             {/* Create a admin page */}
-            <div className="nav_bar_verticale">
-                <img className="logo" srcSet="./LogoApp.svg"></img>
-                <div className="create_user">
-                    <button id="user" className="bouton" type="button" value="Créer un utilisateur" onClick={Create_user}>Créer utilisateur</button>
-                </div>
-                <div className="modify_user">
-                    <button id="user" className="bouton" type="button" value="Modifier un utilisateur" onClick={Modify_user}>Modifier utilisateur</button>
-                </div>
-                <div className="delete_user">
-                    <button id="user" className="bouton" type="button" value="Supprimer un utilisateur" onClick={Delete_user}>Supprimer utilisateur</button>
-                </div>
-            </div>
             <p className="Titre">Admin
             <div className="Formulaire">
                 <form className="form">

src/pages/Admin_modif.js

@@ -1,21 +1,11 @@
 import React from 'react';
+import NavigationAdmin from '../components/NavigationAdmin.js';
 
 const Admin_modif = () => {
     return (
         <div className="page_admin">
             {/* Create a page to delete an user in the admin page*/}
-            <div className="nav_bar_verticale">
-                <img className="logo" srcSet="./LogoApp.svg"></img>
-                <div className="create_user">
-                    <button id="user" className="bouton" type="button" value="Créer un utilisateur" onClick="Create_user()">Créer un nouvel utilisateur</button>
-                </div>
-                <div className="modify_user">
-                    <button id="user" className="bouton" type="button" value="Modifier un utilisateur" /*onClick="Modify_user()"*/>Modifier un utilisateur</button>
-                </div>
-                <div className="delete_user">
-                    <button id="user" className="bouton" type="button" value="Supprimer un utilisateur" /*onClick="Delete_user()"*/>Supprimer un utilisateur</button>
-                </div>
-            </div>
+            <NavigationAdmin/>
             <div className="Formulaire">
                 <p className="Titre">Admin</p>
                 <form className="form">

src/pages/Admin_supp.js

@@ -1,10 +1,11 @@
 import React from 'react';
+import NavigationAdmin from '../components/NavigationAdmin.js';
 
 const Admin_supp = () => {
     return (
         <div className="page_admin">
             {/* Create a page to delete an user in the admin page*/}
-            
+            <NavigationAdmin/>
             <p className="Titre">Admin</p>
             <form className="formulaire">
                 <table className="Formulaire_de_recherche">

src/styles/components/_admin.scss

@@ -9,7 +9,7 @@
         display: flex;
         flex-direction: column;
         width: 200px;
-        height: 735px;
+        height: 100%;
         background: rgba(255, 255, 255, 0.143);
         box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);
         backdrop-filter: blur(3px);