Changement Page Admin

src/App.js

@@ -1,8 +1,8 @@
 import React from 'react';
 import { BrowserRouter, Routes, Route } from 'react-router-dom';
-import Compte from './pages/Compte';
+//import Compte from './pages/Compte';
 //import Connexion from './pages/Connexion';
-// import Admin from './pages/Admin.js';
+import Admin from './pages/Admin.js';
 
 const App = () => {
   return (
@@ -12,7 +12,7 @@ const App = () => {
     //  </Routes>
     //</BrowserRouter>
 
-    <Compte />
+    <Admin/>
   );
 }
 

src/pages/Admin.js

@@ -17,7 +17,7 @@ const Admin = () => {
                     <button id="user" className="bouton" type="button" value="Supprimer un utilisateur" onClick={Delete_user}>Supprimer un utilisateur</button>
                 </div>
             </div>
-            <p className="Titre">Admin</p>
+            <p className="Titre">Admin
             <div className="Formulaire">
                 <form className="form">
                     <table className="Formulaire_de_connexion">
@@ -42,12 +42,15 @@ const Admin = () => {
                             <input id="password" className="texte_zone" type="text"/>
                         </tr>
                         <tr>
+                            <div className='bouton_submit'>
                                 <button className="bouton_val_ann" type="submit">Valider</button>
                                 <button className="bouton_val_ann" type="submit">Annuler</button>
+                            </div>
                         </tr>
                     </table>
                 </form>
             </div>
+            </p>
         </div>
     );
 };

src/styles/components/_admin.scss

@@ -100,31 +100,37 @@
     }*/
 
 
-    .Formulaire{
+    
-        display: flex;
-        flex-direction: column;
-        align-items: center;
-        width: 100%;
-    }
 
     .formulaire{
         display: flex;
         flex-direction: column;
+        border-radius: 30px;
         margin: 100px;
         padding: 30px;
         align-items: center;
     }
 
-
     .Titre{
         display: flex;
-        flex-direction: row;
+        flex-direction: column;
+        flex-basis: 100%;
+        border: 5px white inset;
         font-weight: bold;
         font-size: 80px;
-        margin: 20px;
+
+        .Formulaire{
+            display: flex;
+            flex-direction: column;
+            border: 5px white inset;
+            align-items: center;
+            font-size: 30px;
+            width: 100%;
         }
 
         .texte{
+            display: flex;
+            flex-direction: row;
             align-self: center;
             font-weight: bold;
             padding: 10px;
@@ -161,6 +167,12 @@
             display: flex;
             width: 400px;
         }
+
+        .bouton_submit{
+            display: flex;
+            flex-direction: row;
+        }
+    }  
 }
 
     

src/styles/components/_compte.scss

@@ -91,7 +91,7 @@ body {
             flex-direction: row;
             justify-content: space-between;
             width: auto;
-            height: 86%;
+            height: 82%;
     
             .nav_bar_verticale {
                 display: flex;
@@ -109,7 +109,7 @@ body {
             .Compte {
                 display: flex;
                 flex-direction: column;
-                width: 94.3%;
+                width: 94%;
                 height: auto;
 
                 background: rgba(255, 255, 255, 0.3);