commit fin de journée

css/contracts.css

@@ -1,8 +1,41 @@
+.card{
+  display: grid;
+  margin-top: 15px;
+  grid-template-columns: 1fr 1fr;
+}
 .contracts
 {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
+  position: absolute;
+  top: 25%;
+  left: 30%;
+}
+.card-body{
+  margin-left: 50px;
+}
+.card-button{
+  margin-top: 10px;
+}
+.btn-infos{
+  background-color: transparent;
+  border-color: rgb(0,255,0);
+  font-size: 15pt;
+  color:rgb(0,255,0);
+}
+.btn-accept{
+  background-color: transparent;
+  border-color: rgb(0,255,0);
+  font-size: 15pt;
+  color: rgb(0,255,0);
+}
+.btn-accept:hover{
+  transition: 0.2s;
+  color: rgb(208, 255, 0);
+  border-color: rgb(208, 255, 0);
+}
+.btn-infos:hover{
+  transition: 0.2s;
+  color: rgb(208, 255, 0);
+  border-color: rgb(208, 255, 0);
 }
 .img
 {

js/controllers/contracts.js

@@ -90,17 +90,12 @@ export default function contracts(temp_engine) {
                       <div class="card-body">                  
                           <h5 style="color:white" class="card-title">${contract.faction}</h5>
                           <p style="color:white" class="card-text">${contract.deadline}</p>
-                          <p style="color:white" class="card-text">${contract.deadline}</p>
-                          <p style="color:white" class="card-text">${contract.deadline}</p>
-                          <p style="color:white" class="card-text">${contract.deadline}</p>
-                          <p style="color:white" class="card-text">${contract.deadline}</p>
-                          <p style="color:white" class="card-text">${contract.deadline}</p>
                           <p class="card-text status-onhold">Status : ${status}</p>                                        
                           <p></p>                        
                       </div>
                       <div class="card-button">
-                        <button type="button" class="btn btn-primary btn-infos" data-bs-toggle="modal" data-bs-target="#exampleModal">Infos</button>
-                        <button data-id="${contract.id}" class="btn-modify btn btn-primary btn-accept" data-toggle="modal" data-target="#Modify" >Accepter</button>                       
+                        <button type="button" class="btn-infos" data-bs-toggle="modal" data-bs-target="#exampleModal">Infos</button>
+                        <button data-id="${contract.id}" class="btn-accept" data-toggle="modal" data-target="#Modify" >Accepter</button>                       
                       </div>
                     </div>
             `