From ff61ac002f91e27a472171adeb9875bdabdcd017 Mon Sep 17 00:00:00 2001 From: Lindsay M <126139086+lindsaym-fa@users.noreply.github.com> Date: Tue, 10 Jun 2025 15:44:33 -0400 Subject: [PATCH] Remove clamped color tokens (#1050) --- .../docs/docs/experimental/clamped-colors.njk | 44 -- packages/webawesome/src/styles/brand/blue.css | 17 - packages/webawesome/src/styles/brand/cyan.css | 17 - packages/webawesome/src/styles/brand/gray.css | 17 - .../webawesome/src/styles/brand/green.css | 17 - .../webawesome/src/styles/brand/indigo.css | 17 - .../webawesome/src/styles/brand/orange.css | 17 - packages/webawesome/src/styles/brand/pink.css | 17 - .../webawesome/src/styles/brand/purple.css | 17 - packages/webawesome/src/styles/brand/red.css | 17 - .../webawesome/src/styles/brand/yellow.css | 17 - packages/webawesome/src/styles/color/base.css | 384 +----------------- .../webawesome/src/styles/danger/blue.css | 17 - .../webawesome/src/styles/danger/cyan.css | 17 - .../webawesome/src/styles/danger/gray.css | 17 - .../webawesome/src/styles/danger/green.css | 17 - .../webawesome/src/styles/danger/indigo.css | 17 - .../webawesome/src/styles/danger/orange.css | 17 - .../webawesome/src/styles/danger/pink.css | 17 - .../webawesome/src/styles/danger/purple.css | 17 - packages/webawesome/src/styles/danger/red.css | 17 - .../webawesome/src/styles/danger/yellow.css | 17 - .../webawesome/src/styles/neutral/blue.css | 17 - .../webawesome/src/styles/neutral/cyan.css | 17 - .../webawesome/src/styles/neutral/gray.css | 17 - .../webawesome/src/styles/neutral/green.css | 17 - .../webawesome/src/styles/neutral/indigo.css | 17 - .../webawesome/src/styles/neutral/orange.css | 17 - .../webawesome/src/styles/neutral/pink.css | 17 - .../webawesome/src/styles/neutral/purple.css | 17 - .../webawesome/src/styles/neutral/red.css | 17 - .../webawesome/src/styles/neutral/yellow.css | 17 - .../webawesome/src/styles/success/blue.css | 17 - .../webawesome/src/styles/success/cyan.css | 17 - .../webawesome/src/styles/success/gray.css | 17 - .../webawesome/src/styles/success/green.css | 17 - .../webawesome/src/styles/success/indigo.css | 17 - .../webawesome/src/styles/success/orange.css | 17 - .../webawesome/src/styles/success/pink.css | 17 - .../webawesome/src/styles/success/purple.css | 17 - .../webawesome/src/styles/success/red.css | 17 - .../webawesome/src/styles/success/yellow.css | 17 - .../src/styles/themes/active/color.css | 40 +- .../src/styles/themes/awesome/color.css | 16 +- .../src/styles/themes/brutalist/color.css | 24 +- .../src/styles/themes/default/color.css | 16 +- .../src/styles/themes/glossy/color.css | 21 + .../src/styles/themes/playful/color.css | 8 +- .../src/styles/themes/premium/color.css | 16 +- .../src/styles/themes/tailspin/color.css | 16 +- .../webawesome/src/styles/warning/blue.css | 17 - .../webawesome/src/styles/warning/cyan.css | 17 - .../webawesome/src/styles/warning/gray.css | 17 - .../webawesome/src/styles/warning/green.css | 17 - .../webawesome/src/styles/warning/indigo.css | 17 - .../webawesome/src/styles/warning/orange.css | 17 - .../webawesome/src/styles/warning/pink.css | 17 - .../webawesome/src/styles/warning/purple.css | 17 - .../webawesome/src/styles/warning/red.css | 17 - .../webawesome/src/styles/warning/yellow.css | 17 - 60 files changed, 109 insertions(+), 1326 deletions(-) delete mode 100644 packages/webawesome/docs/docs/experimental/clamped-colors.njk diff --git a/packages/webawesome/docs/docs/experimental/clamped-colors.njk b/packages/webawesome/docs/docs/experimental/clamped-colors.njk deleted file mode 100644 index 27797832d..000000000 --- a/packages/webawesome/docs/docs/experimental/clamped-colors.njk +++ /dev/null @@ -1,44 +0,0 @@ ---- -title: Clamped Color Tokens -layout: block ---- - -{% set tints = ['max-50', 'max-60', 'max-70', 'min-50', 'min-60', 'min-70'] %} -{% set hues = ['red', 'orange', 'yellow', 'green', 'cyan', 'blue', 'indigo', 'purple', 'pink', 'gray'] %} - - - - - - - {% for tint in tints -%} - - {%- endfor %} - - -{% for hue in hues -%} - - - - {% for tint in tints -%} - - {%- endfor -%} - -{%- endfor %} -
Core tint{{ tint }}
- - \ No newline at end of file diff --git a/packages/webawesome/src/styles/brand/blue.css b/packages/webawesome/src/styles/brand/blue.css index a0cff0c35..dafa8a221 100644 --- a/packages/webawesome/src/styles/brand/blue.css +++ b/packages/webawesome/src/styles/brand/blue.css @@ -16,23 +16,6 @@ --wa-color-brand-10: var(--wa-color-blue-10); --wa-color-brand-05: var(--wa-color-blue-05); --wa-color-brand: var(--wa-color-blue); - - --wa-color-brand-lt-50: var(--wa-color-blue-lt-50); - --wa-color-brand-gte-50: var(--wa-color-blue-gte-50); - - --wa-color-brand-lt-60: var(--wa-color-blue-lt-60); - --wa-color-brand-gte-60: var(--wa-color-blue-gte-60); - - --wa-color-brand-lt-70: var(--wa-color-blue-lt-70); - --wa-color-brand-gte-70: var(--wa-color-blue-gte-70); - - --wa-color-brand-max-50: var(--wa-color-blue-max-50); - --wa-color-brand-min-50: var(--wa-color-blue-min-50); - --wa-color-brand-max-60: var(--wa-color-blue-max-60); - --wa-color-brand-min-60: var(--wa-color-blue-min-60); - --wa-color-brand-max-70: var(--wa-color-blue-max-70); - --wa-color-brand-min-70: var(--wa-color-blue-min-70); - --wa-color-brand-on: var(--wa-color-blue-on); } } diff --git a/packages/webawesome/src/styles/brand/cyan.css b/packages/webawesome/src/styles/brand/cyan.css index f0d50db3c..4e5b1c5c1 100644 --- a/packages/webawesome/src/styles/brand/cyan.css +++ b/packages/webawesome/src/styles/brand/cyan.css @@ -16,23 +16,6 @@ --wa-color-brand-10: var(--wa-color-cyan-10); --wa-color-brand-05: var(--wa-color-cyan-05); --wa-color-brand: var(--wa-color-cyan); - - --wa-color-brand-lt-50: var(--wa-color-cyan-lt-50); - --wa-color-brand-gte-50: var(--wa-color-cyan-gte-50); - - --wa-color-brand-lt-60: var(--wa-color-cyan-lt-60); - --wa-color-brand-gte-60: var(--wa-color-cyan-gte-60); - - --wa-color-brand-lt-70: var(--wa-color-cyan-lt-70); - --wa-color-brand-gte-70: var(--wa-color-cyan-gte-70); - - --wa-color-brand-max-50: var(--wa-color-cyan-max-50); - --wa-color-brand-min-50: var(--wa-color-cyan-min-50); - --wa-color-brand-max-60: var(--wa-color-cyan-max-60); - --wa-color-brand-min-60: var(--wa-color-cyan-min-60); - --wa-color-brand-max-70: var(--wa-color-cyan-max-70); - --wa-color-brand-min-70: var(--wa-color-cyan-min-70); - --wa-color-brand-on: var(--wa-color-cyan-on); } } diff --git a/packages/webawesome/src/styles/brand/gray.css b/packages/webawesome/src/styles/brand/gray.css index cdfe3c5e2..60e16bf41 100644 --- a/packages/webawesome/src/styles/brand/gray.css +++ b/packages/webawesome/src/styles/brand/gray.css @@ -16,23 +16,6 @@ --wa-color-brand-10: var(--wa-color-gray-10); --wa-color-brand-05: var(--wa-color-gray-05); --wa-color-brand: var(--wa-color-gray); - - --wa-color-brand-lt-50: var(--wa-color-gray-lt-50); - --wa-color-brand-gte-50: var(--wa-color-gray-gte-50); - - --wa-color-brand-lt-60: var(--wa-color-gray-lt-60); - --wa-color-brand-gte-60: var(--wa-color-gray-gte-60); - - --wa-color-brand-lt-70: var(--wa-color-gray-lt-70); - --wa-color-brand-gte-70: var(--wa-color-gray-gte-70); - - --wa-color-brand-max-50: var(--wa-color-gray-max-50); - --wa-color-brand-min-50: var(--wa-color-gray-min-50); - --wa-color-brand-max-60: var(--wa-color-gray-max-60); - --wa-color-brand-min-60: var(--wa-color-gray-min-60); - --wa-color-brand-max-70: var(--wa-color-gray-max-70); - --wa-color-brand-min-70: var(--wa-color-gray-min-70); - --wa-color-brand-on: var(--wa-color-gray-on); } } diff --git a/packages/webawesome/src/styles/brand/green.css b/packages/webawesome/src/styles/brand/green.css index fff2b7847..22793e4a7 100644 --- a/packages/webawesome/src/styles/brand/green.css +++ b/packages/webawesome/src/styles/brand/green.css @@ -16,23 +16,6 @@ --wa-color-brand-10: var(--wa-color-green-10); --wa-color-brand-05: var(--wa-color-green-05); --wa-color-brand: var(--wa-color-green); - - --wa-color-brand-lt-50: var(--wa-color-green-lt-50); - --wa-color-brand-gte-50: var(--wa-color-green-gte-50); - - --wa-color-brand-lt-60: var(--wa-color-green-lt-60); - --wa-color-brand-gte-60: var(--wa-color-green-gte-60); - - --wa-color-brand-lt-70: var(--wa-color-green-lt-70); - --wa-color-brand-gte-70: var(--wa-color-green-gte-70); - - --wa-color-brand-max-50: var(--wa-color-green-max-50); - --wa-color-brand-min-50: var(--wa-color-green-min-50); - --wa-color-brand-max-60: var(--wa-color-green-max-60); - --wa-color-brand-min-60: var(--wa-color-green-min-60); - --wa-color-brand-max-70: var(--wa-color-green-max-70); - --wa-color-brand-min-70: var(--wa-color-green-min-70); - --wa-color-brand-on: var(--wa-color-green-on); } } diff --git a/packages/webawesome/src/styles/brand/indigo.css b/packages/webawesome/src/styles/brand/indigo.css index 60a77375c..96d4e8754 100644 --- a/packages/webawesome/src/styles/brand/indigo.css +++ b/packages/webawesome/src/styles/brand/indigo.css @@ -16,23 +16,6 @@ --wa-color-brand-10: var(--wa-color-indigo-10); --wa-color-brand-05: var(--wa-color-indigo-05); --wa-color-brand: var(--wa-color-indigo); - - --wa-color-brand-lt-50: var(--wa-color-indigo-lt-50); - --wa-color-brand-gte-50: var(--wa-color-indigo-gte-50); - - --wa-color-brand-lt-60: var(--wa-color-indigo-lt-60); - --wa-color-brand-gte-60: var(--wa-color-indigo-gte-60); - - --wa-color-brand-lt-70: var(--wa-color-indigo-lt-70); - --wa-color-brand-gte-70: var(--wa-color-indigo-gte-70); - - --wa-color-brand-max-50: var(--wa-color-indigo-max-50); - --wa-color-brand-min-50: var(--wa-color-indigo-min-50); - --wa-color-brand-max-60: var(--wa-color-indigo-max-60); - --wa-color-brand-min-60: var(--wa-color-indigo-min-60); - --wa-color-brand-max-70: var(--wa-color-indigo-max-70); - --wa-color-brand-min-70: var(--wa-color-indigo-min-70); - --wa-color-brand-on: var(--wa-color-indigo-on); } } diff --git a/packages/webawesome/src/styles/brand/orange.css b/packages/webawesome/src/styles/brand/orange.css index 472f32278..af34cd714 100644 --- a/packages/webawesome/src/styles/brand/orange.css +++ b/packages/webawesome/src/styles/brand/orange.css @@ -16,23 +16,6 @@ --wa-color-brand-10: var(--wa-color-orange-10); --wa-color-brand-05: var(--wa-color-orange-05); --wa-color-brand: var(--wa-color-orange); - - --wa-color-brand-lt-50: var(--wa-color-orange-lt-50); - --wa-color-brand-gte-50: var(--wa-color-orange-gte-50); - - --wa-color-brand-lt-60: var(--wa-color-orange-lt-60); - --wa-color-brand-gte-60: var(--wa-color-orange-gte-60); - - --wa-color-brand-lt-70: var(--wa-color-orange-lt-70); - --wa-color-brand-gte-70: var(--wa-color-orange-gte-70); - - --wa-color-brand-max-50: var(--wa-color-orange-max-50); - --wa-color-brand-min-50: var(--wa-color-orange-min-50); - --wa-color-brand-max-60: var(--wa-color-orange-max-60); - --wa-color-brand-min-60: var(--wa-color-orange-min-60); - --wa-color-brand-max-70: var(--wa-color-orange-max-70); - --wa-color-brand-min-70: var(--wa-color-orange-min-70); - --wa-color-brand-on: var(--wa-color-orange-on); } } diff --git a/packages/webawesome/src/styles/brand/pink.css b/packages/webawesome/src/styles/brand/pink.css index 4eb01e348..b29594849 100644 --- a/packages/webawesome/src/styles/brand/pink.css +++ b/packages/webawesome/src/styles/brand/pink.css @@ -16,23 +16,6 @@ --wa-color-brand-10: var(--wa-color-pink-10); --wa-color-brand-05: var(--wa-color-pink-05); --wa-color-brand: var(--wa-color-pink); - - --wa-color-brand-lt-50: var(--wa-color-pink-lt-50); - --wa-color-brand-gte-50: var(--wa-color-pink-gte-50); - - --wa-color-brand-lt-60: var(--wa-color-pink-lt-60); - --wa-color-brand-gte-60: var(--wa-color-pink-gte-60); - - --wa-color-brand-lt-70: var(--wa-color-pink-lt-70); - --wa-color-brand-gte-70: var(--wa-color-pink-gte-70); - - --wa-color-brand-max-50: var(--wa-color-pink-max-50); - --wa-color-brand-min-50: var(--wa-color-pink-min-50); - --wa-color-brand-max-60: var(--wa-color-pink-max-60); - --wa-color-brand-min-60: var(--wa-color-pink-min-60); - --wa-color-brand-max-70: var(--wa-color-pink-max-70); - --wa-color-brand-min-70: var(--wa-color-pink-min-70); - --wa-color-brand-on: var(--wa-color-pink-on); } } diff --git a/packages/webawesome/src/styles/brand/purple.css b/packages/webawesome/src/styles/brand/purple.css index d1ce844e5..b9b22c19d 100644 --- a/packages/webawesome/src/styles/brand/purple.css +++ b/packages/webawesome/src/styles/brand/purple.css @@ -16,23 +16,6 @@ --wa-color-brand-10: var(--wa-color-purple-10); --wa-color-brand-05: var(--wa-color-purple-05); --wa-color-brand: var(--wa-color-purple); - - --wa-color-brand-lt-50: var(--wa-color-purple-lt-50); - --wa-color-brand-gte-50: var(--wa-color-purple-gte-50); - - --wa-color-brand-lt-60: var(--wa-color-purple-lt-60); - --wa-color-brand-gte-60: var(--wa-color-purple-gte-60); - - --wa-color-brand-lt-70: var(--wa-color-purple-lt-70); - --wa-color-brand-gte-70: var(--wa-color-purple-gte-70); - - --wa-color-brand-max-50: var(--wa-color-purple-max-50); - --wa-color-brand-min-50: var(--wa-color-purple-min-50); - --wa-color-brand-max-60: var(--wa-color-purple-max-60); - --wa-color-brand-min-60: var(--wa-color-purple-min-60); - --wa-color-brand-max-70: var(--wa-color-purple-max-70); - --wa-color-brand-min-70: var(--wa-color-purple-min-70); - --wa-color-brand-on: var(--wa-color-purple-on); } } diff --git a/packages/webawesome/src/styles/brand/red.css b/packages/webawesome/src/styles/brand/red.css index 143dff968..0b1f15dfd 100644 --- a/packages/webawesome/src/styles/brand/red.css +++ b/packages/webawesome/src/styles/brand/red.css @@ -16,23 +16,6 @@ --wa-color-brand-10: var(--wa-color-red-10); --wa-color-brand-05: var(--wa-color-red-05); --wa-color-brand: var(--wa-color-red); - - --wa-color-brand-lt-50: var(--wa-color-red-lt-50); - --wa-color-brand-gte-50: var(--wa-color-red-gte-50); - - --wa-color-brand-lt-60: var(--wa-color-red-lt-60); - --wa-color-brand-gte-60: var(--wa-color-red-gte-60); - - --wa-color-brand-lt-70: var(--wa-color-red-lt-70); - --wa-color-brand-gte-70: var(--wa-color-red-gte-70); - - --wa-color-brand-max-50: var(--wa-color-red-max-50); - --wa-color-brand-min-50: var(--wa-color-red-min-50); - --wa-color-brand-max-60: var(--wa-color-red-max-60); - --wa-color-brand-min-60: var(--wa-color-red-min-60); - --wa-color-brand-max-70: var(--wa-color-red-max-70); - --wa-color-brand-min-70: var(--wa-color-red-min-70); - --wa-color-brand-on: var(--wa-color-red-on); } } diff --git a/packages/webawesome/src/styles/brand/yellow.css b/packages/webawesome/src/styles/brand/yellow.css index 97d15c864..de0ac569d 100644 --- a/packages/webawesome/src/styles/brand/yellow.css +++ b/packages/webawesome/src/styles/brand/yellow.css @@ -16,23 +16,6 @@ --wa-color-brand-10: var(--wa-color-yellow-10); --wa-color-brand-05: var(--wa-color-yellow-05); --wa-color-brand: var(--wa-color-yellow); - - --wa-color-brand-lt-50: var(--wa-color-yellow-lt-50); - --wa-color-brand-gte-50: var(--wa-color-yellow-gte-50); - - --wa-color-brand-lt-60: var(--wa-color-yellow-lt-60); - --wa-color-brand-gte-60: var(--wa-color-yellow-gte-60); - - --wa-color-brand-lt-70: var(--wa-color-yellow-lt-70); - --wa-color-brand-gte-70: var(--wa-color-yellow-gte-70); - - --wa-color-brand-max-50: var(--wa-color-yellow-max-50); - --wa-color-brand-min-50: var(--wa-color-yellow-min-50); - --wa-color-brand-max-60: var(--wa-color-yellow-max-60); - --wa-color-brand-min-60: var(--wa-color-yellow-min-60); - --wa-color-brand-max-70: var(--wa-color-yellow-max-70); - --wa-color-brand-min-70: var(--wa-color-yellow-min-70); - --wa-color-brand-on: var(--wa-color-yellow-on); } } diff --git a/packages/webawesome/src/styles/color/base.css b/packages/webawesome/src/styles/color/base.css index 3b305cdf0..03a8a87d7 100644 --- a/packages/webawesome/src/styles/color/base.css +++ b/packages/webawesome/src/styles/color/base.css @@ -5,375 +5,31 @@ :where(:root), :host { /** - * Conditional tokens for use in color-mix() - * --wa-color-{hue}-lt-N ➡️ 100% if key < N, 0% otherwise - * --wa-color-{hue}-gte-N ➡️ 100% if key >= N, 0% otherwise + * Conditional tokens to check if the key color is >= 60 + * Key colors are the most colorful tint in a scale, recorded as --wa-color-{hue} in each palette + * The numeric value of the key is isolated as --wa-color-{hue}-key + * If key < 60, the result is 0% + * If key >= 60, the result is 100% + * Intended to be used in the color-mix() functions below */ - --wa-color-red-lt-50: calc(clamp(0, 50 - var(--wa-color-red-key), 1) * 100%); - --wa-color-red-gte-50: calc(100% - var(--wa-color-red-lt-50)); - --wa-color-red-lt-60: calc(clamp(0, 60 - var(--wa-color-red-key), 1) * 100%); - --wa-color-red-gte-60: calc(100% - var(--wa-color-red-lt-60)); - --wa-color-red-lt-70: calc(clamp(0, 70 - var(--wa-color-red-key), 1) * 100%); - --wa-color-red-gte-70: calc(100% - var(--wa-color-red-lt-70)); + --wa-color-red-gte-60: calc(100% - (clamp(0, 60 - var(--wa-color-red-key), 1) * 100%)); + --wa-color-orange-gte-60: calc(100% - (clamp(0, 60 - var(--wa-color-orange-key), 1) * 100%)); + --wa-color-yellow-gte-60: calc(100% - (clamp(0, 60 - var(--wa-color-yellow-key), 1) * 100%)); + --wa-color-green-gte-60: calc(100% - (clamp(0, 60 - var(--wa-color-green-key), 1) * 100%)); + --wa-color-cyan-gte-60: calc(100% - (clamp(0, 60 - var(--wa-color-cyan-key), 1) * 100%)); + --wa-color-blue-gte-60: calc(100% - (clamp(0, 60 - var(--wa-color-blue-key), 1) * 100%)); + --wa-color-indigo-gte-60: calc(100% - (clamp(0, 60 - var(--wa-color-indigo-key), 1) * 100%)); + --wa-color-purple-gte-60: calc(100% - (clamp(0, 60 - var(--wa-color-purple-key), 1) * 100%)); + --wa-color-pink-gte-60: calc(100% - (clamp(0, 60 - var(--wa-color-pink-key), 1) * 100%)); + --wa-color-gray-gte-60: calc(100% - (clamp(0, 60 - var(--wa-color-gray-key), 1) * 100%)); - --wa-color-orange-lt-50: calc(clamp(0, 50 - var(--wa-color-orange-key), 1) * 100%); - --wa-color-orange-gte-50: calc(100% - var(--wa-color-orange-lt-50)); - --wa-color-orange-lt-60: calc(clamp(0, 60 - var(--wa-color-orange-key), 1) * 100%); - --wa-color-orange-gte-60: calc(100% - var(--wa-color-orange-lt-60)); - --wa-color-orange-lt-70: calc(clamp(0, 70 - var(--wa-color-orange-key), 1) * 100%); - --wa-color-orange-gte-70: calc(100% - var(--wa-color-orange-lt-70)); - - --wa-color-yellow-lt-50: calc(clamp(0, 50 - var(--wa-color-yellow-key), 1) * 100%); - --wa-color-yellow-gte-50: calc(100% - var(--wa-color-yellow-lt-50)); - --wa-color-yellow-lt-60: calc(clamp(0, 60 - var(--wa-color-yellow-key), 1) * 100%); - --wa-color-yellow-gte-60: calc(100% - var(--wa-color-yellow-lt-60)); - --wa-color-yellow-lt-70: calc(clamp(0, 70 - var(--wa-color-yellow-key), 1) * 100%); - --wa-color-yellow-gte-70: calc(100% - var(--wa-color-yellow-lt-70)); - - --wa-color-green-lt-50: calc(clamp(0, 50 - var(--wa-color-green-key), 1) * 100%); - --wa-color-green-gte-50: calc(100% - var(--wa-color-green-lt-50)); - --wa-color-green-lt-60: calc(clamp(0, 60 - var(--wa-color-green-key), 1) * 100%); - --wa-color-green-gte-60: calc(100% - var(--wa-color-green-lt-60)); - --wa-color-green-lt-70: calc(clamp(0, 70 - var(--wa-color-green-key), 1) * 100%); - --wa-color-green-gte-70: calc(100% - var(--wa-color-green-lt-70)); - - --wa-color-cyan-lt-50: calc(clamp(0, 50 - var(--wa-color-cyan-key), 1) * 100%); - --wa-color-cyan-gte-50: calc(100% - var(--wa-color-cyan-lt-50)); - --wa-color-cyan-lt-60: calc(clamp(0, 60 - var(--wa-color-cyan-key), 1) * 100%); - --wa-color-cyan-gte-60: calc(100% - var(--wa-color-cyan-lt-60)); - --wa-color-cyan-lt-70: calc(clamp(0, 70 - var(--wa-color-cyan-key), 1) * 100%); - --wa-color-cyan-gte-70: calc(100% - var(--wa-color-cyan-lt-70)); - - --wa-color-blue-lt-50: calc(clamp(0, 50 - var(--wa-color-blue-key), 1) * 100%); - --wa-color-blue-gte-50: calc(100% - var(--wa-color-blue-lt-50)); - --wa-color-blue-lt-60: calc(clamp(0, 60 - var(--wa-color-blue-key), 1) * 100%); - --wa-color-blue-gte-60: calc(100% - var(--wa-color-blue-lt-60)); - --wa-color-blue-lt-70: calc(clamp(0, 70 - var(--wa-color-blue-key), 1) * 100%); - --wa-color-blue-gte-70: calc(100% - var(--wa-color-blue-lt-70)); - - --wa-color-indigo-lt-50: calc(clamp(0, 50 - var(--wa-color-indigo-key), 1) * 100%); - --wa-color-indigo-gte-50: calc(100% - var(--wa-color-indigo-lt-50)); - --wa-color-indigo-lt-60: calc(clamp(0, 60 - var(--wa-color-indigo-key), 1) * 100%); - --wa-color-indigo-gte-60: calc(100% - var(--wa-color-indigo-lt-60)); - --wa-color-indigo-lt-70: calc(clamp(0, 70 - var(--wa-color-indigo-key), 1) * 100%); - --wa-color-indigo-gte-70: calc(100% - var(--wa-color-indigo-lt-70)); - - --wa-color-purple-lt-50: calc(clamp(0, 50 - var(--wa-color-purple-key), 1) * 100%); - --wa-color-purple-gte-50: calc(100% - var(--wa-color-purple-lt-50)); - --wa-color-purple-lt-60: calc(clamp(0, 60 - var(--wa-color-purple-key), 1) * 100%); - --wa-color-purple-gte-60: calc(100% - var(--wa-color-purple-lt-60)); - --wa-color-purple-lt-70: calc(clamp(0, 70 - var(--wa-color-purple-key), 1) * 100%); - --wa-color-purple-gte-70: calc(100% - var(--wa-color-purple-lt-70)); - - --wa-color-pink-lt-50: calc(clamp(0, 50 - var(--wa-color-pink-key), 1) * 100%); - --wa-color-pink-gte-50: calc(100% - var(--wa-color-pink-lt-50)); - --wa-color-pink-lt-60: calc(clamp(0, 60 - var(--wa-color-pink-key), 1) * 100%); - --wa-color-pink-gte-60: calc(100% - var(--wa-color-pink-lt-60)); - --wa-color-pink-lt-70: calc(clamp(0, 70 - var(--wa-color-pink-key), 1) * 100%); - --wa-color-pink-gte-70: calc(100% - var(--wa-color-pink-lt-70)); - - --wa-color-gray-lt-50: calc(clamp(0, 50 - var(--wa-color-gray-key), 1) * 100%); - --wa-color-gray-gte-50: calc(100% - var(--wa-color-gray-lt-50)); - --wa-color-gray-lt-60: calc(clamp(0, 60 - var(--wa-color-gray-key), 1) * 100%); - --wa-color-gray-gte-60: calc(100% - var(--wa-color-gray-lt-60)); - --wa-color-gray-lt-70: calc(clamp(0, 70 - var(--wa-color-gray-key), 1) * 100%); - --wa-color-gray-gte-70: calc(100% - var(--wa-color-gray-lt-70)); - - /* - * Convenience tokens for common tint cutoffs - * --wa-color-{hue}-N-max ➡️ var(--color-{hue}) if key <= N, var(--color-{hue}-N) otherwise - * --wa-color-{hue}-N-min ➡️ var(--color-{hue}) if key >= N, var(--color-{hue}-N) otherwise + /** + * Tokens to set text color with appropriate WCAG 2.1 contrast + * If key < 60, the text color is white + * If key >= 60, the text color is {hue}-10 */ - --wa-color-red-max-50: color-mix(in oklab, var(--wa-color-red) var(--wa-color-red-lt-50), var(--wa-color-red-50)); - --wa-color-red-min-50: color-mix(in oklab, var(--wa-color-red) var(--wa-color-red-gte-50), var(--wa-color-red-50)); - --wa-color-red-max-60: color-mix(in oklab, var(--wa-color-red) var(--wa-color-red-lt-60), var(--wa-color-red-60)); - --wa-color-red-min-60: color-mix(in oklab, var(--wa-color-red) var(--wa-color-red-gte-60), var(--wa-color-red-60)); - --wa-color-red-max-70: color-mix(in oklab, var(--wa-color-red) var(--wa-color-red-lt-70), var(--wa-color-red-70)); - --wa-color-red-min-70: color-mix(in oklab, var(--wa-color-red) var(--wa-color-red-gte-70), var(--wa-color-red-70)); - - --wa-color-orange-max-50: color-mix( - in oklab, - var(--wa-color-orange) var(--wa-color-orange-lt-50), - var(--wa-color-orange-50) - ); - --wa-color-orange-min-50: color-mix( - in oklab, - var(--wa-color-orange) var(--wa-color-orange-gte-50), - var(--wa-color-orange-50) - ); - --wa-color-orange-max-60: color-mix( - in oklab, - var(--wa-color-orange) var(--wa-color-orange-lt-60), - var(--wa-color-orange-60) - ); - --wa-color-orange-min-60: color-mix( - in oklab, - var(--wa-color-orange) var(--wa-color-orange-gte-60), - var(--wa-color-orange-60) - ); - --wa-color-orange-max-70: color-mix( - in oklab, - var(--wa-color-orange) var(--wa-color-orange-lt-70), - var(--wa-color-orange-70) - ); - --wa-color-orange-min-70: color-mix( - in oklab, - var(--wa-color-orange) var(--wa-color-orange-gte-70), - var(--wa-color-orange-70) - ); - - --wa-color-yellow-max-50: color-mix( - in oklab, - var(--wa-color-yellow) var(--wa-color-yellow-lt-50), - var(--wa-color-yellow-50) - ); - --wa-color-yellow-min-50: color-mix( - in oklab, - var(--wa-color-yellow) var(--wa-color-yellow-gte-50), - var(--wa-color-yellow-50) - ); - --wa-color-yellow-max-60: color-mix( - in oklab, - var(--wa-color-yellow) var(--wa-color-yellow-lt-60), - var(--wa-color-yellow-60) - ); - --wa-color-yellow-min-60: color-mix( - in oklab, - var(--wa-color-yellow) var(--wa-color-yellow-gte-60), - var(--wa-color-yellow-60) - ); - --wa-color-yellow-max-70: color-mix( - in oklab, - var(--wa-color-yellow) var(--wa-color-yellow-lt-70), - var(--wa-color-yellow-70) - ); - --wa-color-yellow-min-70: color-mix( - in oklab, - var(--wa-color-yellow) var(--wa-color-yellow-gte-70), - var(--wa-color-yellow-70) - ); - - --wa-color-green-max-50: color-mix( - in oklab, - var(--wa-color-green) var(--wa-color-green-lt-50), - var(--wa-color-green-50) - ); - --wa-color-green-min-50: color-mix( - in oklab, - var(--wa-color-green) var(--wa-color-green-gte-50), - var(--wa-color-green-50) - ); - --wa-color-green-max-60: color-mix( - in oklab, - var(--wa-color-green) var(--wa-color-green-lt-60), - var(--wa-color-green-60) - ); - --wa-color-green-min-60: color-mix( - in oklab, - var(--wa-color-green) var(--wa-color-green-gte-60), - var(--wa-color-green-60) - ); - --wa-color-green-max-70: color-mix( - in oklab, - var(--wa-color-green) var(--wa-color-green-lt-70), - var(--wa-color-green-70) - ); - --wa-color-green-min-70: color-mix( - in oklab, - var(--wa-color-green) var(--wa-color-green-gte-70), - var(--wa-color-green-70) - ); - - --wa-color-cyan-max-50: color-mix( - in oklab, - var(--wa-color-cyan) var(--wa-color-cyan-lt-50), - var(--wa-color-cyan-50) - ); - --wa-color-cyan-min-50: color-mix( - in oklab, - var(--wa-color-cyan) var(--wa-color-cyan-gte-50), - var(--wa-color-cyan-50) - ); - --wa-color-cyan-max-60: color-mix( - in oklab, - var(--wa-color-cyan) var(--wa-color-cyan-lt-60), - var(--wa-color-cyan-60) - ); - --wa-color-cyan-min-60: color-mix( - in oklab, - var(--wa-color-cyan) var(--wa-color-cyan-gte-60), - var(--wa-color-cyan-60) - ); - --wa-color-cyan-max-70: color-mix( - in oklab, - var(--wa-color-cyan) var(--wa-color-cyan-lt-70), - var(--wa-color-cyan-70) - ); - --wa-color-cyan-min-70: color-mix( - in oklab, - var(--wa-color-cyan) var(--wa-color-cyan-gte-70), - var(--wa-color-cyan-70) - ); - - --wa-color-blue-max-50: color-mix( - in oklab, - var(--wa-color-blue) var(--wa-color-blue-lt-50), - var(--wa-color-blue-50) - ); - --wa-color-blue-min-50: color-mix( - in oklab, - var(--wa-color-blue) var(--wa-color-blue-gte-50), - var(--wa-color-blue-50) - ); - --wa-color-blue-max-60: color-mix( - in oklab, - var(--wa-color-blue) var(--wa-color-blue-lt-60), - var(--wa-color-blue-60) - ); - --wa-color-blue-min-60: color-mix( - in oklab, - var(--wa-color-blue) var(--wa-color-blue-gte-60), - var(--wa-color-blue-60) - ); - --wa-color-blue-max-70: color-mix( - in oklab, - var(--wa-color-blue) var(--wa-color-blue-lt-70), - var(--wa-color-blue-70) - ); - --wa-color-blue-min-70: color-mix( - in oklab, - var(--wa-color-blue) var(--wa-color-blue-gte-70), - var(--wa-color-blue-70) - ); - - --wa-color-indigo-max-50: color-mix( - in oklab, - var(--wa-color-indigo) var(--wa-color-indigo-lt-50), - var(--wa-color-indigo-50) - ); - --wa-color-indigo-min-50: color-mix( - in oklab, - var(--wa-color-indigo) var(--wa-color-indigo-gte-50), - var(--wa-color-indigo-50) - ); - --wa-color-indigo-max-60: color-mix( - in oklab, - var(--wa-color-indigo) var(--wa-color-indigo-lt-60), - var(--wa-color-indigo-60) - ); - --wa-color-indigo-min-60: color-mix( - in oklab, - var(--wa-color-indigo) var(--wa-color-indigo-gte-60), - var(--wa-color-indigo-60) - ); - --wa-color-indigo-max-70: color-mix( - in oklab, - var(--wa-color-indigo) var(--wa-color-indigo-lt-70), - var(--wa-color-indigo-70) - ); - --wa-color-indigo-min-70: color-mix( - in oklab, - var(--wa-color-indigo) var(--wa-color-indigo-gte-70), - var(--wa-color-indigo-70) - ); - - --wa-color-purple-max-50: color-mix( - in oklab, - var(--wa-color-purple) var(--wa-color-purple-lt-50), - var(--wa-color-purple-50) - ); - --wa-color-purple-min-50: color-mix( - in oklab, - var(--wa-color-purple) var(--wa-color-purple-gte-50), - var(--wa-color-purple-50) - ); - --wa-color-purple-max-60: color-mix( - in oklab, - var(--wa-color-purple) var(--wa-color-purple-lt-60), - var(--wa-color-purple-60) - ); - --wa-color-purple-min-60: color-mix( - in oklab, - var(--wa-color-purple) var(--wa-color-purple-gte-60), - var(--wa-color-purple-60) - ); - --wa-color-purple-max-70: color-mix( - in oklab, - var(--wa-color-purple) var(--wa-color-purple-lt-70), - var(--wa-color-purple-70) - ); - --wa-color-purple-min-70: color-mix( - in oklab, - var(--wa-color-purple) var(--wa-color-purple-gte-70), - var(--wa-color-purple-70) - ); - - --wa-color-pink-max-50: color-mix( - in oklab, - var(--wa-color-pink) var(--wa-color-pink-lt-50), - var(--wa-color-pink-50) - ); - --wa-color-pink-min-50: color-mix( - in oklab, - var(--wa-color-pink) var(--wa-color-pink-gte-50), - var(--wa-color-pink-50) - ); - --wa-color-pink-max-60: color-mix( - in oklab, - var(--wa-color-pink) var(--wa-color-pink-lt-60), - var(--wa-color-pink-60) - ); - --wa-color-pink-min-60: color-mix( - in oklab, - var(--wa-color-pink) var(--wa-color-pink-gte-60), - var(--wa-color-pink-60) - ); - --wa-color-pink-max-70: color-mix( - in oklab, - var(--wa-color-pink) var(--wa-color-pink-lt-70), - var(--wa-color-pink-70) - ); - --wa-color-pink-min-70: color-mix( - in oklab, - var(--wa-color-pink) var(--wa-color-pink-gte-70), - var(--wa-color-pink-70) - ); - - --wa-color-gray-max-50: color-mix( - in oklab, - var(--wa-color-gray) var(--wa-color-gray-lt-50), - var(--wa-color-gray-50) - ); - --wa-color-gray-min-50: color-mix( - in oklab, - var(--wa-color-gray) var(--wa-color-gray-gte-50), - var(--wa-color-gray-50) - ); - --wa-color-gray-max-60: color-mix( - in oklab, - var(--wa-color-gray) var(--wa-color-gray-lt-60), - var(--wa-color-gray-60) - ); - --wa-color-gray-min-60: color-mix( - in oklab, - var(--wa-color-gray) var(--wa-color-gray-gte-60), - var(--wa-color-gray-60) - ); - --wa-color-gray-max-70: color-mix( - in oklab, - var(--wa-color-gray) var(--wa-color-gray-lt-70), - var(--wa-color-gray-70) - ); - --wa-color-gray-min-70: color-mix( - in oklab, - var(--wa-color-gray) var(--wa-color-gray-gte-70), - var(--wa-color-gray-70) - ); - - /* Text color: white if key < 60, {hue}-10 otherwise */ - --wa-color-red-on: color-mix(in oklab, var(--wa-color-red-10) var(--wa-color-red-gte-60), white); --wa-color-orange-on: color-mix(in oklab, var(--wa-color-orange-10) var(--wa-color-orange-gte-60), white); --wa-color-yellow-on: color-mix(in oklab, var(--wa-color-yellow-10) var(--wa-color-yellow-gte-60), white); diff --git a/packages/webawesome/src/styles/danger/blue.css b/packages/webawesome/src/styles/danger/blue.css index afb135dbb..5d4b2ff6d 100644 --- a/packages/webawesome/src/styles/danger/blue.css +++ b/packages/webawesome/src/styles/danger/blue.css @@ -16,23 +16,6 @@ --wa-color-danger-10: var(--wa-color-blue-10); --wa-color-danger-05: var(--wa-color-blue-05); --wa-color-danger: var(--wa-color-blue); - - --wa-color-danger-lt-50: var(--wa-color-blue-lt-50); - --wa-color-danger-gte-50: var(--wa-color-blue-gte-50); - - --wa-color-danger-lt-60: var(--wa-color-blue-lt-60); - --wa-color-danger-gte-60: var(--wa-color-blue-gte-60); - - --wa-color-danger-lt-70: var(--wa-color-blue-lt-70); - --wa-color-danger-gte-70: var(--wa-color-blue-gte-70); - - --wa-color-danger-max-50: var(--wa-color-blue-max-50); - --wa-color-danger-min-50: var(--wa-color-blue-min-50); - --wa-color-danger-max-60: var(--wa-color-blue-max-60); - --wa-color-danger-min-60: var(--wa-color-blue-min-60); - --wa-color-danger-max-70: var(--wa-color-blue-max-70); - --wa-color-danger-min-70: var(--wa-color-blue-min-70); - --wa-color-danger-on: var(--wa-color-blue-on); } } diff --git a/packages/webawesome/src/styles/danger/cyan.css b/packages/webawesome/src/styles/danger/cyan.css index 8947126b2..fd7d39bb5 100644 --- a/packages/webawesome/src/styles/danger/cyan.css +++ b/packages/webawesome/src/styles/danger/cyan.css @@ -16,23 +16,6 @@ --wa-color-danger-10: var(--wa-color-cyan-10); --wa-color-danger-05: var(--wa-color-cyan-05); --wa-color-danger: var(--wa-color-cyan); - - --wa-color-danger-lt-50: var(--wa-color-cyan-lt-50); - --wa-color-danger-gte-50: var(--wa-color-cyan-gte-50); - - --wa-color-danger-lt-60: var(--wa-color-cyan-lt-60); - --wa-color-danger-gte-60: var(--wa-color-cyan-gte-60); - - --wa-color-danger-lt-70: var(--wa-color-cyan-lt-70); - --wa-color-danger-gte-70: var(--wa-color-cyan-gte-70); - - --wa-color-danger-max-50: var(--wa-color-cyan-max-50); - --wa-color-danger-min-50: var(--wa-color-cyan-min-50); - --wa-color-danger-max-60: var(--wa-color-cyan-max-60); - --wa-color-danger-min-60: var(--wa-color-cyan-min-60); - --wa-color-danger-max-70: var(--wa-color-cyan-max-70); - --wa-color-danger-min-70: var(--wa-color-cyan-min-70); - --wa-color-danger-on: var(--wa-color-cyan-on); } } diff --git a/packages/webawesome/src/styles/danger/gray.css b/packages/webawesome/src/styles/danger/gray.css index a6b426140..986158a44 100644 --- a/packages/webawesome/src/styles/danger/gray.css +++ b/packages/webawesome/src/styles/danger/gray.css @@ -16,23 +16,6 @@ --wa-color-danger-10: var(--wa-color-gray-10); --wa-color-danger-05: var(--wa-color-gray-05); --wa-color-danger: var(--wa-color-gray); - - --wa-color-danger-lt-50: var(--wa-color-gray-lt-50); - --wa-color-danger-gte-50: var(--wa-color-gray-gte-50); - - --wa-color-danger-lt-60: var(--wa-color-gray-lt-60); - --wa-color-danger-gte-60: var(--wa-color-gray-gte-60); - - --wa-color-danger-lt-70: var(--wa-color-gray-lt-70); - --wa-color-danger-gte-70: var(--wa-color-gray-gte-70); - - --wa-color-danger-max-50: var(--wa-color-gray-max-50); - --wa-color-danger-min-50: var(--wa-color-gray-min-50); - --wa-color-danger-max-60: var(--wa-color-gray-max-60); - --wa-color-danger-min-60: var(--wa-color-gray-min-60); - --wa-color-danger-max-70: var(--wa-color-gray-max-70); - --wa-color-danger-min-70: var(--wa-color-gray-min-70); - --wa-color-danger-on: var(--wa-color-gray-on); } } diff --git a/packages/webawesome/src/styles/danger/green.css b/packages/webawesome/src/styles/danger/green.css index 506e2d506..0ba12cedb 100644 --- a/packages/webawesome/src/styles/danger/green.css +++ b/packages/webawesome/src/styles/danger/green.css @@ -16,23 +16,6 @@ --wa-color-danger-10: var(--wa-color-green-10); --wa-color-danger-05: var(--wa-color-green-05); --wa-color-danger: var(--wa-color-green); - - --wa-color-danger-lt-50: var(--wa-color-green-lt-50); - --wa-color-danger-gte-50: var(--wa-color-green-gte-50); - - --wa-color-danger-lt-60: var(--wa-color-green-lt-60); - --wa-color-danger-gte-60: var(--wa-color-green-gte-60); - - --wa-color-danger-lt-70: var(--wa-color-green-lt-70); - --wa-color-danger-gte-70: var(--wa-color-green-gte-70); - - --wa-color-danger-max-50: var(--wa-color-green-max-50); - --wa-color-danger-min-50: var(--wa-color-green-min-50); - --wa-color-danger-max-60: var(--wa-color-green-max-60); - --wa-color-danger-min-60: var(--wa-color-green-min-60); - --wa-color-danger-max-70: var(--wa-color-green-max-70); - --wa-color-danger-min-70: var(--wa-color-green-min-70); - --wa-color-danger-on: var(--wa-color-green-on); } } diff --git a/packages/webawesome/src/styles/danger/indigo.css b/packages/webawesome/src/styles/danger/indigo.css index 8ffcc0670..989d45e03 100644 --- a/packages/webawesome/src/styles/danger/indigo.css +++ b/packages/webawesome/src/styles/danger/indigo.css @@ -16,23 +16,6 @@ --wa-color-danger-10: var(--wa-color-indigo-10); --wa-color-danger-05: var(--wa-color-indigo-05); --wa-color-danger: var(--wa-color-indigo); - - --wa-color-danger-lt-50: var(--wa-color-indigo-lt-50); - --wa-color-danger-gte-50: var(--wa-color-indigo-gte-50); - - --wa-color-danger-lt-60: var(--wa-color-indigo-lt-60); - --wa-color-danger-gte-60: var(--wa-color-indigo-gte-60); - - --wa-color-danger-lt-70: var(--wa-color-indigo-lt-70); - --wa-color-danger-gte-70: var(--wa-color-indigo-gte-70); - - --wa-color-danger-max-50: var(--wa-color-indigo-max-50); - --wa-color-danger-min-50: var(--wa-color-indigo-min-50); - --wa-color-danger-max-60: var(--wa-color-indigo-max-60); - --wa-color-danger-min-60: var(--wa-color-indigo-min-60); - --wa-color-danger-max-70: var(--wa-color-indigo-max-70); - --wa-color-danger-min-70: var(--wa-color-indigo-min-70); - --wa-color-danger-on: var(--wa-color-indigo-on); } } diff --git a/packages/webawesome/src/styles/danger/orange.css b/packages/webawesome/src/styles/danger/orange.css index 9cfcf2450..2c7d85d92 100644 --- a/packages/webawesome/src/styles/danger/orange.css +++ b/packages/webawesome/src/styles/danger/orange.css @@ -16,23 +16,6 @@ --wa-color-danger-10: var(--wa-color-orange-10); --wa-color-danger-05: var(--wa-color-orange-05); --wa-color-danger: var(--wa-color-orange); - - --wa-color-danger-lt-50: var(--wa-color-orange-lt-50); - --wa-color-danger-gte-50: var(--wa-color-orange-gte-50); - - --wa-color-danger-lt-60: var(--wa-color-orange-lt-60); - --wa-color-danger-gte-60: var(--wa-color-orange-gte-60); - - --wa-color-danger-lt-70: var(--wa-color-orange-lt-70); - --wa-color-danger-gte-70: var(--wa-color-orange-gte-70); - - --wa-color-danger-max-50: var(--wa-color-orange-max-50); - --wa-color-danger-min-50: var(--wa-color-orange-min-50); - --wa-color-danger-max-60: var(--wa-color-orange-max-60); - --wa-color-danger-min-60: var(--wa-color-orange-min-60); - --wa-color-danger-max-70: var(--wa-color-orange-max-70); - --wa-color-danger-min-70: var(--wa-color-orange-min-70); - --wa-color-danger-on: var(--wa-color-orange-on); } } diff --git a/packages/webawesome/src/styles/danger/pink.css b/packages/webawesome/src/styles/danger/pink.css index c835e59ee..527e0b20a 100644 --- a/packages/webawesome/src/styles/danger/pink.css +++ b/packages/webawesome/src/styles/danger/pink.css @@ -16,23 +16,6 @@ --wa-color-danger-10: var(--wa-color-pink-10); --wa-color-danger-05: var(--wa-color-pink-05); --wa-color-danger: var(--wa-color-pink); - - --wa-color-danger-lt-50: var(--wa-color-pink-lt-50); - --wa-color-danger-gte-50: var(--wa-color-pink-gte-50); - - --wa-color-danger-lt-60: var(--wa-color-pink-lt-60); - --wa-color-danger-gte-60: var(--wa-color-pink-gte-60); - - --wa-color-danger-lt-70: var(--wa-color-pink-lt-70); - --wa-color-danger-gte-70: var(--wa-color-pink-gte-70); - - --wa-color-danger-max-50: var(--wa-color-pink-max-50); - --wa-color-danger-min-50: var(--wa-color-pink-min-50); - --wa-color-danger-max-60: var(--wa-color-pink-max-60); - --wa-color-danger-min-60: var(--wa-color-pink-min-60); - --wa-color-danger-max-70: var(--wa-color-pink-max-70); - --wa-color-danger-min-70: var(--wa-color-pink-min-70); - --wa-color-danger-on: var(--wa-color-pink-on); } } diff --git a/packages/webawesome/src/styles/danger/purple.css b/packages/webawesome/src/styles/danger/purple.css index c204a3883..6be0a61a2 100644 --- a/packages/webawesome/src/styles/danger/purple.css +++ b/packages/webawesome/src/styles/danger/purple.css @@ -16,23 +16,6 @@ --wa-color-danger-10: var(--wa-color-purple-10); --wa-color-danger-05: var(--wa-color-purple-05); --wa-color-danger: var(--wa-color-purple); - - --wa-color-danger-lt-50: var(--wa-color-purple-lt-50); - --wa-color-danger-gte-50: var(--wa-color-purple-gte-50); - - --wa-color-danger-lt-60: var(--wa-color-purple-lt-60); - --wa-color-danger-gte-60: var(--wa-color-purple-gte-60); - - --wa-color-danger-lt-70: var(--wa-color-purple-lt-70); - --wa-color-danger-gte-70: var(--wa-color-purple-gte-70); - - --wa-color-danger-max-50: var(--wa-color-purple-max-50); - --wa-color-danger-min-50: var(--wa-color-purple-min-50); - --wa-color-danger-max-60: var(--wa-color-purple-max-60); - --wa-color-danger-min-60: var(--wa-color-purple-min-60); - --wa-color-danger-max-70: var(--wa-color-purple-max-70); - --wa-color-danger-min-70: var(--wa-color-purple-min-70); - --wa-color-danger-on: var(--wa-color-purple-on); } } diff --git a/packages/webawesome/src/styles/danger/red.css b/packages/webawesome/src/styles/danger/red.css index 235ae347c..743305e03 100644 --- a/packages/webawesome/src/styles/danger/red.css +++ b/packages/webawesome/src/styles/danger/red.css @@ -16,23 +16,6 @@ --wa-color-danger-10: var(--wa-color-red-10); --wa-color-danger-05: var(--wa-color-red-05); --wa-color-danger: var(--wa-color-red); - - --wa-color-danger-lt-50: var(--wa-color-red-lt-50); - --wa-color-danger-gte-50: var(--wa-color-red-gte-50); - - --wa-color-danger-lt-60: var(--wa-color-red-lt-60); - --wa-color-danger-gte-60: var(--wa-color-red-gte-60); - - --wa-color-danger-lt-70: var(--wa-color-red-lt-70); - --wa-color-danger-gte-70: var(--wa-color-red-gte-70); - - --wa-color-danger-max-50: var(--wa-color-red-max-50); - --wa-color-danger-min-50: var(--wa-color-red-min-50); - --wa-color-danger-max-60: var(--wa-color-red-max-60); - --wa-color-danger-min-60: var(--wa-color-red-min-60); - --wa-color-danger-max-70: var(--wa-color-red-max-70); - --wa-color-danger-min-70: var(--wa-color-red-min-70); - --wa-color-danger-on: var(--wa-color-red-on); } } diff --git a/packages/webawesome/src/styles/danger/yellow.css b/packages/webawesome/src/styles/danger/yellow.css index fbdd2fad3..410e24123 100644 --- a/packages/webawesome/src/styles/danger/yellow.css +++ b/packages/webawesome/src/styles/danger/yellow.css @@ -16,23 +16,6 @@ --wa-color-danger-10: var(--wa-color-yellow-10); --wa-color-danger-05: var(--wa-color-yellow-05); --wa-color-danger: var(--wa-color-yellow); - - --wa-color-danger-lt-50: var(--wa-color-yellow-lt-50); - --wa-color-danger-gte-50: var(--wa-color-yellow-gte-50); - - --wa-color-danger-lt-60: var(--wa-color-yellow-lt-60); - --wa-color-danger-gte-60: var(--wa-color-yellow-gte-60); - - --wa-color-danger-lt-70: var(--wa-color-yellow-lt-70); - --wa-color-danger-gte-70: var(--wa-color-yellow-gte-70); - - --wa-color-danger-max-50: var(--wa-color-yellow-max-50); - --wa-color-danger-min-50: var(--wa-color-yellow-min-50); - --wa-color-danger-max-60: var(--wa-color-yellow-max-60); - --wa-color-danger-min-60: var(--wa-color-yellow-min-60); - --wa-color-danger-max-70: var(--wa-color-yellow-max-70); - --wa-color-danger-min-70: var(--wa-color-yellow-min-70); - --wa-color-danger-on: var(--wa-color-yellow-on); } } diff --git a/packages/webawesome/src/styles/neutral/blue.css b/packages/webawesome/src/styles/neutral/blue.css index d5f489ba2..aba4e237a 100644 --- a/packages/webawesome/src/styles/neutral/blue.css +++ b/packages/webawesome/src/styles/neutral/blue.css @@ -16,23 +16,6 @@ --wa-color-neutral-10: var(--wa-color-blue-10); --wa-color-neutral-05: var(--wa-color-blue-05); --wa-color-neutral: var(--wa-color-blue); - - --wa-color-neutral-lt-50: var(--wa-color-blue-lt-50); - --wa-color-neutral-gte-50: var(--wa-color-blue-gte-50); - - --wa-color-neutral-lt-60: var(--wa-color-blue-lt-60); - --wa-color-neutral-gte-60: var(--wa-color-blue-gte-60); - - --wa-color-neutral-lt-70: var(--wa-color-blue-lt-70); - --wa-color-neutral-gte-70: var(--wa-color-blue-gte-70); - - --wa-color-neutral-max-50: var(--wa-color-blue-max-50); - --wa-color-neutral-min-50: var(--wa-color-blue-min-50); - --wa-color-neutral-max-60: var(--wa-color-blue-max-60); - --wa-color-neutral-min-60: var(--wa-color-blue-min-60); - --wa-color-neutral-max-70: var(--wa-color-blue-max-70); - --wa-color-neutral-min-70: var(--wa-color-blue-min-70); - --wa-color-neutral-on: var(--wa-color-blue-on); } } diff --git a/packages/webawesome/src/styles/neutral/cyan.css b/packages/webawesome/src/styles/neutral/cyan.css index b7c54a9b2..096ecb3e9 100644 --- a/packages/webawesome/src/styles/neutral/cyan.css +++ b/packages/webawesome/src/styles/neutral/cyan.css @@ -16,23 +16,6 @@ --wa-color-neutral-10: var(--wa-color-cyan-10); --wa-color-neutral-05: var(--wa-color-cyan-05); --wa-color-neutral: var(--wa-color-cyan); - - --wa-color-neutral-lt-50: var(--wa-color-cyan-lt-50); - --wa-color-neutral-gte-50: var(--wa-color-cyan-gte-50); - - --wa-color-neutral-lt-60: var(--wa-color-cyan-lt-60); - --wa-color-neutral-gte-60: var(--wa-color-cyan-gte-60); - - --wa-color-neutral-lt-70: var(--wa-color-cyan-lt-70); - --wa-color-neutral-gte-70: var(--wa-color-cyan-gte-70); - - --wa-color-neutral-max-50: var(--wa-color-cyan-max-50); - --wa-color-neutral-min-50: var(--wa-color-cyan-min-50); - --wa-color-neutral-max-60: var(--wa-color-cyan-max-60); - --wa-color-neutral-min-60: var(--wa-color-cyan-min-60); - --wa-color-neutral-max-70: var(--wa-color-cyan-max-70); - --wa-color-neutral-min-70: var(--wa-color-cyan-min-70); - --wa-color-neutral-on: var(--wa-color-cyan-on); } } diff --git a/packages/webawesome/src/styles/neutral/gray.css b/packages/webawesome/src/styles/neutral/gray.css index 6f116c969..c343a0618 100644 --- a/packages/webawesome/src/styles/neutral/gray.css +++ b/packages/webawesome/src/styles/neutral/gray.css @@ -16,23 +16,6 @@ --wa-color-neutral-10: var(--wa-color-gray-10); --wa-color-neutral-05: var(--wa-color-gray-05); --wa-color-neutral: var(--wa-color-gray); - - --wa-color-neutral-lt-50: var(--wa-color-gray-lt-50); - --wa-color-neutral-gte-50: var(--wa-color-gray-gte-50); - - --wa-color-neutral-lt-60: var(--wa-color-gray-lt-60); - --wa-color-neutral-gte-60: var(--wa-color-gray-gte-60); - - --wa-color-neutral-lt-70: var(--wa-color-gray-lt-70); - --wa-color-neutral-gte-70: var(--wa-color-gray-gte-70); - - --wa-color-neutral-max-50: var(--wa-color-gray-max-50); - --wa-color-neutral-min-50: var(--wa-color-gray-min-50); - --wa-color-neutral-max-60: var(--wa-color-gray-max-60); - --wa-color-neutral-min-60: var(--wa-color-gray-min-60); - --wa-color-neutral-max-70: var(--wa-color-gray-max-70); - --wa-color-neutral-min-70: var(--wa-color-gray-min-70); - --wa-color-neutral-on: var(--wa-color-gray-on); } } diff --git a/packages/webawesome/src/styles/neutral/green.css b/packages/webawesome/src/styles/neutral/green.css index af50de515..8b2079c3b 100644 --- a/packages/webawesome/src/styles/neutral/green.css +++ b/packages/webawesome/src/styles/neutral/green.css @@ -16,23 +16,6 @@ --wa-color-neutral-10: var(--wa-color-green-10); --wa-color-neutral-05: var(--wa-color-green-05); --wa-color-neutral: var(--wa-color-green); - - --wa-color-neutral-lt-50: var(--wa-color-green-lt-50); - --wa-color-neutral-gte-50: var(--wa-color-green-gte-50); - - --wa-color-neutral-lt-60: var(--wa-color-green-lt-60); - --wa-color-neutral-gte-60: var(--wa-color-green-gte-60); - - --wa-color-neutral-lt-70: var(--wa-color-green-lt-70); - --wa-color-neutral-gte-70: var(--wa-color-green-gte-70); - - --wa-color-neutral-max-50: var(--wa-color-green-max-50); - --wa-color-neutral-min-50: var(--wa-color-green-min-50); - --wa-color-neutral-max-60: var(--wa-color-green-max-60); - --wa-color-neutral-min-60: var(--wa-color-green-min-60); - --wa-color-neutral-max-70: var(--wa-color-green-max-70); - --wa-color-neutral-min-70: var(--wa-color-green-min-70); - --wa-color-neutral-on: var(--wa-color-green-on); } } diff --git a/packages/webawesome/src/styles/neutral/indigo.css b/packages/webawesome/src/styles/neutral/indigo.css index 41e544146..29d32cb05 100644 --- a/packages/webawesome/src/styles/neutral/indigo.css +++ b/packages/webawesome/src/styles/neutral/indigo.css @@ -16,23 +16,6 @@ --wa-color-neutral-10: var(--wa-color-indigo-10); --wa-color-neutral-05: var(--wa-color-indigo-05); --wa-color-neutral: var(--wa-color-indigo); - - --wa-color-neutral-lt-50: var(--wa-color-indigo-lt-50); - --wa-color-neutral-gte-50: var(--wa-color-indigo-gte-50); - - --wa-color-neutral-lt-60: var(--wa-color-indigo-lt-60); - --wa-color-neutral-gte-60: var(--wa-color-indigo-gte-60); - - --wa-color-neutral-lt-70: var(--wa-color-indigo-lt-70); - --wa-color-neutral-gte-70: var(--wa-color-indigo-gte-70); - - --wa-color-neutral-max-50: var(--wa-color-indigo-max-50); - --wa-color-neutral-min-50: var(--wa-color-indigo-min-50); - --wa-color-neutral-max-60: var(--wa-color-indigo-max-60); - --wa-color-neutral-min-60: var(--wa-color-indigo-min-60); - --wa-color-neutral-max-70: var(--wa-color-indigo-max-70); - --wa-color-neutral-min-70: var(--wa-color-indigo-min-70); - --wa-color-neutral-on: var(--wa-color-indigo-on); } } diff --git a/packages/webawesome/src/styles/neutral/orange.css b/packages/webawesome/src/styles/neutral/orange.css index 3262c0496..d6760f8f1 100644 --- a/packages/webawesome/src/styles/neutral/orange.css +++ b/packages/webawesome/src/styles/neutral/orange.css @@ -16,23 +16,6 @@ --wa-color-neutral-10: var(--wa-color-orange-10); --wa-color-neutral-05: var(--wa-color-orange-05); --wa-color-neutral: var(--wa-color-orange); - - --wa-color-neutral-lt-50: var(--wa-color-orange-lt-50); - --wa-color-neutral-gte-50: var(--wa-color-orange-gte-50); - - --wa-color-neutral-lt-60: var(--wa-color-orange-lt-60); - --wa-color-neutral-gte-60: var(--wa-color-orange-gte-60); - - --wa-color-neutral-lt-70: var(--wa-color-orange-lt-70); - --wa-color-neutral-gte-70: var(--wa-color-orange-gte-70); - - --wa-color-neutral-max-50: var(--wa-color-orange-max-50); - --wa-color-neutral-min-50: var(--wa-color-orange-min-50); - --wa-color-neutral-max-60: var(--wa-color-orange-max-60); - --wa-color-neutral-min-60: var(--wa-color-orange-min-60); - --wa-color-neutral-max-70: var(--wa-color-orange-max-70); - --wa-color-neutral-min-70: var(--wa-color-orange-min-70); - --wa-color-neutral-on: var(--wa-color-orange-on); } } diff --git a/packages/webawesome/src/styles/neutral/pink.css b/packages/webawesome/src/styles/neutral/pink.css index 346498181..60e4ffd81 100644 --- a/packages/webawesome/src/styles/neutral/pink.css +++ b/packages/webawesome/src/styles/neutral/pink.css @@ -16,23 +16,6 @@ --wa-color-neutral-10: var(--wa-color-pink-10); --wa-color-neutral-05: var(--wa-color-pink-05); --wa-color-neutral: var(--wa-color-pink); - - --wa-color-neutral-lt-50: var(--wa-color-pink-lt-50); - --wa-color-neutral-gte-50: var(--wa-color-pink-gte-50); - - --wa-color-neutral-lt-60: var(--wa-color-pink-lt-60); - --wa-color-neutral-gte-60: var(--wa-color-pink-gte-60); - - --wa-color-neutral-lt-70: var(--wa-color-pink-lt-70); - --wa-color-neutral-gte-70: var(--wa-color-pink-gte-70); - - --wa-color-neutral-max-50: var(--wa-color-pink-max-50); - --wa-color-neutral-min-50: var(--wa-color-pink-min-50); - --wa-color-neutral-max-60: var(--wa-color-pink-max-60); - --wa-color-neutral-min-60: var(--wa-color-pink-min-60); - --wa-color-neutral-max-70: var(--wa-color-pink-max-70); - --wa-color-neutral-min-70: var(--wa-color-pink-min-70); - --wa-color-neutral-on: var(--wa-color-pink-on); } } diff --git a/packages/webawesome/src/styles/neutral/purple.css b/packages/webawesome/src/styles/neutral/purple.css index 20cb9597e..cb11c1e72 100644 --- a/packages/webawesome/src/styles/neutral/purple.css +++ b/packages/webawesome/src/styles/neutral/purple.css @@ -16,23 +16,6 @@ --wa-color-neutral-10: var(--wa-color-purple-10); --wa-color-neutral-05: var(--wa-color-purple-05); --wa-color-neutral: var(--wa-color-purple); - - --wa-color-neutral-lt-50: var(--wa-color-purple-lt-50); - --wa-color-neutral-gte-50: var(--wa-color-purple-gte-50); - - --wa-color-neutral-lt-60: var(--wa-color-purple-lt-60); - --wa-color-neutral-gte-60: var(--wa-color-purple-gte-60); - - --wa-color-neutral-lt-70: var(--wa-color-purple-lt-70); - --wa-color-neutral-gte-70: var(--wa-color-purple-gte-70); - - --wa-color-neutral-max-50: var(--wa-color-purple-max-50); - --wa-color-neutral-min-50: var(--wa-color-purple-min-50); - --wa-color-neutral-max-60: var(--wa-color-purple-max-60); - --wa-color-neutral-min-60: var(--wa-color-purple-min-60); - --wa-color-neutral-max-70: var(--wa-color-purple-max-70); - --wa-color-neutral-min-70: var(--wa-color-purple-min-70); - --wa-color-neutral-on: var(--wa-color-purple-on); } } diff --git a/packages/webawesome/src/styles/neutral/red.css b/packages/webawesome/src/styles/neutral/red.css index a62a334e2..74b6ca098 100644 --- a/packages/webawesome/src/styles/neutral/red.css +++ b/packages/webawesome/src/styles/neutral/red.css @@ -16,23 +16,6 @@ --wa-color-neutral-10: var(--wa-color-red-10); --wa-color-neutral-05: var(--wa-color-red-05); --wa-color-neutral: var(--wa-color-red); - - --wa-color-neutral-lt-50: var(--wa-color-red-lt-50); - --wa-color-neutral-gte-50: var(--wa-color-red-gte-50); - - --wa-color-neutral-lt-60: var(--wa-color-red-lt-60); - --wa-color-neutral-gte-60: var(--wa-color-red-gte-60); - - --wa-color-neutral-lt-70: var(--wa-color-red-lt-70); - --wa-color-neutral-gte-70: var(--wa-color-red-gte-70); - - --wa-color-neutral-max-50: var(--wa-color-red-max-50); - --wa-color-neutral-min-50: var(--wa-color-red-min-50); - --wa-color-neutral-max-60: var(--wa-color-red-max-60); - --wa-color-neutral-min-60: var(--wa-color-red-min-60); - --wa-color-neutral-max-70: var(--wa-color-red-max-70); - --wa-color-neutral-min-70: var(--wa-color-red-min-70); - --wa-color-neutral-on: var(--wa-color-red-on); } } diff --git a/packages/webawesome/src/styles/neutral/yellow.css b/packages/webawesome/src/styles/neutral/yellow.css index b576d1931..9e6f4aadd 100644 --- a/packages/webawesome/src/styles/neutral/yellow.css +++ b/packages/webawesome/src/styles/neutral/yellow.css @@ -16,23 +16,6 @@ --wa-color-neutral-10: var(--wa-color-yellow-10); --wa-color-neutral-05: var(--wa-color-yellow-05); --wa-color-neutral: var(--wa-color-yellow); - - --wa-color-neutral-lt-50: var(--wa-color-yellow-lt-50); - --wa-color-neutral-gte-50: var(--wa-color-yellow-gte-50); - - --wa-color-neutral-lt-60: var(--wa-color-yellow-lt-60); - --wa-color-neutral-gte-60: var(--wa-color-yellow-gte-60); - - --wa-color-neutral-lt-70: var(--wa-color-yellow-lt-70); - --wa-color-neutral-gte-70: var(--wa-color-yellow-gte-70); - - --wa-color-neutral-max-50: var(--wa-color-yellow-max-50); - --wa-color-neutral-min-50: var(--wa-color-yellow-min-50); - --wa-color-neutral-max-60: var(--wa-color-yellow-max-60); - --wa-color-neutral-min-60: var(--wa-color-yellow-min-60); - --wa-color-neutral-max-70: var(--wa-color-yellow-max-70); - --wa-color-neutral-min-70: var(--wa-color-yellow-min-70); - --wa-color-neutral-on: var(--wa-color-yellow-on); } } diff --git a/packages/webawesome/src/styles/success/blue.css b/packages/webawesome/src/styles/success/blue.css index c55fb6a12..78d05b528 100644 --- a/packages/webawesome/src/styles/success/blue.css +++ b/packages/webawesome/src/styles/success/blue.css @@ -16,23 +16,6 @@ --wa-color-success-10: var(--wa-color-blue-10); --wa-color-success-05: var(--wa-color-blue-05); --wa-color-success: var(--wa-color-blue); - - --wa-color-success-lt-50: var(--wa-color-blue-lt-50); - --wa-color-success-gte-50: var(--wa-color-blue-gte-50); - - --wa-color-success-lt-60: var(--wa-color-blue-lt-60); - --wa-color-success-gte-60: var(--wa-color-blue-gte-60); - - --wa-color-success-lt-70: var(--wa-color-blue-lt-70); - --wa-color-success-gte-70: var(--wa-color-blue-gte-70); - - --wa-color-success-max-50: var(--wa-color-blue-max-50); - --wa-color-success-min-50: var(--wa-color-blue-min-50); - --wa-color-success-max-60: var(--wa-color-blue-max-60); - --wa-color-success-min-60: var(--wa-color-blue-min-60); - --wa-color-success-max-70: var(--wa-color-blue-max-70); - --wa-color-success-min-70: var(--wa-color-blue-min-70); - --wa-color-success-on: var(--wa-color-blue-on); } } diff --git a/packages/webawesome/src/styles/success/cyan.css b/packages/webawesome/src/styles/success/cyan.css index 34a74d674..40276d2b9 100644 --- a/packages/webawesome/src/styles/success/cyan.css +++ b/packages/webawesome/src/styles/success/cyan.css @@ -16,23 +16,6 @@ --wa-color-success-10: var(--wa-color-cyan-10); --wa-color-success-05: var(--wa-color-cyan-05); --wa-color-success: var(--wa-color-cyan); - - --wa-color-success-lt-50: var(--wa-color-cyan-lt-50); - --wa-color-success-gte-50: var(--wa-color-cyan-gte-50); - - --wa-color-success-lt-60: var(--wa-color-cyan-lt-60); - --wa-color-success-gte-60: var(--wa-color-cyan-gte-60); - - --wa-color-success-lt-70: var(--wa-color-cyan-lt-70); - --wa-color-success-gte-70: var(--wa-color-cyan-gte-70); - - --wa-color-success-max-50: var(--wa-color-cyan-max-50); - --wa-color-success-min-50: var(--wa-color-cyan-min-50); - --wa-color-success-max-60: var(--wa-color-cyan-max-60); - --wa-color-success-min-60: var(--wa-color-cyan-min-60); - --wa-color-success-max-70: var(--wa-color-cyan-max-70); - --wa-color-success-min-70: var(--wa-color-cyan-min-70); - --wa-color-success-on: var(--wa-color-cyan-on); } } diff --git a/packages/webawesome/src/styles/success/gray.css b/packages/webawesome/src/styles/success/gray.css index e466f5367..810764004 100644 --- a/packages/webawesome/src/styles/success/gray.css +++ b/packages/webawesome/src/styles/success/gray.css @@ -16,23 +16,6 @@ --wa-color-success-10: var(--wa-color-gray-10); --wa-color-success-05: var(--wa-color-gray-05); --wa-color-success: var(--wa-color-gray); - - --wa-color-success-lt-50: var(--wa-color-gray-lt-50); - --wa-color-success-gte-50: var(--wa-color-gray-gte-50); - - --wa-color-success-lt-60: var(--wa-color-gray-lt-60); - --wa-color-success-gte-60: var(--wa-color-gray-gte-60); - - --wa-color-success-lt-70: var(--wa-color-gray-lt-70); - --wa-color-success-gte-70: var(--wa-color-gray-gte-70); - - --wa-color-success-max-50: var(--wa-color-gray-max-50); - --wa-color-success-min-50: var(--wa-color-gray-min-50); - --wa-color-success-max-60: var(--wa-color-gray-max-60); - --wa-color-success-min-60: var(--wa-color-gray-min-60); - --wa-color-success-max-70: var(--wa-color-gray-max-70); - --wa-color-success-min-70: var(--wa-color-gray-min-70); - --wa-color-success-on: var(--wa-color-gray-on); } } diff --git a/packages/webawesome/src/styles/success/green.css b/packages/webawesome/src/styles/success/green.css index c5dad2e8c..80bf7fc74 100644 --- a/packages/webawesome/src/styles/success/green.css +++ b/packages/webawesome/src/styles/success/green.css @@ -16,23 +16,6 @@ --wa-color-success-10: var(--wa-color-green-10); --wa-color-success-05: var(--wa-color-green-05); --wa-color-success: var(--wa-color-green); - - --wa-color-success-lt-50: var(--wa-color-green-lt-50); - --wa-color-success-gte-50: var(--wa-color-green-gte-50); - - --wa-color-success-lt-60: var(--wa-color-green-lt-60); - --wa-color-success-gte-60: var(--wa-color-green-gte-60); - - --wa-color-success-lt-70: var(--wa-color-green-lt-70); - --wa-color-success-gte-70: var(--wa-color-green-gte-70); - - --wa-color-success-max-50: var(--wa-color-green-max-50); - --wa-color-success-min-50: var(--wa-color-green-min-50); - --wa-color-success-max-60: var(--wa-color-green-max-60); - --wa-color-success-min-60: var(--wa-color-green-min-60); - --wa-color-success-max-70: var(--wa-color-green-max-70); - --wa-color-success-min-70: var(--wa-color-green-min-70); - --wa-color-success-on: var(--wa-color-green-on); } } diff --git a/packages/webawesome/src/styles/success/indigo.css b/packages/webawesome/src/styles/success/indigo.css index 2805f7e53..1d57a3569 100644 --- a/packages/webawesome/src/styles/success/indigo.css +++ b/packages/webawesome/src/styles/success/indigo.css @@ -16,23 +16,6 @@ --wa-color-success-10: var(--wa-color-indigo-10); --wa-color-success-05: var(--wa-color-indigo-05); --wa-color-success: var(--wa-color-indigo); - - --wa-color-success-lt-50: var(--wa-color-indigo-lt-50); - --wa-color-success-gte-50: var(--wa-color-indigo-gte-50); - - --wa-color-success-lt-60: var(--wa-color-indigo-lt-60); - --wa-color-success-gte-60: var(--wa-color-indigo-gte-60); - - --wa-color-success-lt-70: var(--wa-color-indigo-lt-70); - --wa-color-success-gte-70: var(--wa-color-indigo-gte-70); - - --wa-color-success-max-50: var(--wa-color-indigo-max-50); - --wa-color-success-min-50: var(--wa-color-indigo-min-50); - --wa-color-success-max-60: var(--wa-color-indigo-max-60); - --wa-color-success-min-60: var(--wa-color-indigo-min-60); - --wa-color-success-max-70: var(--wa-color-indigo-max-70); - --wa-color-success-min-70: var(--wa-color-indigo-min-70); - --wa-color-success-on: var(--wa-color-indigo-on); } } diff --git a/packages/webawesome/src/styles/success/orange.css b/packages/webawesome/src/styles/success/orange.css index 5289a4bfe..773dd6300 100644 --- a/packages/webawesome/src/styles/success/orange.css +++ b/packages/webawesome/src/styles/success/orange.css @@ -16,23 +16,6 @@ --wa-color-success-10: var(--wa-color-orange-10); --wa-color-success-05: var(--wa-color-orange-05); --wa-color-success: var(--wa-color-orange); - - --wa-color-success-lt-50: var(--wa-color-orange-lt-50); - --wa-color-success-gte-50: var(--wa-color-orange-gte-50); - - --wa-color-success-lt-60: var(--wa-color-orange-lt-60); - --wa-color-success-gte-60: var(--wa-color-orange-gte-60); - - --wa-color-success-lt-70: var(--wa-color-orange-lt-70); - --wa-color-success-gte-70: var(--wa-color-orange-gte-70); - - --wa-color-success-max-50: var(--wa-color-orange-max-50); - --wa-color-success-min-50: var(--wa-color-orange-min-50); - --wa-color-success-max-60: var(--wa-color-orange-max-60); - --wa-color-success-min-60: var(--wa-color-orange-min-60); - --wa-color-success-max-70: var(--wa-color-orange-max-70); - --wa-color-success-min-70: var(--wa-color-orange-min-70); - --wa-color-success-on: var(--wa-color-orange-on); } } diff --git a/packages/webawesome/src/styles/success/pink.css b/packages/webawesome/src/styles/success/pink.css index 374435b06..eddf2eeea 100644 --- a/packages/webawesome/src/styles/success/pink.css +++ b/packages/webawesome/src/styles/success/pink.css @@ -16,23 +16,6 @@ --wa-color-success-10: var(--wa-color-pink-10); --wa-color-success-05: var(--wa-color-pink-05); --wa-color-success: var(--wa-color-pink); - - --wa-color-success-lt-50: var(--wa-color-pink-lt-50); - --wa-color-success-gte-50: var(--wa-color-pink-gte-50); - - --wa-color-success-lt-60: var(--wa-color-pink-lt-60); - --wa-color-success-gte-60: var(--wa-color-pink-gte-60); - - --wa-color-success-lt-70: var(--wa-color-pink-lt-70); - --wa-color-success-gte-70: var(--wa-color-pink-gte-70); - - --wa-color-success-max-50: var(--wa-color-pink-max-50); - --wa-color-success-min-50: var(--wa-color-pink-min-50); - --wa-color-success-max-60: var(--wa-color-pink-max-60); - --wa-color-success-min-60: var(--wa-color-pink-min-60); - --wa-color-success-max-70: var(--wa-color-pink-max-70); - --wa-color-success-min-70: var(--wa-color-pink-min-70); - --wa-color-success-on: var(--wa-color-pink-on); } } diff --git a/packages/webawesome/src/styles/success/purple.css b/packages/webawesome/src/styles/success/purple.css index 6f717dd4f..aa771cc25 100644 --- a/packages/webawesome/src/styles/success/purple.css +++ b/packages/webawesome/src/styles/success/purple.css @@ -16,23 +16,6 @@ --wa-color-success-10: var(--wa-color-purple-10); --wa-color-success-05: var(--wa-color-purple-05); --wa-color-success: var(--wa-color-purple); - - --wa-color-success-lt-50: var(--wa-color-purple-lt-50); - --wa-color-success-gte-50: var(--wa-color-purple-gte-50); - - --wa-color-success-lt-60: var(--wa-color-purple-lt-60); - --wa-color-success-gte-60: var(--wa-color-purple-gte-60); - - --wa-color-success-lt-70: var(--wa-color-purple-lt-70); - --wa-color-success-gte-70: var(--wa-color-purple-gte-70); - - --wa-color-success-max-50: var(--wa-color-purple-max-50); - --wa-color-success-min-50: var(--wa-color-purple-min-50); - --wa-color-success-max-60: var(--wa-color-purple-max-60); - --wa-color-success-min-60: var(--wa-color-purple-min-60); - --wa-color-success-max-70: var(--wa-color-purple-max-70); - --wa-color-success-min-70: var(--wa-color-purple-min-70); - --wa-color-success-on: var(--wa-color-purple-on); } } diff --git a/packages/webawesome/src/styles/success/red.css b/packages/webawesome/src/styles/success/red.css index 26fe1634d..01e9be654 100644 --- a/packages/webawesome/src/styles/success/red.css +++ b/packages/webawesome/src/styles/success/red.css @@ -16,23 +16,6 @@ --wa-color-success-10: var(--wa-color-red-10); --wa-color-success-05: var(--wa-color-red-05); --wa-color-success: var(--wa-color-red); - - --wa-color-success-lt-50: var(--wa-color-red-lt-50); - --wa-color-success-gte-50: var(--wa-color-red-gte-50); - - --wa-color-success-lt-60: var(--wa-color-red-lt-60); - --wa-color-success-gte-60: var(--wa-color-red-gte-60); - - --wa-color-success-lt-70: var(--wa-color-red-lt-70); - --wa-color-success-gte-70: var(--wa-color-red-gte-70); - - --wa-color-success-max-50: var(--wa-color-red-max-50); - --wa-color-success-min-50: var(--wa-color-red-min-50); - --wa-color-success-max-60: var(--wa-color-red-max-60); - --wa-color-success-min-60: var(--wa-color-red-min-60); - --wa-color-success-max-70: var(--wa-color-red-max-70); - --wa-color-success-min-70: var(--wa-color-red-min-70); - --wa-color-success-on: var(--wa-color-red-on); } } diff --git a/packages/webawesome/src/styles/success/yellow.css b/packages/webawesome/src/styles/success/yellow.css index d6943de51..b2589d899 100644 --- a/packages/webawesome/src/styles/success/yellow.css +++ b/packages/webawesome/src/styles/success/yellow.css @@ -16,23 +16,6 @@ --wa-color-success-10: var(--wa-color-yellow-10); --wa-color-success-05: var(--wa-color-yellow-05); --wa-color-success: var(--wa-color-yellow); - - --wa-color-success-lt-50: var(--wa-color-yellow-lt-50); - --wa-color-success-gte-50: var(--wa-color-yellow-gte-50); - - --wa-color-success-lt-60: var(--wa-color-yellow-lt-60); - --wa-color-success-gte-60: var(--wa-color-yellow-gte-60); - - --wa-color-success-lt-70: var(--wa-color-yellow-lt-70); - --wa-color-success-gte-70: var(--wa-color-yellow-gte-70); - - --wa-color-success-max-50: var(--wa-color-yellow-max-50); - --wa-color-success-min-50: var(--wa-color-yellow-min-50); - --wa-color-success-max-60: var(--wa-color-yellow-max-60); - --wa-color-success-min-60: var(--wa-color-yellow-min-60); - --wa-color-success-max-70: var(--wa-color-yellow-max-70); - --wa-color-success-min-70: var(--wa-color-yellow-min-70); - --wa-color-success-on: var(--wa-color-yellow-on); } } diff --git a/packages/webawesome/src/styles/themes/active/color.css b/packages/webawesome/src/styles/themes/active/color.css index c54b5d73d..c6873c449 100644 --- a/packages/webawesome/src/styles/themes/active/color.css +++ b/packages/webawesome/src/styles/themes/active/color.css @@ -31,43 +31,43 @@ */ --wa-color-brand-fill-quiet: var(--wa-color-brand-95); --wa-color-brand-fill-normal: var(--wa-color-brand-90); - --wa-color-brand-fill-loud: var(--wa-color-brand-min-70); + --wa-color-brand-fill-loud: var(--wa-color-brand); --wa-color-brand-border-quiet: var(--wa-color-brand-90); --wa-color-brand-border-normal: var(--wa-color-brand-80); --wa-color-brand-border-loud: var(--wa-color-brand-70); --wa-color-brand-on-quiet: var(--wa-color-brand-40); --wa-color-brand-on-normal: var(--wa-color-brand-30); - --wa-color-brand-on-loud: black; + --wa-color-brand-on-loud: var(--wa-color-brand-on); --wa-color-success-fill-quiet: var(--wa-color-success-95); --wa-color-success-fill-normal: var(--wa-color-success-90); - --wa-color-success-fill-loud: var(--wa-color-success-min-70); + --wa-color-success-fill-loud: var(--wa-color-success); --wa-color-success-border-quiet: var(--wa-color-success-90); --wa-color-success-border-normal: var(--wa-color-success-80); --wa-color-success-border-loud: var(--wa-color-success-70); --wa-color-success-on-quiet: var(--wa-color-success-40); --wa-color-success-on-normal: var(--wa-color-success-30); - --wa-color-success-on-loud: black; + --wa-color-success-on-loud: var(--wa-color-success-on); --wa-color-warning-fill-quiet: var(--wa-color-warning-95); --wa-color-warning-fill-normal: var(--wa-color-warning-90); - --wa-color-warning-fill-loud: var(--wa-color-warning-min-70); + --wa-color-warning-fill-loud: var(--wa-color-warning); --wa-color-warning-border-quiet: var(--wa-color-warning-90); --wa-color-warning-border-normal: var(--wa-color-warning-80); --wa-color-warning-border-loud: var(--wa-color-warning-70); --wa-color-warning-on-quiet: var(--wa-color-warning-40); --wa-color-warning-on-normal: var(--wa-color-warning-30); - --wa-color-warning-on-loud: black; + --wa-color-warning-on-loud: var(--wa-color-warning-on); --wa-color-danger-fill-quiet: var(--wa-color-danger-95); --wa-color-danger-fill-normal: var(--wa-color-danger-90); - --wa-color-danger-fill-loud: var(--wa-color-danger-min-70); + --wa-color-danger-fill-loud: var(--wa-color-danger); --wa-color-danger-border-quiet: var(--wa-color-danger-90); --wa-color-danger-border-normal: var(--wa-color-danger-80); --wa-color-danger-border-loud: var(--wa-color-danger-70); --wa-color-danger-on-quiet: var(--wa-color-danger-40); --wa-color-danger-on-normal: var(--wa-color-danger-30); - --wa-color-danger-on-loud: black; + --wa-color-danger-on-loud: var(--wa-color-danger-on); --wa-color-neutral-fill-quiet: var(--wa-color-neutral-95); --wa-color-neutral-fill-normal: var(--wa-color-neutral-90); @@ -94,43 +94,43 @@ */ --wa-color-brand-fill-quiet: var(--wa-color-brand-10); --wa-color-brand-fill-normal: var(--wa-color-brand-20); - --wa-color-brand-fill-loud: var(--wa-color-brand-min-70); + --wa-color-brand-fill-loud: var(--wa-color-brand); --wa-color-brand-border-quiet: var(--wa-color-brand-20); --wa-color-brand-border-normal: var(--wa-color-brand-30); --wa-color-brand-border-loud: var(--wa-color-brand-60); - --wa-color-brand-on-quiet: var(--wa-color-brand-min-70); + --wa-color-brand-on-quiet: var(--wa-color-brand-70); --wa-color-brand-on-normal: var(--wa-color-brand-90); - --wa-color-brand-on-loud: black; + --wa-color-brand-on-loud: var(--wa-color-brand-on); --wa-color-success-fill-quiet: var(--wa-color-success-10); --wa-color-success-fill-normal: var(--wa-color-success-20); - --wa-color-success-fill-loud: var(--wa-color-success-min-70); + --wa-color-success-fill-loud: var(--wa-color-success); --wa-color-success-border-quiet: var(--wa-color-success-20); --wa-color-success-border-normal: var(--wa-color-success-30); --wa-color-success-border-loud: var(--wa-color-success-40); - --wa-color-success-on-quiet: var(--wa-color-success-min-70); + --wa-color-success-on-quiet: var(--wa-color-success-70); --wa-color-success-on-normal: var(--wa-color-success-90); - --wa-color-success-on-loud: black; + --wa-color-success-on-loud: var(--wa-color-success-on); --wa-color-warning-fill-quiet: var(--wa-color-warning-10); --wa-color-warning-fill-normal: var(--wa-color-warning-20); - --wa-color-warning-fill-loud: var(--wa-color-warning-min-70); + --wa-color-warning-fill-loud: var(--wa-color-warning); --wa-color-warning-border-quiet: var(--wa-color-warning-20); --wa-color-warning-border-normal: var(--wa-color-warning-30); --wa-color-warning-border-loud: var(--wa-color-warning-60); - --wa-color-warning-on-quiet: var(--wa-color-warning-min-70); + --wa-color-warning-on-quiet: var(--wa-color-warning-70); --wa-color-warning-on-normal: var(--wa-color-warning-90); - --wa-color-warning-on-loud: black; + --wa-color-warning-on-loud: var(--wa-color-warning-on); --wa-color-danger-fill-quiet: var(--wa-color-danger-10); --wa-color-danger-fill-normal: var(--wa-color-danger-20); - --wa-color-danger-fill-loud: var(--wa-color-danger-min-70); + --wa-color-danger-fill-loud: var(--wa-color-danger); --wa-color-danger-border-quiet: var(--wa-color-danger-20); --wa-color-danger-border-normal: var(--wa-color-danger-30); --wa-color-danger-border-loud: var(--wa-color-danger-60); - --wa-color-danger-on-quiet: var(--wa-color-danger-min-70); + --wa-color-danger-on-quiet: var(--wa-color-danger-70); --wa-color-danger-on-normal: var(--wa-color-danger-90); - --wa-color-danger-on-loud: black; + --wa-color-danger-on-loud: var(--wa-color-danger-on); --wa-color-neutral-fill-quiet: var(--wa-color-neutral-10); --wa-color-neutral-fill-normal: var(--wa-color-neutral-20); diff --git a/packages/webawesome/src/styles/themes/awesome/color.css b/packages/webawesome/src/styles/themes/awesome/color.css index eff896b37..cdccdf7f7 100644 --- a/packages/webawesome/src/styles/themes/awesome/color.css +++ b/packages/webawesome/src/styles/themes/awesome/color.css @@ -22,7 +22,7 @@ */ --wa-color-brand-fill-quiet: var(--wa-color-brand-95); --wa-color-brand-fill-normal: var(--wa-color-brand-90); - --wa-color-brand-fill-loud: var(--wa-color-brand-min-70); + --wa-color-brand-fill-loud: var(--wa-color-brand-70); --wa-color-brand-border-quiet: var(--wa-color-brand-70); --wa-color-brand-border-normal: var(--wa-color-brand-50); --wa-color-brand-border-loud: var(--wa-color-brand-30); @@ -32,7 +32,7 @@ --wa-color-success-fill-quiet: var(--wa-color-success-95); --wa-color-success-fill-normal: var(--wa-color-success-90); - --wa-color-success-fill-loud: var(--wa-color-success-min-70); + --wa-color-success-fill-loud: var(--wa-color-success-80); --wa-color-success-border-quiet: var(--wa-color-success-70); --wa-color-success-border-normal: var(--wa-color-success-50); --wa-color-success-border-loud: var(--wa-color-success-30); @@ -42,7 +42,7 @@ --wa-color-warning-fill-quiet: var(--wa-color-warning-95); --wa-color-warning-fill-normal: var(--wa-color-warning-90); - --wa-color-warning-fill-loud: var(--wa-color-warning-min-70); + --wa-color-warning-fill-loud: var(--wa-color-warning-80); --wa-color-warning-border-quiet: var(--wa-color-warning-70); --wa-color-warning-border-normal: var(--wa-color-warning-50); --wa-color-warning-border-loud: var(--wa-color-warning-30); @@ -52,7 +52,7 @@ --wa-color-danger-fill-quiet: var(--wa-color-danger-95); --wa-color-danger-fill-normal: var(--wa-color-danger-90); - --wa-color-danger-fill-loud: var(--wa-color-danger-min-70); + --wa-color-danger-fill-loud: var(--wa-color-danger-70); --wa-color-danger-border-quiet: var(--wa-color-danger-70); --wa-color-danger-border-normal: var(--wa-color-danger-50); --wa-color-danger-border-loud: var(--wa-color-danger-30); @@ -85,7 +85,7 @@ --wa-color-brand-border-quiet: var(--wa-color-brand-30); --wa-color-brand-border-normal: var(--wa-color-brand-50); --wa-color-brand-border-loud: var(--wa-color-brand-80); - --wa-color-brand-on-quiet: var(--wa-color-brand-min-70); + --wa-color-brand-on-quiet: var(--wa-color-brand-70); --wa-color-brand-on-normal: var(--wa-color-brand-80); --wa-color-brand-on-loud: white; @@ -95,7 +95,7 @@ --wa-color-success-border-quiet: var(--wa-color-success-30); --wa-color-success-border-normal: var(--wa-color-success-50); --wa-color-success-border-loud: var(--wa-color-success-80); - --wa-color-success-on-quiet: var(--wa-color-success-min-70); + --wa-color-success-on-quiet: var(--wa-color-success-70); --wa-color-success-on-normal: var(--wa-color-success-80); --wa-color-success-on-loud: white; @@ -105,7 +105,7 @@ --wa-color-warning-border-quiet: var(--wa-color-warning-30); --wa-color-warning-border-normal: var(--wa-color-warning-50); --wa-color-warning-border-loud: var(--wa-color-warning-80); - --wa-color-warning-on-quiet: var(--wa-color-warning-min-70); + --wa-color-warning-on-quiet: var(--wa-color-warning-70); --wa-color-warning-on-normal: var(--wa-color-warning-80); --wa-color-warning-on-loud: var(--wa-color-warning-05); @@ -115,7 +115,7 @@ --wa-color-danger-border-quiet: var(--wa-color-danger-30); --wa-color-danger-border-normal: var(--wa-color-danger-50); --wa-color-danger-border-loud: var(--wa-color-danger-80); - --wa-color-danger-on-quiet: var(--wa-color-danger-min-70); + --wa-color-danger-on-quiet: var(--wa-color-danger-70); --wa-color-danger-on-normal: var(--wa-color-danger-80); --wa-color-danger-on-loud: white; diff --git a/packages/webawesome/src/styles/themes/brutalist/color.css b/packages/webawesome/src/styles/themes/brutalist/color.css index a0a1fa79c..11c018941 100644 --- a/packages/webawesome/src/styles/themes/brutalist/color.css +++ b/packages/webawesome/src/styles/themes/brutalist/color.css @@ -29,7 +29,7 @@ */ --wa-color-brand-fill-quiet: var(--wa-color-brand-95); --wa-color-brand-fill-normal: var(--wa-color-brand-90); - --wa-color-brand-fill-loud: var(--wa-color-brand-max-50); + --wa-color-brand-fill-loud: var(--wa-color-brand-50); --wa-color-brand-border-quiet: var(--wa-color-brand-80); --wa-color-brand-border-normal: var(--wa-color-brand-60); --wa-color-brand-border-loud: var(--wa-color-brand-40); @@ -39,7 +39,7 @@ --wa-color-success-fill-quiet: var(--wa-color-success-95); --wa-color-success-fill-normal: var(--wa-color-success-90); - --wa-color-success-fill-loud: var(--wa-color-success-max-50); + --wa-color-success-fill-loud: var(--wa-color-success-50); --wa-color-success-border-quiet: var(--wa-color-success-80); --wa-color-success-border-normal: var(--wa-color-success-60); --wa-color-success-border-loud: var(--wa-color-success-40); @@ -49,7 +49,7 @@ --wa-color-warning-fill-quiet: var(--wa-color-warning-95); --wa-color-warning-fill-normal: var(--wa-color-warning-90); - --wa-color-warning-fill-loud: var(--wa-color-warning-max-50); + --wa-color-warning-fill-loud: var(--wa-color-warning-50); --wa-color-warning-border-quiet: var(--wa-color-warning-80); --wa-color-warning-border-normal: var(--wa-color-warning-60); --wa-color-warning-border-loud: var(--wa-color-warning-40); @@ -59,7 +59,7 @@ --wa-color-danger-fill-quiet: var(--wa-color-danger-95); --wa-color-danger-fill-normal: var(--wa-color-danger-90); - --wa-color-danger-fill-loud: var(--wa-color-danger-max-50); + --wa-color-danger-fill-loud: var(--wa-color-danger-50); --wa-color-danger-border-quiet: var(--wa-color-danger-80); --wa-color-danger-border-normal: var(--wa-color-danger-60); --wa-color-danger-border-loud: var(--wa-color-danger-40); @@ -100,41 +100,41 @@ */ --wa-color-brand-fill-quiet: var(--wa-color-brand-20); --wa-color-brand-fill-normal: var(--wa-color-brand-30); - --wa-color-brand-fill-loud: var(--wa-color-brand-min-70); + --wa-color-brand-fill-loud: var(--wa-color-brand-70); --wa-color-brand-border-quiet: var(--wa-color-brand-30); --wa-color-brand-border-normal: var(--wa-color-brand-40); --wa-color-brand-border-loud: var(--wa-color-brand-80); - --wa-color-brand-on-quiet: var(--wa-color-brand-min-70); + --wa-color-brand-on-quiet: var(--wa-color-brand-70); --wa-color-brand-on-normal: var(--wa-color-brand-95); --wa-color-brand-on-loud: var(--wa-color-brand-10); --wa-color-success-fill-quiet: var(--wa-color-success-20); --wa-color-success-fill-normal: var(--wa-color-success-30); - --wa-color-success-fill-loud: var(--wa-color-success-min-70); + --wa-color-success-fill-loud: var(--wa-color-success-70); --wa-color-success-border-quiet: var(--wa-color-success-30); --wa-color-success-border-normal: var(--wa-color-success-40); --wa-color-success-border-loud: var(--wa-color-success-80); - --wa-color-success-on-quiet: var(--wa-color-success-min-70); + --wa-color-success-on-quiet: var(--wa-color-success-70); --wa-color-success-on-normal: var(--wa-color-success-95); --wa-color-success-on-loud: var(--wa-color-success-10); --wa-color-warning-fill-quiet: var(--wa-color-warning-20); --wa-color-warning-fill-normal: var(--wa-color-warning-30); - --wa-color-warning-fill-loud: var(--wa-color-warning-min-70); + --wa-color-warning-fill-loud: var(--wa-color-warning-70); --wa-color-warning-border-quiet: var(--wa-color-warning-30); --wa-color-warning-border-normal: var(--wa-color-warning-40); --wa-color-warning-border-loud: var(--wa-color-warning-80); - --wa-color-warning-on-quiet: var(--wa-color-warning-min-70); + --wa-color-warning-on-quiet: var(--wa-color-warning-70); --wa-color-warning-on-normal: var(--wa-color-warning-95); --wa-color-warning-on-loud: var(--wa-color-warning-10); --wa-color-danger-fill-quiet: var(--wa-color-danger-20); --wa-color-danger-fill-normal: var(--wa-color-danger-30); - --wa-color-danger-fill-loud: var(--wa-color-danger-min-70); + --wa-color-danger-fill-loud: var(--wa-color-danger-70); --wa-color-danger-border-quiet: var(--wa-color-danger-30); --wa-color-danger-border-normal: var(--wa-color-danger-40); --wa-color-danger-border-loud: var(--wa-color-danger-80); - --wa-color-danger-on-quiet: var(--wa-color-danger-min-70); + --wa-color-danger-on-quiet: var(--wa-color-danger-70); --wa-color-danger-on-normal: var(--wa-color-danger-95); --wa-color-danger-on-loud: var(--wa-color-danger-10); diff --git a/packages/webawesome/src/styles/themes/default/color.css b/packages/webawesome/src/styles/themes/default/color.css index 4fe8e47dd..7d8769fae 100644 --- a/packages/webawesome/src/styles/themes/default/color.css +++ b/packages/webawesome/src/styles/themes/default/color.css @@ -66,7 +66,7 @@ */ --wa-color-brand-fill-quiet: var(--wa-color-brand-95); --wa-color-brand-fill-normal: var(--wa-color-brand-90); - --wa-color-brand-fill-loud: var(--wa-color-brand-max-50); + --wa-color-brand-fill-loud: var(--wa-color-brand-50); --wa-color-brand-border-quiet: var(--wa-color-brand-90); --wa-color-brand-border-normal: var(--wa-color-brand-80); --wa-color-brand-border-loud: var(--wa-color-brand-60); @@ -76,7 +76,7 @@ --wa-color-success-fill-quiet: var(--wa-color-success-95); --wa-color-success-fill-normal: var(--wa-color-success-90); - --wa-color-success-fill-loud: var(--wa-color-success-max-50); + --wa-color-success-fill-loud: var(--wa-color-success-50); --wa-color-success-border-quiet: var(--wa-color-success-90); --wa-color-success-border-normal: var(--wa-color-success-80); --wa-color-success-border-loud: var(--wa-color-success-60); @@ -86,7 +86,7 @@ --wa-color-warning-fill-quiet: var(--wa-color-warning-95); --wa-color-warning-fill-normal: var(--wa-color-warning-90); - --wa-color-warning-fill-loud: var(--wa-color-warning-max-50); + --wa-color-warning-fill-loud: var(--wa-color-warning-50); --wa-color-warning-border-quiet: var(--wa-color-warning-90); --wa-color-warning-border-normal: var(--wa-color-warning-80); --wa-color-warning-border-loud: var(--wa-color-warning-60); @@ -96,7 +96,7 @@ --wa-color-danger-fill-quiet: var(--wa-color-danger-95); --wa-color-danger-fill-normal: var(--wa-color-danger-90); - --wa-color-danger-fill-loud: var(--wa-color-danger-max-50); + --wa-color-danger-fill-loud: var(--wa-color-danger-50); --wa-color-danger-border-quiet: var(--wa-color-danger-90); --wa-color-danger-border-normal: var(--wa-color-danger-80); --wa-color-danger-border-loud: var(--wa-color-danger-60); @@ -156,7 +156,7 @@ --wa-color-brand-border-quiet: var(--wa-color-brand-20); --wa-color-brand-border-normal: var(--wa-color-brand-30); --wa-color-brand-border-loud: var(--wa-color-brand-40); - --wa-color-brand-on-quiet: var(--wa-color-brand-min-60); + --wa-color-brand-on-quiet: var(--wa-color-brand-60); --wa-color-brand-on-normal: var(--wa-color-brand-70); --wa-color-brand-on-loud: white; @@ -166,7 +166,7 @@ --wa-color-success-border-quiet: var(--wa-color-success-20); --wa-color-success-border-normal: var(--wa-color-success-30); --wa-color-success-border-loud: var(--wa-color-success-40); - --wa-color-success-on-quiet: var(--wa-color-success-min-60); + --wa-color-success-on-quiet: var(--wa-color-success-60); --wa-color-success-on-normal: var(--wa-color-success-70); --wa-color-success-on-loud: white; @@ -176,7 +176,7 @@ --wa-color-warning-border-quiet: var(--wa-color-warning-20); --wa-color-warning-border-normal: var(--wa-color-warning-30); --wa-color-warning-border-loud: var(--wa-color-warning-40); - --wa-color-warning-on-quiet: var(--wa-color-warning-min-60); + --wa-color-warning-on-quiet: var(--wa-color-warning-60); --wa-color-warning-on-normal: var(--wa-color-warning-70); --wa-color-warning-on-loud: white; @@ -186,7 +186,7 @@ --wa-color-danger-border-quiet: var(--wa-color-danger-20); --wa-color-danger-border-normal: var(--wa-color-danger-30); --wa-color-danger-border-loud: var(--wa-color-danger-40); - --wa-color-danger-on-quiet: var(--wa-color-danger-min-60); + --wa-color-danger-on-quiet: var(--wa-color-danger-60); --wa-color-danger-on-normal: var(--wa-color-danger-70); --wa-color-danger-on-loud: white; diff --git a/packages/webawesome/src/styles/themes/glossy/color.css b/packages/webawesome/src/styles/themes/glossy/color.css index 831354aee..9c9b3e06b 100644 --- a/packages/webawesome/src/styles/themes/glossy/color.css +++ b/packages/webawesome/src/styles/themes/glossy/color.css @@ -5,3 +5,24 @@ @import url('../../warning/yellow.css'); @import url('../../danger/red.css'); @import url('../../neutral/gray.css'); + +@layer wa-theme { + :where(:root), + :host, + .wa-theme-glossy, + .wa-light, + .wa-dark .wa-invert { + --wa-color-brand-fill-loud: var(--wa-color-brand-40); + --wa-color-success-fill-loud: var(--wa-color-success-40); + --wa-color-warning-fill-loud: var(--wa-color-warning-40); + --wa-color-danger-fill-loud: var(--wa-color-danger-40); + } + + .wa-dark, + .wa-invert { + --wa-color-brand-fill-loud: var(--wa-color-brand-40); + --wa-color-success-fill-loud: var(--wa-color-success-40); + --wa-color-warning-fill-loud: var(--wa-color-warning-40); + --wa-color-danger-fill-loud: var(--wa-color-danger-40); + } +} diff --git a/packages/webawesome/src/styles/themes/playful/color.css b/packages/webawesome/src/styles/themes/playful/color.css index f5c6f9a09..93c3266c7 100644 --- a/packages/webawesome/src/styles/themes/playful/color.css +++ b/packages/webawesome/src/styles/themes/playful/color.css @@ -102,7 +102,7 @@ --wa-color-brand-border-quiet: var(--wa-color-brand-30); --wa-color-brand-border-normal: var(--wa-color-brand-40); --wa-color-brand-border-loud: var(--wa-color-brand-50); - --wa-color-brand-on-quiet: var(--wa-color-brand-min-70); + --wa-color-brand-on-quiet: var(--wa-color-brand-70); --wa-color-brand-on-normal: var(--wa-color-brand-90); --wa-color-brand-on-loud: var(--wa-color-brand-on); @@ -112,7 +112,7 @@ --wa-color-success-border-quiet: var(--wa-color-success-30); --wa-color-success-border-normal: var(--wa-color-success-40); --wa-color-success-border-loud: var(--wa-color-success-50); - --wa-color-success-on-quiet: var(--wa-color-success-min-70); + --wa-color-success-on-quiet: var(--wa-color-success-70); --wa-color-success-on-normal: var(--wa-color-success-90); --wa-color-success-on-loud: var(--wa-color-success-on); @@ -122,7 +122,7 @@ --wa-color-warning-border-quiet: var(--wa-color-warning-30); --wa-color-warning-border-normal: var(--wa-color-warning-40); --wa-color-warning-border-loud: var(--wa-color-warning-50); - --wa-color-warning-on-quiet: var(--wa-color-warning-min-70); + --wa-color-warning-on-quiet: var(--wa-color-warning-70); --wa-color-warning-on-normal: var(--wa-color-warning-90); --wa-color-warning-on-loud: var(--wa-color-warning-on); @@ -132,7 +132,7 @@ --wa-color-danger-border-quiet: var(--wa-color-danger-30); --wa-color-danger-border-normal: var(--wa-color-danger-40); --wa-color-danger-border-loud: var(--wa-color-danger-50); - --wa-color-danger-on-quiet: var(--wa-color-danger-min-70); + --wa-color-danger-on-quiet: var(--wa-color-danger-70); --wa-color-danger-on-normal: var(--wa-color-danger-90); --wa-color-danger-on-loud: var(--wa-color-danger-on); diff --git a/packages/webawesome/src/styles/themes/premium/color.css b/packages/webawesome/src/styles/themes/premium/color.css index 1707089ff..b07ac1263 100644 --- a/packages/webawesome/src/styles/themes/premium/color.css +++ b/packages/webawesome/src/styles/themes/premium/color.css @@ -25,7 +25,7 @@ */ --wa-color-brand-fill-quiet: var(--wa-color-brand-95); --wa-color-brand-fill-normal: var(--wa-color-brand-90); - --wa-color-brand-fill-loud: var(--wa-color-brand-min-70); + --wa-color-brand-fill-loud: var(--wa-color-brand-80); --wa-color-brand-border-quiet: var(--wa-color-brand-80); --wa-color-brand-border-normal: var(--wa-color-brand-70); --wa-color-brand-border-loud: var(--wa-color-brand-50); @@ -35,7 +35,7 @@ --wa-color-success-fill-quiet: var(--wa-color-success-95); --wa-color-success-fill-normal: var(--wa-color-success-90); - --wa-color-success-fill-loud: var(--wa-color-success-min-70); + --wa-color-success-fill-loud: var(--wa-color-success-80); --wa-color-success-border-quiet: var(--wa-color-success-80); --wa-color-success-border-normal: var(--wa-color-success-70); --wa-color-success-border-loud: var(--wa-color-success-50); @@ -45,7 +45,7 @@ --wa-color-warning-fill-quiet: var(--wa-color-warning-95); --wa-color-warning-fill-normal: var(--wa-color-warning-90); - --wa-color-warning-fill-loud: var(--wa-color-warning-min-70); + --wa-color-warning-fill-loud: var(--wa-color-warning-80); --wa-color-warning-border-quiet: var(--wa-color-warning-80); --wa-color-warning-border-normal: var(--wa-color-warning-70); --wa-color-warning-border-loud: var(--wa-color-warning-50); @@ -55,7 +55,7 @@ --wa-color-danger-fill-quiet: var(--wa-color-danger-95); --wa-color-danger-fill-normal: var(--wa-color-danger-90); - --wa-color-danger-fill-loud: var(--wa-color-danger-min-70); + --wa-color-danger-fill-loud: var(--wa-color-danger-70); --wa-color-danger-border-quiet: var(--wa-color-danger-80); --wa-color-danger-border-normal: var(--wa-color-danger-70); --wa-color-danger-border-loud: var(--wa-color-danger-50); @@ -96,7 +96,7 @@ */ --wa-color-brand-fill-quiet: var(--wa-color-brand-30); --wa-color-brand-fill-normal: var(--wa-color-brand-40); - --wa-color-brand-fill-loud: var(--wa-color-brand-min-70); + --wa-color-brand-fill-loud: var(--wa-color-brand-70); --wa-color-brand-border-quiet: var(--wa-color-brand-30); --wa-color-brand-border-normal: var(--wa-color-brand-40); --wa-color-brand-border-loud: var(--wa-color-brand-70); @@ -106,7 +106,7 @@ --wa-color-success-fill-quiet: var(--wa-color-success-30); --wa-color-success-fill-normal: var(--wa-color-success-40); - --wa-color-success-fill-loud: var(--wa-color-success-min-70); + --wa-color-success-fill-loud: var(--wa-color-success-70); --wa-color-success-border-quiet: var(--wa-color-success-30); --wa-color-success-border-normal: var(--wa-color-success-40); --wa-color-success-border-loud: var(--wa-color-success-70); @@ -116,7 +116,7 @@ --wa-color-warning-fill-quiet: var(--wa-color-warning-30); --wa-color-warning-fill-normal: var(--wa-color-warning-40); - --wa-color-warning-fill-loud: var(--wa-color-warning-min-70); + --wa-color-warning-fill-loud: var(--wa-color-warning-70); --wa-color-warning-border-quiet: var(--wa-color-warning-30); --wa-color-warning-border-normal: var(--wa-color-warning-40); --wa-color-warning-border-loud: var(--wa-color-warning-70); @@ -126,7 +126,7 @@ --wa-color-danger-fill-quiet: var(--wa-color-danger-30); --wa-color-danger-fill-normal: var(--wa-color-danger-40); - --wa-color-danger-fill-loud: var(--wa-color-danger-min-70); + --wa-color-danger-fill-loud: var(--wa-color-danger-70); --wa-color-danger-border-quiet: var(--wa-color-danger-30); --wa-color-danger-border-normal: var(--wa-color-danger-40); --wa-color-danger-border-loud: var(--wa-color-danger-70); diff --git a/packages/webawesome/src/styles/themes/tailspin/color.css b/packages/webawesome/src/styles/themes/tailspin/color.css index 815a4ea26..1ed29d6bf 100644 --- a/packages/webawesome/src/styles/themes/tailspin/color.css +++ b/packages/webawesome/src/styles/themes/tailspin/color.css @@ -111,8 +111,8 @@ --wa-color-brand-border-quiet: color-mix(in oklab, var(--wa-color-brand-20), transparent); --wa-color-brand-border-normal: color-mix(in oklab, var(--wa-color-brand-30), transparent); --wa-color-brand-border-loud: color-mix(in oklab, var(--wa-color-brand-40), transparent); - --wa-color-brand-on-quiet: var(--wa-color-brand-min-60); - --wa-color-brand-on-normal: var(--wa-color-brand-min-70); + --wa-color-brand-on-quiet: var(--wa-color-brand-60); + --wa-color-brand-on-normal: var(--wa-color-brand-70); --wa-color-brand-on-loud: white; --wa-color-success-fill-quiet: color-mix(in oklab, var(--wa-color-success-10) 90%, transparent); @@ -121,8 +121,8 @@ --wa-color-success-border-quiet: color-mix(in oklab, var(--wa-color-success-20), transparent); --wa-color-success-border-normal: color-mix(in oklab, var(--wa-color-success-30) 60%, transparent); --wa-color-success-border-loud: color-mix(in oklab, var(--wa-color-success-40) 70%, transparent); - --wa-color-success-on-quiet: var(--wa-color-success-min-60); - --wa-color-success-on-normal: var(--wa-color-success-min-70); + --wa-color-success-on-quiet: var(--wa-color-success-60); + --wa-color-success-on-normal: var(--wa-color-success-70); --wa-color-success-on-loud: white; --wa-color-warning-fill-quiet: color-mix(in oklab, var(--wa-color-warning-10) 90%, transparent); @@ -131,8 +131,8 @@ --wa-color-warning-border-quiet: color-mix(in oklab, var(--wa-color-warning-20), transparent); --wa-color-warning-border-normal: color-mix(in oklab, var(--wa-color-warning-30) 60%, transparent); --wa-color-warning-border-loud: color-mix(in oklab, var(--wa-color-warning-40) 70%, transparent); - --wa-color-warning-on-quiet: var(--wa-color-warning-min-60); - --wa-color-warning-on-normal: var(--wa-color-warning-min-70); + --wa-color-warning-on-quiet: var(--wa-color-warning-60); + --wa-color-warning-on-normal: var(--wa-color-warning-70); --wa-color-warning-on-loud: white; --wa-color-danger-fill-quiet: color-mix(in oklab, var(--wa-color-danger-10) 90%, transparent); @@ -141,8 +141,8 @@ --wa-color-danger-border-quiet: color-mix(in oklab, var(--wa-color-danger-20), transparent); --wa-color-danger-border-normal: color-mix(in oklab, var(--wa-color-danger-30) 60%, transparent); --wa-color-danger-border-loud: color-mix(in oklab, var(--wa-color-danger-40) 70%, transparent); - --wa-color-danger-on-quiet: var(--wa-color-danger-min-60); - --wa-color-danger-on-normal: var(--wa-color-danger-min-70); + --wa-color-danger-on-quiet: var(--wa-color-danger-60); + --wa-color-danger-on-normal: var(--wa-color-danger-70); --wa-color-danger-on-loud: white; --wa-color-neutral-fill-quiet: color-mix(in oklab, var(--wa-color-neutral-10) 90%, transparent); diff --git a/packages/webawesome/src/styles/warning/blue.css b/packages/webawesome/src/styles/warning/blue.css index ddedf923a..28b2024a2 100644 --- a/packages/webawesome/src/styles/warning/blue.css +++ b/packages/webawesome/src/styles/warning/blue.css @@ -16,23 +16,6 @@ --wa-color-warning-10: var(--wa-color-blue-10); --wa-color-warning-05: var(--wa-color-blue-05); --wa-color-warning: var(--wa-color-blue); - - --wa-color-warning-lt-50: var(--wa-color-blue-lt-50); - --wa-color-warning-gte-50: var(--wa-color-blue-gte-50); - - --wa-color-warning-lt-60: var(--wa-color-blue-lt-60); - --wa-color-warning-gte-60: var(--wa-color-blue-gte-60); - - --wa-color-warning-lt-70: var(--wa-color-blue-lt-70); - --wa-color-warning-gte-70: var(--wa-color-blue-gte-70); - - --wa-color-warning-max-50: var(--wa-color-blue-max-50); - --wa-color-warning-min-50: var(--wa-color-blue-min-50); - --wa-color-warning-max-60: var(--wa-color-blue-max-60); - --wa-color-warning-min-60: var(--wa-color-blue-min-60); - --wa-color-warning-max-70: var(--wa-color-blue-max-70); - --wa-color-warning-min-70: var(--wa-color-blue-min-70); - --wa-color-warning-on: var(--wa-color-blue-on); } } diff --git a/packages/webawesome/src/styles/warning/cyan.css b/packages/webawesome/src/styles/warning/cyan.css index 8a7cad6c3..e64ca2c8f 100644 --- a/packages/webawesome/src/styles/warning/cyan.css +++ b/packages/webawesome/src/styles/warning/cyan.css @@ -16,23 +16,6 @@ --wa-color-warning-10: var(--wa-color-cyan-10); --wa-color-warning-05: var(--wa-color-cyan-05); --wa-color-warning: var(--wa-color-cyan); - - --wa-color-warning-lt-50: var(--wa-color-cyan-lt-50); - --wa-color-warning-gte-50: var(--wa-color-cyan-gte-50); - - --wa-color-warning-lt-60: var(--wa-color-cyan-lt-60); - --wa-color-warning-gte-60: var(--wa-color-cyan-gte-60); - - --wa-color-warning-lt-70: var(--wa-color-cyan-lt-70); - --wa-color-warning-gte-70: var(--wa-color-cyan-gte-70); - - --wa-color-warning-max-50: var(--wa-color-cyan-max-50); - --wa-color-warning-min-50: var(--wa-color-cyan-min-50); - --wa-color-warning-max-60: var(--wa-color-cyan-max-60); - --wa-color-warning-min-60: var(--wa-color-cyan-min-60); - --wa-color-warning-max-70: var(--wa-color-cyan-max-70); - --wa-color-warning-min-70: var(--wa-color-cyan-min-70); - --wa-color-warning-on: var(--wa-color-cyan-on); } } diff --git a/packages/webawesome/src/styles/warning/gray.css b/packages/webawesome/src/styles/warning/gray.css index fb6eb9f8f..8b107208c 100644 --- a/packages/webawesome/src/styles/warning/gray.css +++ b/packages/webawesome/src/styles/warning/gray.css @@ -16,23 +16,6 @@ --wa-color-warning-10: var(--wa-color-gray-10); --wa-color-warning-05: var(--wa-color-gray-05); --wa-color-warning: var(--wa-color-gray); - - --wa-color-warning-lt-50: var(--wa-color-gray-lt-50); - --wa-color-warning-gte-50: var(--wa-color-gray-gte-50); - - --wa-color-warning-lt-60: var(--wa-color-gray-lt-60); - --wa-color-warning-gte-60: var(--wa-color-gray-gte-60); - - --wa-color-warning-lt-70: var(--wa-color-gray-lt-70); - --wa-color-warning-gte-70: var(--wa-color-gray-gte-70); - - --wa-color-warning-max-50: var(--wa-color-gray-max-50); - --wa-color-warning-min-50: var(--wa-color-gray-min-50); - --wa-color-warning-max-60: var(--wa-color-gray-max-60); - --wa-color-warning-min-60: var(--wa-color-gray-min-60); - --wa-color-warning-max-70: var(--wa-color-gray-max-70); - --wa-color-warning-min-70: var(--wa-color-gray-min-70); - --wa-color-warning-on: var(--wa-color-gray-on); } } diff --git a/packages/webawesome/src/styles/warning/green.css b/packages/webawesome/src/styles/warning/green.css index fb97ca486..dff797d28 100644 --- a/packages/webawesome/src/styles/warning/green.css +++ b/packages/webawesome/src/styles/warning/green.css @@ -16,23 +16,6 @@ --wa-color-warning-10: var(--wa-color-green-10); --wa-color-warning-05: var(--wa-color-green-05); --wa-color-warning: var(--wa-color-green); - - --wa-color-warning-lt-50: var(--wa-color-green-lt-50); - --wa-color-warning-gte-50: var(--wa-color-green-gte-50); - - --wa-color-warning-lt-60: var(--wa-color-green-lt-60); - --wa-color-warning-gte-60: var(--wa-color-green-gte-60); - - --wa-color-warning-lt-70: var(--wa-color-green-lt-70); - --wa-color-warning-gte-70: var(--wa-color-green-gte-70); - - --wa-color-warning-max-50: var(--wa-color-green-max-50); - --wa-color-warning-min-50: var(--wa-color-green-min-50); - --wa-color-warning-max-60: var(--wa-color-green-max-60); - --wa-color-warning-min-60: var(--wa-color-green-min-60); - --wa-color-warning-max-70: var(--wa-color-green-max-70); - --wa-color-warning-min-70: var(--wa-color-green-min-70); - --wa-color-warning-on: var(--wa-color-green-on); } } diff --git a/packages/webawesome/src/styles/warning/indigo.css b/packages/webawesome/src/styles/warning/indigo.css index 05675d30d..03b1ea76c 100644 --- a/packages/webawesome/src/styles/warning/indigo.css +++ b/packages/webawesome/src/styles/warning/indigo.css @@ -16,23 +16,6 @@ --wa-color-warning-10: var(--wa-color-indigo-10); --wa-color-warning-05: var(--wa-color-indigo-05); --wa-color-warning: var(--wa-color-indigo); - - --wa-color-warning-lt-50: var(--wa-color-indigo-lt-50); - --wa-color-warning-gte-50: var(--wa-color-indigo-gte-50); - - --wa-color-warning-lt-60: var(--wa-color-indigo-lt-60); - --wa-color-warning-gte-60: var(--wa-color-indigo-gte-60); - - --wa-color-warning-lt-70: var(--wa-color-indigo-lt-70); - --wa-color-warning-gte-70: var(--wa-color-indigo-gte-70); - - --wa-color-warning-max-50: var(--wa-color-indigo-max-50); - --wa-color-warning-min-50: var(--wa-color-indigo-min-50); - --wa-color-warning-max-60: var(--wa-color-indigo-max-60); - --wa-color-warning-min-60: var(--wa-color-indigo-min-60); - --wa-color-warning-max-70: var(--wa-color-indigo-max-70); - --wa-color-warning-min-70: var(--wa-color-indigo-min-70); - --wa-color-warning-on: var(--wa-color-indigo-on); } } diff --git a/packages/webawesome/src/styles/warning/orange.css b/packages/webawesome/src/styles/warning/orange.css index 67b02de30..aa3559f3c 100644 --- a/packages/webawesome/src/styles/warning/orange.css +++ b/packages/webawesome/src/styles/warning/orange.css @@ -16,23 +16,6 @@ --wa-color-warning-10: var(--wa-color-orange-10); --wa-color-warning-05: var(--wa-color-orange-05); --wa-color-warning: var(--wa-color-orange); - - --wa-color-warning-lt-50: var(--wa-color-orange-lt-50); - --wa-color-warning-gte-50: var(--wa-color-orange-gte-50); - - --wa-color-warning-lt-60: var(--wa-color-orange-lt-60); - --wa-color-warning-gte-60: var(--wa-color-orange-gte-60); - - --wa-color-warning-lt-70: var(--wa-color-orange-lt-70); - --wa-color-warning-gte-70: var(--wa-color-orange-gte-70); - - --wa-color-warning-max-50: var(--wa-color-orange-max-50); - --wa-color-warning-min-50: var(--wa-color-orange-min-50); - --wa-color-warning-max-60: var(--wa-color-orange-max-60); - --wa-color-warning-min-60: var(--wa-color-orange-min-60); - --wa-color-warning-max-70: var(--wa-color-orange-max-70); - --wa-color-warning-min-70: var(--wa-color-orange-min-70); - --wa-color-warning-on: var(--wa-color-orange-on); } } diff --git a/packages/webawesome/src/styles/warning/pink.css b/packages/webawesome/src/styles/warning/pink.css index bf5a0f0d3..d7db398bc 100644 --- a/packages/webawesome/src/styles/warning/pink.css +++ b/packages/webawesome/src/styles/warning/pink.css @@ -16,23 +16,6 @@ --wa-color-warning-10: var(--wa-color-pink-10); --wa-color-warning-05: var(--wa-color-pink-05); --wa-color-warning: var(--wa-color-pink); - - --wa-color-warning-lt-50: var(--wa-color-pink-lt-50); - --wa-color-warning-gte-50: var(--wa-color-pink-gte-50); - - --wa-color-warning-lt-60: var(--wa-color-pink-lt-60); - --wa-color-warning-gte-60: var(--wa-color-pink-gte-60); - - --wa-color-warning-lt-70: var(--wa-color-pink-lt-70); - --wa-color-warning-gte-70: var(--wa-color-pink-gte-70); - - --wa-color-warning-max-50: var(--wa-color-pink-max-50); - --wa-color-warning-min-50: var(--wa-color-pink-min-50); - --wa-color-warning-max-60: var(--wa-color-pink-max-60); - --wa-color-warning-min-60: var(--wa-color-pink-min-60); - --wa-color-warning-max-70: var(--wa-color-pink-max-70); - --wa-color-warning-min-70: var(--wa-color-pink-min-70); - --wa-color-warning-on: var(--wa-color-pink-on); } } diff --git a/packages/webawesome/src/styles/warning/purple.css b/packages/webawesome/src/styles/warning/purple.css index 705790f34..ec9fba8d8 100644 --- a/packages/webawesome/src/styles/warning/purple.css +++ b/packages/webawesome/src/styles/warning/purple.css @@ -16,23 +16,6 @@ --wa-color-warning-10: var(--wa-color-purple-10); --wa-color-warning-05: var(--wa-color-purple-05); --wa-color-warning: var(--wa-color-purple); - - --wa-color-warning-lt-50: var(--wa-color-purple-lt-50); - --wa-color-warning-gte-50: var(--wa-color-purple-gte-50); - - --wa-color-warning-lt-60: var(--wa-color-purple-lt-60); - --wa-color-warning-gte-60: var(--wa-color-purple-gte-60); - - --wa-color-warning-lt-70: var(--wa-color-purple-lt-70); - --wa-color-warning-gte-70: var(--wa-color-purple-gte-70); - - --wa-color-warning-max-50: var(--wa-color-purple-max-50); - --wa-color-warning-min-50: var(--wa-color-purple-min-50); - --wa-color-warning-max-60: var(--wa-color-purple-max-60); - --wa-color-warning-min-60: var(--wa-color-purple-min-60); - --wa-color-warning-max-70: var(--wa-color-purple-max-70); - --wa-color-warning-min-70: var(--wa-color-purple-min-70); - --wa-color-warning-on: var(--wa-color-purple-on); } } diff --git a/packages/webawesome/src/styles/warning/red.css b/packages/webawesome/src/styles/warning/red.css index a825527af..934477ac0 100644 --- a/packages/webawesome/src/styles/warning/red.css +++ b/packages/webawesome/src/styles/warning/red.css @@ -16,23 +16,6 @@ --wa-color-warning-10: var(--wa-color-red-10); --wa-color-warning-05: var(--wa-color-red-05); --wa-color-warning: var(--wa-color-red); - - --wa-color-warning-lt-50: var(--wa-color-red-lt-50); - --wa-color-warning-gte-50: var(--wa-color-red-gte-50); - - --wa-color-warning-lt-60: var(--wa-color-red-lt-60); - --wa-color-warning-gte-60: var(--wa-color-red-gte-60); - - --wa-color-warning-lt-70: var(--wa-color-red-lt-70); - --wa-color-warning-gte-70: var(--wa-color-red-gte-70); - - --wa-color-warning-max-50: var(--wa-color-red-max-50); - --wa-color-warning-min-50: var(--wa-color-red-min-50); - --wa-color-warning-max-60: var(--wa-color-red-max-60); - --wa-color-warning-min-60: var(--wa-color-red-min-60); - --wa-color-warning-max-70: var(--wa-color-red-max-70); - --wa-color-warning-min-70: var(--wa-color-red-min-70); - --wa-color-warning-on: var(--wa-color-red-on); } } diff --git a/packages/webawesome/src/styles/warning/yellow.css b/packages/webawesome/src/styles/warning/yellow.css index 308a7ac3f..3cbe9d762 100644 --- a/packages/webawesome/src/styles/warning/yellow.css +++ b/packages/webawesome/src/styles/warning/yellow.css @@ -16,23 +16,6 @@ --wa-color-warning-10: var(--wa-color-yellow-10); --wa-color-warning-05: var(--wa-color-yellow-05); --wa-color-warning: var(--wa-color-yellow); - - --wa-color-warning-lt-50: var(--wa-color-yellow-lt-50); - --wa-color-warning-gte-50: var(--wa-color-yellow-gte-50); - - --wa-color-warning-lt-60: var(--wa-color-yellow-lt-60); - --wa-color-warning-gte-60: var(--wa-color-yellow-gte-60); - - --wa-color-warning-lt-70: var(--wa-color-yellow-lt-70); - --wa-color-warning-gte-70: var(--wa-color-yellow-gte-70); - - --wa-color-warning-max-50: var(--wa-color-yellow-max-50); - --wa-color-warning-min-50: var(--wa-color-yellow-min-50); - --wa-color-warning-max-60: var(--wa-color-yellow-max-60); - --wa-color-warning-min-60: var(--wa-color-yellow-min-60); - --wa-color-warning-max-70: var(--wa-color-yellow-max-70); - --wa-color-warning-min-70: var(--wa-color-yellow-min-70); - --wa-color-warning-on: var(--wa-color-yellow-on); } }