cards e homepage

BeatriceV96 · May 17, 2024 · fdc130d · fdc130d
1 parent e6dbbad
commit fdc130d
Show file tree

Hide file tree

Showing 2 changed files with 53 additions and 15 deletions.
diff --git a/assets/css/home.css b/assets/css/home.css
@@ -117,23 +117,23 @@ ul li a {
   gap: 10px;
 }
 
-.main_content{
+.main_content {
   height: 80%;
-  overflow-y: auto; 
-  padding-right: 15px; 
+  overflow-y: auto;
+  padding-right: 15px;
 }
 
 .main_content::-webkit-scrollbar {
   width: 10px;
 }
 
 .main_content::-webkit-scrollbar-thumb {
-  background: #888; 
+  background: #888;
   border-radius: 10px;
 }
 
 .main_content::-webkit-scrollbar-thumb:hover {
-  background: #555; 
+  background: #555;
 }
 
 .my-playlist {
@@ -440,6 +440,45 @@ td:first-child {
 
 /*card cuore*/
 
+.main_content
+  .px-3
+  section
+  .container
+  .row:nth-child(2)
+  .col-lg-4:nth-child(3)
+  .card-body
+  .d-flex {
+  height: 85%;
+}
+
+img#brani-preferiti {
+  width: 70% !important;
+}
+
+@media screen and (min-width: 992px) {
+  img#brani-preferiti {
+    width: 100% !important;
+  }
+}
+
+@media screen and (min-width: 1200px) {
+  img#brani-preferiti {
+    width: 85% !important;
+  }
+}
+
+@media screen and (min-width: 1366px) {
+  img#brani-preferiti {
+    width: 82% !important;
+  }
+}
+
+@media screen and (min-width: 1366px) {
+  img#brani-preferiti {
+    width: 75% !important;
+  }
+}
+
 @media (max-width: 426px) {
   /* Quando la larghezza dello schermo è inferiore a 576px (dimensioni SM) */
   .section-colonna-centrale {

diff --git a/home.html b/home.html
@@ -159,24 +159,24 @@
               <div class="w-50 my-1 ms-2">
                 <img
                   class="ms-3"
-                  src="./assets/imgs/main/image-1.jpg"
+                  src="https://e-cdns-images.dzcdn.net/images/cover/31524c72d0fe579e0fbcb2af84306031/500x500-000000-80-0-0.jpg"
                   alt="img1"
                   width="180px"
                   height="90%"
                 />
               </div>
               <div class="d-flex flex-column ms-3 w-100 mt-3">
                 <div>
-                  <p>ALBUM</p>
+                  <p>TRADIMENTO</p>
                 </div>
                 <div>
-                  <h1>TITOLO(FEAT)</h1>
+                  <h1>COCCOLE</h1>
                 </div>
                 <div>
-                  <p>Artista</p>
+                  <p>Fabri Fibra</p>
                 </div>
                 <div>
-                  <p>Ascolta il nuovo pezzo</p>
+                  <p>Ascolta su Spotify</p>
                 </div>
                 <div class="d-flex align-items- justify-content-between">
                   <div>
@@ -274,7 +274,7 @@ <h5 class="card-title text-white text-center mb-0">
                               />
                             </div>
                             <h5 class="card-title text-white text-center mb-0">
-                              Death Usb
+                              Truceklan
                             </h5>
                           </div>
                         </div>
@@ -312,7 +312,7 @@ <h5 class="card-title text-white text-center mb-0">
                               />
                             </div>
                             <h5 class="card-title text-white text-center mb-0">
-                              Death Usb
+                              Cor Veleno
                             </h5>
                           </div>
                         </div>
@@ -352,7 +352,7 @@ <h5 class="card-title text-white text-center mb-0">
                               />
                             </div>
                             <h5 class="card-title text-white text-center mb-0">
-                              Death Usb
+                              Club Dogo
                             </h5>
                           </div>
                         </div>
@@ -390,7 +390,7 @@ <h5 class="card-title text-white text-center mb-0">
                               />
                             </div>
                             <h5 class="card-title text-white text-center mb-0">
-                              Death Usb
+                              Death Row
                             </h5>
                           </div>
                         </div>
@@ -423,7 +423,6 @@ <h5 class="card-title text-white text-center mb-0">
                   </div>
                 </div>
               </section>
-
 
               <div class="d-flex mx-2">
                 <h2 class="text-white my-4 fw-bold fs-5">