iqjoiqjsojs

Author: steph1111

_includes/robot-card.html

@@ -6,7 +6,7 @@
                 <figure class="image is-5by4" style="background-image: url({{robot.image}});"></figure>
                 <div class="overlay">
                     <h2 class="has-text-weight-bold is-size-3">{{ robot.year }}</h2>
-                    <p class="has-text-white-ter has-text-weight-normal">{{ robot.name }}</p>
+                    <p class="has-text-grey has-text-weight-normal">{{ robot.name }}</p>
                 </div>
             </a>
         </div>

assets/css/style.scss

@@ -208,7 +208,6 @@
 #robots {
     #robot-card {
         position: relative;
-
         .image {
             position: relative;
             background-size: cover;
@@ -218,7 +217,6 @@
             transition: filter 0.5s ease, transform 0.5s ease;
             filter: grayscale(100%);
         }
-
         .image::before {
             content: '';
             position: absolute;
@@ -229,7 +227,6 @@
             background: rgba(0, 0, 0, 0.7);
             pointer-events: none; 
         }
-
         .overlay {
             position: absolute;
             top: 0;
@@ -244,25 +241,23 @@
             pointer-events: none;
             transition: opacity 0.5s ease;
         }
-
         .robot-link:hover .image {
             filter: grayscale(0%);
             background: rgba(0, 0, 0, 0);
         }
-
-
+        .robot-link:hover .image::before {
+            opacity: 0;
+        }
         h2 {
             color: var(--primary) !important;
         }
-
         h2, p {
             z-index: 2;
             position: relative;
             transition: opacity 0.5s ease;
             pointer-events: none;
         }
-
-        .robot-link:hover h2, .robot-link:hover p {
+        .robot-link:hover h2 {
             color: var(--white) !important;
         }
     }