hover effect on card added

mate-academy · Nov 2, 2024 · a7d5f1d · a7d5f1d
1 parent 100cfac
commit a7d5f1d
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 0 deletions.
diff --git a/src/styles/index.scss b/src/styles/index.scss
@@ -95,6 +95,7 @@ body {
   flex-wrap: wrap;
   justify-content: center;
   align-items: center;
+  transition: transform 300ms;
 
   &__image {
     background-image: url(../images/imac.jpeg);
@@ -182,6 +183,14 @@ body {
       color: $third-color;
     }
   }
+
+  &:hover {
+    transform: scale(1.2);
+  }
+
+  &:hover .card__name {
+    color: $fifth-color;
+  }
 }
 
 .stars {

diff --git a/src/styles/variables.scss b/src/styles/variables.scss
@@ -3,3 +3,4 @@ $main-color: #060b35;
 $second-color: #616070;
 $third-color: #00acdc;
 $fourth-color: white;
+$fifth-color: #34568b;