change trash logo for modal

Leo-Brd · Nov 13, 2024 · 860d881 · 860d881
1 parent 6f54cda
commit 860d881
Show file tree

Hide file tree

Showing 2 changed files with 28 additions and 14 deletions.
diff --git a/FrontEnd/index.html b/FrontEnd/index.html
@@ -90,44 +90,44 @@ <h2>Contact</h2>
 
 	<div class="modal">
 		<div class="modal-content">
-			<i class="fa-solid fa-xmark"></i>
+			<i class="fa-solid fa-xmark close-modal"></i>
 			<h3>Galerie photo</h3>
 			<div class="modal-gallery">
 				<div class="modal-gallery-img">
 					<img src="assets/images/abajour-tahina.png">
-					<i class="fa-solid fa-trash"></i>
+					<i class="fa-solid fa-trash-can delete-project"></i>
 				</div>
 				<div class="modal-gallery-img">
 					<img src="assets/images/abajour-tahina.png">
-					<i class="fa-solid fa-trash"></i>
+					<i class="fa-solid fa-trash-can delete-project"></i>
 				</div>
 				<div class="modal-gallery-img">
 					<img src="assets/images/abajour-tahina.png">
-					<i class="fa-solid fa-trash"></i>
+					<i class="fa-solid fa-trash-can delete-project"></i>
 				</div>
 				<div class="modal-gallery-img">
 					<img src="assets/images/abajour-tahina.png">
-					<i class="fa-solid fa-trash"></i>
+					<i class="fa-solid fa-trash-can delete-project"></i>
 				</div>
 				<div class="modal-gallery-img">
 					<img src="assets/images/abajour-tahina.png">
-					<i class="fa-solid fa-trash"></i>
+					<i class="fa-solid fa-trash-can delete-project"></i>
 				</div>
 				<div class="modal-gallery-img">
 					<img src="assets/images/abajour-tahina.png">
-					<i class="fa-solid fa-trash"></i>
+					<i class="fa-solid fa-trash-can delete-project"></i>
 				</div>
 				<div class="modal-gallery-img">
 					<img src="assets/images/abajour-tahina.png">
-					<i class="fa-solid fa-trash"></i>
+					<i class="fa-solid fa-trash-can delete-project"></i>
 				</div>
 				<div class="modal-gallery-img">
 					<img src="assets/images/abajour-tahina.png">
-					<i class="fa-solid fa-trash"></i>
+					<i class="fa-solid fa-trash-can delete-project"></i>
 				</div>
 				<div class="modal-gallery-img">
 					<img src="assets/images/abajour-tahina.png">
-					<i class="fa-solid fa-trash"></i>
+					<i class="fa-solid fa-trash-can delete-project"></i>
 				</div>
 
 			</div>

diff --git a/FrontEnd/styles/modal.css b/FrontEnd/styles/modal.css
@@ -19,16 +19,21 @@
     flex-direction: column;
     align-items: center;
     background-color: white;
-    padding: 30px;
+    padding: 25px;
     border-radius: 8px;
-    width: 35%;
+    width: 37%;
     box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
 }
 
 
-.modal-content i {
+.close-modal {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    margin-left: auto;
     height: 24px;
     width: 24px;
+    font-size: 20px;
     cursor: pointer;
 }
 
@@ -54,11 +59,20 @@
     width: 77px;
 }
 
-.modal-gallery i {
+.delete-project {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    width: 17px;
+    height: 17px;
+    background-color: black;
+    color: white;
+    font-size: 10px;
     position: fixed;
 }
 
 #add-project-button {
+    margin-bottom: 15px;
     height: 36px;
     width: 237px;
 	font-family: 'Syne';