add hover on cart button (#50)

* add hover on cart button * change hover
fe-aug23-team4 · Dec 19, 2023 · 6ec1016 · 6ec1016
1 parent 936046e
commit 6ec1016
Show file tree

Hide file tree

Showing 2 changed files with 32 additions and 21 deletions.
diff --git a/src/modules/CartPage/CartPage.module.scss b/src/modules/CartPage/CartPage.module.scss
@@ -107,11 +107,21 @@
   color: $color__white;
   @include buttons-typography;
   background-color: $color__accent;
+  cursor: pointer;
+  transition: all 0.3s ease;
+
+  &:hover {
+      box-shadow: 0px 3px 13px 0px rgba(23, 32, 49, 0.40);
+    }
 
   &__DARK {
     border-radius: 0;
     color: $color__dark-theme__white;
     background-color: $color__dark-theme__accent;
+
+    &:hover {
+      background-color: $color__dark-theme__accent__hover;
+    }
   }
 }
 

diff --git a/src/styles/utils/variables/_colors.scss b/src/styles/utils/variables/_colors.scss
@@ -1,21 +1,22 @@
-// Bright theme
-$color__accent: #f86800;
-$color__secondary-accent: #476df4;
-$color__primary: #0f0f11;
-$color__secondary: #89939a;
-$color__icons: #b4bdc3;
-$color__elements: #e2e6e9;
-$color__hover-and-bg: #fafbfc;
-$color__white: #ffffff;
-$color__green: #27ae60;
-$color__red: #eb5757;
-
-// Dark theme
-$color__dark-theme__secondary: #75767f;
-$color__dark-theme__icons: #4a4d58;
-$color__dark-theme__elements: #3b3e4a;
-$color__dark-theme__surface-1: #161827;
-$color__dark-theme__surface-2: #323542;
-$color__dark-theme__black: #0f1121;
-$color__dark-theme__white: #f1f2f9;
-$color__dark-theme__accent: #905bff;
+// Bright theme
+$color__accent: #f86800;
+$color__secondary-accent: #476df4;
+$color__primary: #0f0f11;
+$color__secondary: #89939a;
+$color__icons: #b4bdc3;
+$color__elements: #e2e6e9;
+$color__hover-and-bg: #fafbfc;
+$color__white: #ffffff;
+$color__green: #27ae60;
+$color__red: #eb5757;
+
+// Dark theme
+$color__dark-theme__secondary: #75767f;
+$color__dark-theme__icons: #4a4d58;
+$color__dark-theme__elements: #3b3e4a;
+$color__dark-theme__surface-1: #161827;
+$color__dark-theme__surface-2: #323542;
+$color__dark-theme__black: #0f1121;
+$color__dark-theme__white: #f1f2f9;
+$color__dark-theme__accent: #905bff;
+$color__dark-theme__accent__hover: #a378ff;