refactor(styles): rename shadow and border variables

1 files changed, 13 insertions, 13 deletions

diff --git a/src/components/Buttons/Buttons.module.scss b/src/components/Buttons/Buttons.module.scss
index bc1597c..cee7918 100644
--- a/src/components/Buttons/Buttons.module.scss
+++ b/src/components/Buttons/Buttons.module.scss
@@ -70,7 +70,7 @@
 
   &:disabled {
     color: var(--color-fg-light);
-    border-color: var(--color-border);
+    border-color: var(--color-border-dark);
     cursor: wait;
   }
 
@@ -85,9 +85,9 @@
         fun.convert-px(6) fun.convert-px(8) 0 0 var(--color-bg),
         fun.convert-px(8) fun.convert-px(10) 0 0 var(--color-primary),
         fun.convert-px(10) fun.convert-px(12) fun.convert-px(1) 0
-          var(--color-shadow-lighter),
+          var(--color-shadow-light),
         fun.convert-px(10) fun.convert-px(12) fun.convert-px(5)
-          fun.convert-px(1) var(--color-shadow-lighter);
+          fun.convert-px(1) var(--color-shadow-light);
       color: var(--color-primary-light);
     }
 
@@ -99,7 +99,7 @@
       text-decoration: none;
       transform: translateX(#{fun.convert-px(5)})
         translateY(#{fun.convert-px(6)});
-      box-shadow: 0 0 0 0 var(--color-shadow-light);
+      box-shadow: 0 0 0 0 var(--color-shadow);
     }
   }
 }
@@ -116,11 +116,11 @@
   border: fun.convert-px(3) solid var(--color-primary);
   border-radius: fun.convert-px(5);
   box-shadow: fun.convert-px(1) fun.convert-px(1) fun.convert-px(1)
-      var(--color-shadow-light),
+      var(--color-shadow),
     fun.convert-px(1) fun.convert-px(2) fun.convert-px(2) fun.convert-px(-2)
-      var(--color-shadow-light),
+      var(--color-shadow),
     fun.convert-px(3) fun.convert-px(4) fun.convert-px(5) fun.convert-px(-4)
-      var(--color-shadow-light);
+      var(--color-shadow);
   color: var(--color-primary);
   font-weight: 600;
   text-decoration: underline transparent 0;
@@ -131,13 +131,13 @@
     border-color: var(--color-primary-light);
     color: var(--color-primary-light);
     box-shadow: fun.convert-px(1) fun.convert-px(1) fun.convert-px(1)
-        var(--color-shadow-lighter),
+        var(--color-shadow-light),
       fun.convert-px(1) fun.convert-px(2) fun.convert-px(2) fun.convert-px(-2)
-        var(--color-shadow-lighter),
+        var(--color-shadow-light),
       fun.convert-px(3) fun.convert-px(4) fun.convert-px(5) fun.convert-px(-4)
-        var(--color-shadow-lighter),
+        var(--color-shadow-light),
       fun.convert-px(7) fun.convert-px(10) fun.convert-px(12) fun.convert-px(-3)
-        var(--color-shadow-lighter);
+        var(--color-shadow-light);
     transform: scale(1.07);
   }
 
@@ -148,7 +148,7 @@
   &:active {
     border-color: var(--color-primary-dark);
     color: var(--color-primary-dark);
-    box-shadow: 0 0 0 0 var(--color-shadow-light);
+    box-shadow: 0 0 0 0 var(--color-shadow);
     text-decoration: underline transparent 0;
     transform: scale(0.94);
   }
@@ -235,7 +235,7 @@
   &:hover,
   &:focus {
     svg {
-      transform: scale(0.85) rotate(20deg) translateY(3px);
+      transform: scale(0.85) rotate(20deg) translateY(#{fun.convert-px(3)});
     }
   }