From bbc07c2e85580ac648f352d9157812bdaabb780d Mon Sep 17 00:00:00 2001 From: Mutasem Date: Mon, 16 Aug 2021 12:08:06 +0200 Subject: [PATCH] add shade color --- packages/design-system/theme/src/_tokens.scss | 12 ++++++++---- packages/design-system/theme/src/common/var.scss | 4 ++-- 2 files changed, 10 insertions(+), 6 deletions(-) diff --git a/packages/design-system/theme/src/_tokens.scss b/packages/design-system/theme/src/_tokens.scss index 82ab1732f6..bb864746f0 100644 --- a/packages/design-system/theme/src/_tokens.scss +++ b/packages/design-system/theme/src/_tokens.scss @@ -29,13 +29,20 @@ var(--color-primary-tint-3-l) ); - --color-primary-shade-1-l: 23%; + --color-primary-shade-1-l: 57.6%; --color-primary-shade-1: hsl( var(--color-primary-h), var(--color-primary-s), var(--color-primary-shade-1-l) ); + --color-primary-shade-2-l: 23%; + --color-primary-shade-2: hsl( + var(--color-primary-h), + var(--color-primary-s), + var(--color-primary-shade-2-l) + ); + --color-secondary-h: 247.4; --color-secondary-s: 100%; --color-secondary-l: 65.1%; @@ -294,9 +301,6 @@ --spacing-3xl: 4rem; --spacing-4xl: 8rem; --spacing-5xl: 16rem; - - --button-radius-default: 20px; - --button-shade-active: 10%; } :root { diff --git a/packages/design-system/theme/src/common/var.scss b/packages/design-system/theme/src/common/var.scss index 17c5c34b14..30b3b4cd7b 100644 --- a/packages/design-system/theme/src/common/var.scss +++ b/packages/design-system/theme/src/common/var.scss @@ -668,10 +668,10 @@ $button-mini-padding-horizontal: 15px; $button-font-color: var(--button-color, var(--color-text-xlight)); $button-background-color: var(--button-background-color, var(--color-primary)); $button-active-color: var(--button-active-color, var(--color-text-xlight)); -$button-active-border-color: var(--button-active-border-color, $color-primary-shade-1); +$button-active-border-color: var(--button-active-border-color, var(--color-primary-shade-1)); $button-active-background-color: var( --button-active-background-color, - $color-primary-shade-1 + var(--color-primary-shade-1) ); /// color||Color|0