j

login.php

@@ -11,10 +11,25 @@
     <?php include "header.php"?>
 
     <div class="main-body">
-        <form>
+        <div class=formcont>
+            <form id='user-infos-01' action='".$action."' method='post'>
+
+                <div class='form-group'>
+                    <label for='logmsg'>Ben ! Trouve un truc</label>
+                        </div>
+                <div class='form-group '>
+                    <input type='text' class='form-control' name='username' id='username' value='' placeholder="Pseudo">
+                </div>
+
+                <div class='form-group '>
+                    <input type='text' class='form-control' name='password' id='password' value='' placeholder="Mot de Passe">
+                </div>
+
+            <button type='submit' class='btn btn-primary'>Confirmer</button>
 
             </form>
         </div>
+    </div>
 
     <?php include "footer.php"?>
 </body>

main.css

@@ -269,6 +269,68 @@ ul {
     padding : 10px;
 }
 
+/*Login form*/
+.formcont {
+    flex: 1;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+}
+
+.formcont form {
+    width: 50vmin;
+    height: 40vmin;
+    border: 2px solid rgb(0, 0, 0);
+    padding: 20px;
+    display: flex;
+    flex-direction: column;
+    gap: 1.5vmin;
+    background:white;
+    border-radius: 12px;
+    box-shadow: 5px 5px 30px #555;
+}
+
+.formcont form .form-group {
+    width: 100%;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    padding: 1.2vmin;
+    padding-left:0px;
+}
+
+.formcont form .form-group label {
+    width: 95%;
+    text-align: center;
+    color:black;
+    font-size:5vmin;
+}
+
+.formcont form .form-group input {
+    width: 95%;
+    box-sizing: border-box;
+        font-size:3vmin;
+        padding:1vmin;
+
+}
+
+.formcont form button {
+    width: 48%;
+    height: 19%;
+    padding:0.5vmin;
+    box-sizing: border-box;
+    margin: 0 auto;
+    background: #ffa04d;
+    color: black;
+    font-size: 5vmin;
+    border-radius: 7px;
+    box-shadow: 2px 2px 0px #000000;
+}
+
+.form-control {
+    border-radius: 10px;
+    box-shadow: 3px 4px 5px #8c8c8c;
+}
 
 /*Footer et son contenue*/
 footer{