Make the shadows use a gray color since it's weird otherwise.

main
Zed A. Shaw 2 years ago
parent 7e743829b4
commit 9c493b978a
  1. 30
      static/color.css

@ -21,6 +21,18 @@
--value1: hsl(28, 18%, 14%); --value1: hsl(28, 18%, 14%);
--value0: hsl(105, 100%, 1%); --value0: hsl(105, 100%, 1%);
--gray9: hsl(0, 0%, 100%); /* not used too often */
--gray8: hsl(210, 17%, 98%);
--gray8a: hsl(210, 17%, 98%, 0);
--gray7: #e9ecef;
--gray6: #dee2e6;
--gray5: #ced4da;
--gray4: #adb5bd;
--gray3: #6c757d;
--gray2: #495057;
--gray1: #343a40;
--gray0: #212529;
--orange: #fb5607; --orange: #fb5607;
--yellow: #ffbe0b; --yellow: #ffbe0b;
--red: #ff006e; --red: #ff006e;
@ -49,17 +61,17 @@
--color-bg-tertiary: var(--value8); --color-bg-tertiary: var(--value8);
--color-secondary: var(--value1); --color-secondary: var(--value1);
--color-secondary-accent: var(--blue); --color-secondary-accent: var(--blue);
--color-shadow: var(--value4); --color-shadow: var(--gray4);
--color-shadow-secondary: var(--value3); --color-shadow-secondary: var(--gray3);
--color-shadow-dark: var(--value2); --color-shadow-dark: var(--gray2);
--color-bg-inverted: var(--value2); --color-bg-inverted: var(--value2);
--color-bg-code: #000; --color-bg-code: #000;
--color-text: var(--value0); --color-text: var(--value0);
--color-text-inverted: var(--value9); --color-text-inverted: var(--value9);
--color-bright: var(--value8); --color-bright: var(--value8);
--color-overlay-text: var(--value1); --color-overlay-text: var(--value1);
--color-overlay-background: var(--value6); --color-overlay-background: var(--gray6);
--color-overlay-shadow: var(--value0); --color-overlay-shadow: var(--gray0);
--color-border-tabs: var(--value2); --color-border-tabs: var(--value2);
--color-input-button: var(--value8); --color-input-button: var(--value8);
--color-input-border: var(--value1); --color-input-border: var(--value1);
@ -106,10 +118,10 @@
--color-bg: var(--value0); --color-bg: var(--value0);
--color-bg-secondary: var(--value2); --color-bg-secondary: var(--value2);
--color-bg-tertiary: var(--value3); --color-bg-tertiary: var(--value3);
--color-shadow-secondary: var(--value6); --color-shadow-secondary: var(--gray6);
--color-secondary: var(--value7); --color-secondary: var(--value7);
--color-secondary-accent: var(--value7); --color-secondary-accent: var(--value7);
--color-shadow: var(--value2); --color-shadow: var(--gray2);
--color-text: var(--value8); --color-text: var(--value8);
--color-text-secondary: var(--value8); --color-text-secondary: var(--value8);
--color-text-inverted: var(--value0); --color-text-inverted: var(--value0);
@ -128,8 +140,8 @@
--color-pulse-3: hsla(0, 0%, 80%, 0.1); --color-pulse-3: hsla(0, 0%, 80%, 0.1);
--color-pulse-4: hsla(0, 0%, 80%, 0); --color-pulse-4: hsla(0, 0%, 80%, 0);
--color-overlay-text: var(--value7); --color-overlay-text: var(--value7);
--color-overlay-background: var(--value2); --color-overlay-background: var(--gray2);
--color-overlay-shadow: var(--value6); --color-overlay-shadow: var(--gray6);
--color-scrollbar-thumb: hsla(0, 0%, 50%, 0.3); --color-scrollbar-thumb: hsla(0, 0%, 50%, 0.3);
--color-scrollbar-track-piece: hsla(0, 0%, 30%, 0.2); --color-scrollbar-track-piece: hsla(0, 0%, 30%, 0.2);
} }

Loading…
Cancel
Save