tokens: use --#{$prefix}color-opacity-transparent instead of --#{$pre…

…fix}color-opacity-invisible-black and --#{$prefix}color-content-on-status-emphasized-alt instead of --#{$prefix}color-content-on-action-negative
Orange-OpenSource · Jan 6, 2025 · 5f8c6b6 · 5f8c6b6
1 parent 5ced58d
commit 5f8c6b6
Showing 1 changed file with 17 additions and 17 deletions.
diff --git a/scss/_buttons.scss b/scss/_buttons.scss
@@ -228,13 +228,13 @@
     &.btn-strong {
       --#{$prefix}btn-color: var(--#{$prefix}color-content-on-action-loading);
       --#{$prefix}btn-bg: var(--#{$prefix}color-action-loading);
-      --#{$prefix}btn-border-color: var(--#{$prefix}color-opacity-invisible-black);
+      --#{$prefix}btn-border-color: var(--#{$prefix}color-opacity-transparent);
     }
 
     &.btn-negative {
-      --#{$prefix}btn-color: var(--#{$prefix}color-content-on-action-negative);
+      --#{$prefix}btn-color: var(--#{$prefix}color-content-on-status-emphasized-alt);
       --#{$prefix}btn-bg: var(--#{$prefix}color-action-negative-loading);
-      --#{$prefix}btn-border-color: var(--#{$prefix}color-opacity-invisible-black);
+      --#{$prefix}btn-border-color: var(--#{$prefix}color-opacity-transparent);
     }
 
     &.btn-default-on-colored-bg {
@@ -330,21 +330,21 @@
   --#{$prefix}btn-interaction-border-width: #{$ouds-border-width-none};
   @include button-variant(
     var(--#{$prefix}color-action-enabled),
-    var(--#{$prefix}color-opacity-invisible-black),
+    var(--#{$prefix}color-opacity-transparent),
     var(--#{$prefix}color-content-on-action-enabled),
     var(--#{$prefix}color-action-hover),
-    var(--#{$prefix}color-opacity-invisible-black),
+    var(--#{$prefix}color-opacity-transparent),
     var(--#{$prefix}color-content-on-action-hover),
     var(--#{$prefix}color-action-pressed),
-    var(--#{$prefix}color-opacity-invisible-black),
+    var(--#{$prefix}color-opacity-transparent),
     var(--#{$prefix}color-content-on-action-pressed),
     var(--#{$prefix}color-action-disabled),
-    var(--#{$prefix}color-opacity-invisible-black),
+    var(--#{$prefix}color-opacity-transparent),
     var(--#{$prefix}color-content-on-action-disabled)
   );
   @include button-variant-focus(
     var(--#{$prefix}color-action-focus),
-    var(--#{$prefix}color-opacity-invisible-black),
+    var(--#{$prefix}color-opacity-transparent),
     var(--#{$prefix}color-content-on-action-focus)
   );
 }
@@ -354,22 +354,22 @@
   --#{$prefix}btn-interaction-border-width: #{$ouds-border-width-none};
   @include button-variant(
     var(--#{$prefix}color-action-negative-enabled),
-    var(--#{$prefix}color-opacity-invisible-black),
-    var(--#{$prefix}color-content-on-action-negative),
+    var(--#{$prefix}color-opacity-transparent),
+    var(--#{$prefix}color-content-on-status-emphasized-alt),
     var(--#{$prefix}color-action-negative-hover),
-    var(--#{$prefix}color-opacity-invisible-black),
-    var(--#{$prefix}color-content-on-action-negative),
+    var(--#{$prefix}color-opacity-transparent),
+    var(--#{$prefix}color-content-on-status-emphasized-alt),
     var(--#{$prefix}color-action-negative-pressed),
-    var(--#{$prefix}color-opacity-invisible-black),
-    var(--#{$prefix}color-content-on-action-negative),
+    var(--#{$prefix}color-opacity-transparent),
+    var(--#{$prefix}color-content-on-status-emphasized-alt),
     var(--#{$prefix}color-action-disabled),
-    var(--#{$prefix}color-opacity-invisible-black),
+    var(--#{$prefix}color-opacity-transparent),
     var(--#{$prefix}color-content-on-action-disabled)
   );
   @include button-variant-focus(
     var(--#{$prefix}color-action-negative-focus),
-    var(--#{$prefix}color-opacity-invisible-black),
-    var(--#{$prefix}color-content-on-action-negative)
+    var(--#{$prefix}color-opacity-transparent),
+    var(--#{$prefix}color-content-on-status-emphasized-alt)
   );
 }