From 95fc9b142a4f4b5a3d2c350fafbd27b7b16351f6 Mon Sep 17 00:00:00 2001 From: Justin Edmund Date: Mon, 5 Dec 2022 17:51:56 -0800 Subject: [PATCH] =?UTF-8?q?white=20=E2=86=92=20$grey-100?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/AccountModal/index.scss | 4 ++-- components/Alert/index.scss | 2 +- components/Button/index.scss | 8 ++++---- components/CharLimitedFieldset/index.scss | 2 +- components/ElementToggle/index.scss | 2 +- components/Fieldset/index.scss | 2 +- components/Header/index.scss | 2 +- components/HeaderMenu/index.scss | 12 ++++++------ components/SearchFilter/index.scss | 4 ++-- components/WeaponUnit/index.scss | 2 +- styles/globals.scss | 4 ++-- styles/themes.scss | 4 ++-- styles/variables.scss | 3 ++- 13 files changed, 26 insertions(+), 25 deletions(-) diff --git a/components/AccountModal/index.scss b/components/AccountModal/index.scss index 4cce8aad..ed8a60ed 100644 --- a/components/AccountModal/index.scss +++ b/components/AccountModal/index.scss @@ -28,7 +28,7 @@ } .Thumb { - background: white; + background: $grey-100; border-radius: 13px; display: block; height: 26px; @@ -41,7 +41,7 @@ } &[data-state="checked"] { - background: white; + background: $grey-100; transform: translateX(21px); } } diff --git a/components/Alert/index.scss b/components/Alert/index.scss index fe2e0df9..f6ef01e7 100644 --- a/components/Alert/index.scss +++ b/components/Alert/index.scss @@ -11,7 +11,7 @@ } .Alert { - background: white; + background: $grey-100; border-radius: $unit; display: flex; flex-direction: column; diff --git a/components/Button/index.scss b/components/Button/index.scss index 275d92ee..7d88cca7 100644 --- a/components/Button/index.scss +++ b/components/Button/index.scss @@ -11,7 +11,7 @@ padding: 8px 12px; &:hover { - background: white; + background: $grey-100; cursor: pointer; color: $grey-10; @@ -27,10 +27,10 @@ &.destructive:hover { background: $error; - color: white; + color: $grey-100; .icon svg { - fill: white; + fill: $grey-100; } } @@ -100,7 +100,7 @@ } &.Active { - background: white; + background: $grey-100; } &.btn-blue { diff --git a/components/CharLimitedFieldset/index.scss b/components/CharLimitedFieldset/index.scss index c23c84df..75558d8d 100644 --- a/components/CharLimitedFieldset/index.scss +++ b/components/CharLimitedFieldset/index.scss @@ -1,5 +1,5 @@ .Limited { - background: white; + background: $grey-100; border-radius: 6px; border: 2px solid transparent; box-sizing: border-box; diff --git a/components/ElementToggle/index.scss b/components/ElementToggle/index.scss index 9821af32..87e3d720 100644 --- a/components/ElementToggle/index.scss +++ b/components/ElementToggle/index.scss @@ -9,7 +9,7 @@ padding: calc($unit / 2); .ToggleItem { - background: white; + background: $grey-100; border: none; border-radius: 18px; color: $grey-40; diff --git a/components/Fieldset/index.scss b/components/Fieldset/index.scss index cd406b51..0f641ca8 100644 --- a/components/Fieldset/index.scss +++ b/components/Fieldset/index.scss @@ -9,7 +9,7 @@ -webkit-font-smoothing: antialiased; border: none; - background-color: white; + background-color: $grey-100; border-radius: 6px; box-sizing: border-box; color: $grey-10; diff --git a/components/Header/index.scss b/components/Header/index.scss index d3c1eeff..7d72517b 100644 --- a/components/Header/index.scss +++ b/components/Header/index.scss @@ -22,7 +22,7 @@ padding-bottom: 16px; .Button { - background: white; + background: $grey-100; } .Menu { diff --git a/components/HeaderMenu/index.scss b/components/HeaderMenu/index.scss index ddc50595..d961f2a9 100644 --- a/components/HeaderMenu/index.scss +++ b/components/HeaderMenu/index.scss @@ -1,5 +1,5 @@ .Menu { - background: white; + background: $grey-100; border-radius: 6px; display: none; min-width: 220px; @@ -13,7 +13,7 @@ font-weight: $normal; &:hover:not(.disabled) { - background: $grey-100; + background: $grey-95; color: $grey-10; cursor: pointer; @@ -54,7 +54,7 @@ .Thumb { $diameter: 18px; - background: white; + background: $grey-100; border-radius: calc($diameter / 2); display: block; height: $diameter; @@ -68,14 +68,14 @@ } &[data-state="checked"] { - background: white; + background: $grey-100; transform: translateX(17px); } } .left, .right { - color: white; + color: $grey-100; font-size: 10px; font-weight: $bold; position: absolute; @@ -113,7 +113,7 @@ &:hover { i.tag { background: $grey-60; - color: white; + color: $grey-100; } } diff --git a/components/SearchFilter/index.scss b/components/SearchFilter/index.scss index 0eee7ef7..ac71b595 100644 --- a/components/SearchFilter/index.scss +++ b/components/SearchFilter/index.scss @@ -36,7 +36,7 @@ } .Dropdown { - background: white; + background: $grey-100; border-radius: $unit; box-shadow: 0 0 2px rgba(0, 0, 0, 0.18); display: flex; @@ -49,7 +49,7 @@ overflow: hidden; svg { - fill: white; + fill: $grey-100; filter: drop-shadow(0px 0px 1px rgb(0 0 0 / 0.18)); } } diff --git a/components/WeaponUnit/index.scss b/components/WeaponUnit/index.scss index 357d386d..2b6ecc5e 100644 --- a/components/WeaponUnit/index.scss +++ b/components/WeaponUnit/index.scss @@ -72,7 +72,7 @@ } .Button { - background: white; + background: $grey-100; box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.14); display: none; position: absolute; diff --git a/styles/globals.scss b/styles/globals.scss index d0151f2c..78466219 100644 --- a/styles/globals.scss +++ b/styles/globals.scss @@ -127,7 +127,7 @@ select { animation: 0.5s cubic-bezier(0.16, 1, 0.3, 1) 0s 1 normal none running openModal; - background: white; + background: $grey-100; border-radius: $unit; display: flex; flex-direction: column; @@ -212,7 +212,7 @@ select { .Hovercard { background: #222; border-radius: $unit; - color: white; + color: $grey-100; display: flex; flex-direction: column; gap: $unit * 2; diff --git a/styles/themes.scss b/styles/themes.scss index f16c50bc..fe319f2c 100644 --- a/styles/themes.scss +++ b/styles/themes.scss @@ -4,8 +4,8 @@ --grid-rep-hover: #{$grid--rep--hover--light}; - --card-bg: white; - --bar-bg: white; + --card-bg: #{$grey-100}; + --bar-bg: #{$grey-100}; --input-bg: #{$input--bg--light}; --input-bg-hover: #{$input--bg--light--hover}; diff --git a/styles/variables.scss b/styles/variables.scss index b25e5bb1..b9660834 100644 --- a/styles/variables.scss +++ b/styles/variables.scss @@ -23,7 +23,8 @@ $grey-60: #a9a9a9; $grey-70: #c6c6c6; $grey-80: #e9e9e9; $grey-90: #f5f5f5; -$grey-100: #fafafa; +$grey-95: #fafafa; +$grey-100: white; $page--bg--light: $grey-90; $page--bg--dark: $grey-10;