Adding secondary action to color tokens (#2324)

Co-authored-by: Nida Ghuman <nidaqg@gmail.com>
powerhome · Mar 3, 2023 · 17061f5 · 17061f5
1 parent c20268d
commit 17061f5
Show file tree

Hide file tree

Showing 3 changed files with 5 additions and 3 deletions.
diff --git a/playbook/app/pb_kits/playbook/pb_button/_button_mixins.scss b/playbook/app/pb_kits/playbook/pb_button/_button_mixins.scss
@@ -101,15 +101,15 @@ $pb_button_border_width: 0px;
 
 // Secondary ====================
 @mixin pb_button_secondary {
-  @include pb_button_variant(rgba($primary_action, 0.05), $primary_action);
+  @include pb_button_variant($secondary-action, $primary_action);
 
   @media (hover:hover) {
     &:hover {
       @include pb_button_hover(rgba($primary_action, $opacity_3));
     }
     &:active {
       transition: none;
-      @include pb_button_variant(rgba($primary_action, 0.05), $primary_action);
+      @include pb_button_variant($secondary-action, $primary_action);
     }
   } 
 }

diff --git a/playbook/app/pb_kits/playbook/pb_circle_icon_button/_circle_icon_button.scss b/playbook/app/pb_kits/playbook/pb_circle_icon_button/_circle_icon_button.scss
@@ -26,7 +26,7 @@ $pb_button_styles: [
 @mixin pb_circle_icon_button_active {
   &:active {
     transition: none;
-    @include pb_button_variant(rgba($primary_action, 0.05), $primary_action);
+    @include pb_button_variant($secondary-action, $primary_action);
   }
 }
 

diff --git a/playbook/app/pb_kits/playbook/tokens/_colors.scss b/playbook/app/pb_kits/playbook/tokens/_colors.scss
@@ -75,6 +75,8 @@ $card_colors: (
 );
 
 $primary-action:      $primary !default;
+$secondary-action:    rgba($primary_action, 0.05) !default;
+
 $action_colors: (
   primary_action:            $primary-action
 );