Merge pull request #2350 from boltdesignsystem/feature/update-neutral…

…-grays Fix: refine neutral gray colors
boltdesignsystem · Oct 14, 2021 · 70ebb39 · 70ebb39
2 parents 00b5be1 + c30a498
commit 70ebb39
Show file tree

Hide file tree

Showing 3 changed files with 7 additions and 7 deletions.
diff --git a/packages/components/bolt-button/src/_button-settings-and-tools.scss b/packages/components/bolt-button/src/_button-settings-and-tools.scss
@@ -62,7 +62,7 @@ $bolt-button-border-style: $bolt-border-style;
 
   &:before {
     opacity: 0.8;
-    box-shadow: 0 0.2em 0.75em var(--m-bolt-neutral);
+    box-shadow: 0 0.2em 0.75em var(--bolt-color-gray);
   }
 
   &:after {

diff --git a/packages/elements/bolt-button/src/button.scss b/packages/elements/bolt-button/src/button.scss
@@ -54,7 +54,7 @@
 
   &:before {
     opacity: 0.8;
-    box-shadow: 0 0.2em 0.75em var(--m-bolt-neutral);
+    box-shadow: 0 0.2em 0.75em var(--bolt-color-gray);
   }
 
   &:after {

diff --git a/packages/global/styles/00-vars/_vars-mode.scss b/packages/global/styles/00-vars/_vars-mode.scss
@@ -6,7 +6,7 @@
 
 // Light and dark mode
 @mixin bolt-base-light-mode {
-  --m-bolt-neutral: var(--bolt-color-gray);
+  --m-bolt-neutral: var(--bolt-color-gray-dark);
   --m-bolt-text: var(--bolt-color-black);
   --m-bolt-bg: var(--bolt-color-white);
   --m-bolt-headline: var(--bolt-color-navy);
@@ -18,13 +18,13 @@
   --m-bolt-tertiary: hsla(220.4, 80%, 15%, 0.15);
   --m-bolt-text-on-tertiary: var(--m-bolt-headline);
   --m-bolt-disabled: var(--bolt-color-gray-light);
-  --m-bolt-text-on-disabled: var(--bolt-color-gray);
+  --m-bolt-text-on-disabled: var(--bolt-color-gray-xdark);
   --m-bolt-border: var(--m-bolt-tertiary);
   --m-bolt-img-filter: none;
 }
 
 @mixin bolt-base-dark-mode {
-  --m-bolt-neutral: var(--bolt-color-gray);
+  --m-bolt-neutral: var(--bolt-color-gray-light);
   --m-bolt-text: var(--bolt-color-white);
   --m-bolt-bg: var(--bolt-color-navy-xdark);
   --m-bolt-headline: var(--bolt-color-white);
@@ -35,8 +35,8 @@
   --m-bolt-text-on-secondary: var(--bolt-color-navy);
   --m-bolt-tertiary: hsla(0, 0%, 100%, 0.15);
   --m-bolt-text-on-tertiary: var(--m-bolt-headline);
-  --m-bolt-disabled: var(--bolt-color-gray-light);
-  --m-bolt-text-on-disabled: var(--bolt-color-gray);
+  --m-bolt-disabled: var(--bolt-color-gray-dark);
+  --m-bolt-text-on-disabled: var(--bolt-color-gray-light);
   --m-bolt-border: var(--m-bolt-tertiary);
   --m-bolt-img-filter: grayscale(100%) invert(100%) brightness(150%);
 }