css playlist bientot fini

ci/assets/CSS/playlist.css

@@ -23,22 +23,21 @@ button.upload-image-button {
 }
 
 button.upload-image-button:hover {
-    background-color: green;
+    background-color: rgb(0, 255, 0);
     color: white;
 }
 
 /* Style pour le conteneur de la playlist */
 div.playlist-container {
-    display: flex;
-    flex-wrap: wrap;
-    justify-content: space-around;
+    display: grid;
+    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
+    gap: 20px;
     padding-top: 20px; /* Ajouter un padding pour éviter que le contenu ne soit caché par la barre de navigation */
+    justify-content: center; /* Centrer les éléments */
 }
 
 /* Style pour chaque élément de la playlist */
 div.playlist-item {
-    width: 200px;
-    margin: 10px;
     padding: 12px;
     border: 1px solid #ccc;
     border-radius: 8px;
@@ -47,20 +46,10 @@ div.playlist-item {
     box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
 }
 
+
 div.playlist-item img {
     max-width: 100%;
     height: auto;
     border-radius: 5px;
 }
 
-/* Style pour le nom de la playlist */
-div.playlist-item h3 {
-    margin-top: 10px;
-    font-size: 20px;
-    color: #333; /* changer la couleur du texte */
-}
-
-div.playlist-item:hover {
-    transform: scale(1.05);
-}
-

ci/assets/CSS/style.css

@@ -10,7 +10,7 @@ body {
 .content {
     max-width: 1200px;
     margin: 80px auto 0;
-    padding: 20px;
+    padding: 0px
 }
 
 .navbar a {
@@ -81,13 +81,9 @@ body {
 #Page {
     text-align: center;
     padding: 50px 0;
-    background: url(img/fond.jpeg);
+    background: url(../img/fond.jpeg);
 }
 
-#Page img {
-    width: 1000px;
-    height: 500PX;
-}
 
 .text-page {
     border-top: 2px solid #1ed860; 
@@ -124,6 +120,8 @@ body {
     flex-direction: row-reverse;
     align-items: center;
     justify-content: space-between;
+    height: auto;
+    max-width: 100%;
 }
 .box .box-img img{
      width: 250px;