From 1dcbe78fc3a1757b74b2b9fa26b8e78acfc886e6 Mon Sep 17 00:00:00 2001
From: Theo DUPIN <Theo.DUPIN@etu.uca.fr>
Date: Wed, 19 Oct 2022 15:22:44 +0200
Subject: [PATCH] Changement Page Admin

---
 src/App.js                        |   2 +
 src/pages/Admin.js                |   6 +-
 src/pages/Admin_modif.js          |   6 +-
 src/pages/Admin_supp.js           |  26 ++++---
 src/styles/components/_admin.scss | 111 ++++++++++++++++--------------
 5 files changed, 80 insertions(+), 71 deletions(-)

diff --git a/src/App.js b/src/App.js
index 0a5039a..10ccc6a 100644
--- a/src/App.js
+++ b/src/App.js
@@ -3,6 +3,7 @@ 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_supp from './pages/Admin_supp.js';
 
 const App = () => {
   return (
@@ -11,6 +12,7 @@ const App = () => {
        <Route path="/" element={<Connexion />} />
        <Route path="/Admin" element={<Admin />} />
        <Route path="/Account" element={<Compte />} />
+       <Route path="/Admin_supp" element={<Admin_supp />} />
      </Routes>
     </BrowserRouter>
   );
diff --git a/src/pages/Admin.js b/src/pages/Admin.js
index fc4aecf..d95e633 100644
--- a/src/pages/Admin.js
+++ b/src/pages/Admin.js
@@ -14,7 +14,7 @@ const Admin = () => {
                     <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>
+                    <button id="user" className="bouton" type="button" value="Supprimer un utilisateur" /*onClick={Delete_user}*/>Supprimer utilisateur</button>
                 </div>
             </div>
             <p className="Titre">Admin
@@ -65,10 +65,10 @@ function Modify_user(){
     document.location.href = "http://localhost:3000/";
 }
 
-function Delete_user(){
+/*function Delete_user(){
     //document.getElementById("user").onclick = function() {Delete_user()};
     document.location = './pages/Admin_supp';
     console.log(document.location);
-}
+}*/
 
 export default Admin;
\ No newline at end of file
diff --git a/src/pages/Admin_modif.js b/src/pages/Admin_modif.js
index 02a6ecc..018c5bd 100644
--- a/src/pages/Admin_modif.js
+++ b/src/pages/Admin_modif.js
@@ -7,13 +7,13 @@ const Admin_modif = () => {
             <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>
+                    <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 un utilisateur</button>
+                    <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 un utilisateur</button>
+                    <button id="user" className="bouton" type="button" value="Supprimer un utilisateur" /*onClick="Delete_user()"*/>Supprimer utilisateur</button>
                 </div>
             </div>
             <div className="Formulaire">
diff --git a/src/pages/Admin_supp.js b/src/pages/Admin_supp.js
index bbedf63..60a66fb 100644
--- a/src/pages/Admin_supp.js
+++ b/src/pages/Admin_supp.js
@@ -7,26 +7,24 @@ const Admin_supp = () => {
             <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>
+                    <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 un utilisateur</button>
+                    <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 un utilisateur</button>
+                    <button id="user" className="bouton" type="button" value="Supprimer un utilisateur" /*onClick="Delete_user()"*/>Supprimer utilisateur</button>
                 </div>
             </div>
-            <p className="Titre">Admin</p>
-            <form className="formulaire">
-                <table className="Formulaire_de_recherche">
-                    <tr>
-                        <input id="personne" type="search" className="texte_barre" placeholder="🔎 Rechercher un utilisateur" /*onClick={tab}*//>
-                    </tr>
-                    <tr>
-
-                    </tr>
-                </table>
-            </form>
+            <p className="Titre">Admin
+                <form className="formulaire">
+                    <table className="Formulaire_de_recherche">
+                        <tr>
+                            <input id="personne" type="search" className="texte_barre" placeholder="🔎 Rechercher un utilisateur" /*onClick={tab}*//>
+                        </tr>
+                    </table>
+                </form>
+            </p>
         </div>
     );
 };
diff --git a/src/styles/components/_admin.scss b/src/styles/components/_admin.scss
index c357bf5..73ea84b 100644
--- a/src/styles/components/_admin.scss
+++ b/src/styles/components/_admin.scss
@@ -9,7 +9,6 @@
         display: flex;
         flex-direction: column;
         width: 200px;
-        height: 735px;
         background: rgba(255, 255, 255, 0.143);
         box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);
         backdrop-filter: blur(3px);
@@ -73,66 +72,76 @@
         font-size: 30px;
     }*/
 
-
-    .Formulaire {
-        display: flex;
-        flex-direction: column;
-        align-items: center;
-        width: 100%;
-    }
-
-    .Formulaire{
+    .Titre {
         display: flex;
         flex-direction: column;
-        border-radius: 30px;
-        margin: 100px;
-        padding: 30px;
-        align-items: center;
-    }
+        background: rgba(255, 255, 255, 0.3);
+        border-radius: 15px;
+        box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);
+        backdrop-filter: blur(3px);
+        -webkit-backdrop-filter: blur(15px);
+        margin: 10px;
 
-    .texte {
-        align-self: center;
-        font-weight: bold;
-        padding: 10px;
-    }
+        .Formulaire {
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+            width: 100%;
+        }
 
-    .texte_zone {
-        width: 600px;
-        height: 50px;
-        background-color: transparent;
-        border-radius: 5px;
-        border: 0.5px solid;
-        padding-left: 10px;
-        padding-right: 10px;
-    }
+        .Formulaire{
+            display: flex;
+            flex-direction: column;
+            border-radius: 30px;
+            margin: 100px;
+            padding: 30px;
+            align-items: center;
+        }
 
-    .bouton_val_ann {
-        width: 150px;
-        height: 40px;
-        border-radius: 10px;
-        border: 0.5px solid;
-        color: $white;
-        border: 0;
-        background-color: black;
-        border: 1px solid rgba(255, 255, 255, 0.1);
-        backdrop-filter: blur(30px);
-        color: rgb(255, 255, 255);
-        cursor: pointer;
-        font-size: 15px;
-
-        &:hover {
-            background-color: rgba(114, 114, 114, 0.371);
+        .texte {
+            align-self: center;
+            font-weight: bold;
+            padding: 10px;
         }
 
-        &:active {
-            background-color: rgba(68, 68, 68, 0.972);
+        .texte_zone {
+            width: 600px;
+            height: 50px;
+            background-color: transparent;
+            border-radius: 5px;
+            border: 0.5px solid;
+            padding-left: 10px;
+            padding-right: 10px;
         }
 
-        .bouton_submit{
-            display: flex;
-            flex-direction: row;
+        .bouton_val_ann {
+            width: 150px;
+            height: 40px;
+            border-radius: 10px;
+            border: 0.5px solid;
+            color: $white;
+            border: 0;
+            background-color: black;
+            border: 1px solid rgba(255, 255, 255, 0.1);
+            backdrop-filter: blur(30px);
+            color: rgb(255, 255, 255);
+            cursor: pointer;
+            font-size: 15px;
+
+            &:hover {
+                background-color: rgba(114, 114, 114, 0.371);
+            }
+
+            &:active {
+                background-color: rgba(68, 68, 68, 0.972);
+            }
+
+            .bouton_submit{
+                display: flex;
+                flex-direction: row;
+            }
         }
-    }  
+    }
 }