fix(button): explicitly set width for expressive theme

carbon-design-system · May 13, 2021 · 59447a4 · 59447a4
1 parent eff0724
commit 59447a4
Showing 1 changed file with 6 additions and 5 deletions.
diff --git a/packages/components/src/components/button/_button.scss b/packages/components/src/components/button/_button.scss
@@ -457,6 +457,10 @@
     height: rem(20px);
   }
 
+  .#{$prefix}--btn-set .#{$prefix}--btn.#{$prefix}--btn--expressive {
+    max-width: rem(320px);
+  }
+
   // Skeleton State
   .#{$prefix}--btn.#{$prefix}--skeleton {
     @include skeleton;
@@ -475,6 +479,8 @@
 
   .#{$prefix}--btn-set .#{$prefix}--btn {
     width: 100%;
+    // 196px from design kit
+    max-width: rem(196px);
 
     &:not(:focus) {
       box-shadow: rem(-1px) 0 0 0 $button-separator;
@@ -485,11 +491,6 @@
     }
   }
 
-  .#{$prefix}--btn-set .#{$prefix}--btn:not(.#{$prefix}--btn--expressive) {
-    // 196px from design kit
-    max-width: rem(196px);
-  }
-
   .#{$prefix}--btn-set .#{$prefix}--btn:focus + .#{$prefix}--btn {
     box-shadow: inherit;
   }