Ajout du nouveau background pour les contracts et ajout des fleches

css/global.css

@@ -5,6 +5,7 @@
 body,
 html {
   height: 100%;
+  background-image: url("/assets/contracts/contractscreen.png");
 }
 
 
@@ -43,10 +44,11 @@ html {
 .contract-screen {
   display: flex;
   justify-content: center;
-  background-image: url("/assets/contracts/contractscreen.png");
+  background-image: url("/assets/contracts/screen.png");
   background-repeat: no-repeat;
   background-position: center;
   height: 100vh;
+  width: 100%;
 
 }
 
@@ -56,10 +58,10 @@ html {
   margin-left: 200px;
   margin-top: -160px;
   width: 100%;
+  border-width: 100px;
 }
 
 .card-body button {
-  margin-top: 50px;
   margin-right: 29px;
   margin-left: -11px;
   width: 240px;
@@ -69,7 +71,6 @@ html {
   margin-left: 240px;
   margin-top: 225px;
   height: 100vh;
-  width: 100vh;
 }
 
 /* Modal */

css/style.css

@@ -30,7 +30,8 @@ body {
     margin: 10px;
     width: fit-content;
     margin: auto;
-    margin-top: 10px; margin-bottom: 30px;
+    margin-top: 10px;
+    margin-bottom: 30px;
     flex-direction: column;
     align-items: center;
     border: 4px solid rgba(68, 68, 68, 0.575);
@@ -43,7 +44,8 @@ body {
     margin: 10px;
     width: 95%;
     margin: auto;
-    margin-top: 10px; margin-bottom: 30px;
+    margin-top: 10px;
+    margin-bottom: 30px;
     flex-direction: column;
     align-items: center;
     border: 4px solid rgba(68, 68, 68, 0.575);

html/templates/contracts/contracts.html

@@ -3,6 +3,6 @@
     <div class="contracts"></div>
 </div>
 <div class="arrows">
-    <input type="image" id="leftarrow" alt="Login" src="/assets/contracts/leftarrow.png" />
-    <input type="image" id="rightarrow" alt="Login" src="/assets/contracts/rightarrow.png" />
+    <input type="image" id="leftarrow" alt="" src="/assets/contracts/leftarrow.png" />
+    <input type="image" id="rightarrow" alt="" src="/assets/contracts/rightarrow.png" />
 </div>

js/controllers/contracts.js

@@ -28,8 +28,6 @@ export default (temp_engine) => {
               $(e.target).parent().children(".status-onhold").html("Status : accepté");
               $(e.target).parent().children(".status-onhold").attr("class", 'status-accepted');
               $(e.target).html("Contract accepted")
-              // $(e.target).remove();
-
             });
           }
         });
@@ -86,9 +84,9 @@ export default (temp_engine) => {
                         <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-accepted">Status : ${status}</p>
-                        <button data-id="${contract.id}" class="btn-modify btn btn-primary btn-accept" data-toggle="modal" data-target="#Modify" >Contract accepted</button>                      
+                        <p></p>
                         <button data-id="${contract.id}" 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" >Contract accepted</button>  
                       </div>
                     </div>
             `
@@ -117,9 +115,6 @@ export default (temp_engine) => {
         }
 
         $('.contracts').append(card);
-        $('.contracts').append(card);
-
-
 
       });