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'] %}
-
-
-
-
- |
- Core tint |
- {% for tint in tints -%}
- {{ tint }} |
- {%- endfor %}
-
-
-{% for hue in hues -%}
-
- | {{ hue | capitalize }} |
-
-
- {{ palettes[paletteId][hue].maxChromaTint }}
-
-
- |
- {% for tint in tints -%}
-
-
-
-
- |
- {%- endfor -%}
-
-{%- endfor %}
-
-
-
\ 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);
}
}