Easier disabled state customization for button variants (#30639)

* feat(buttons): easier disabled state customization

* docs(migration): mention new arguments for disabled state in button-variant()

* Update migration.md

Co-authored-by: XhmikosR <xhmikosr@gmail.com>
Co-authored-by: Mark Otto <markd.otto@gmail.com>

scss/mixins/_buttons.scss

@@ -12,7 +12,10 @@
   $hover-color: color-contrast($hover-background),
   $active-background: darken($background, 10%),
   $active-border: darken($border, 12.5%),
-  $active-color: color-contrast($active-background)
+  $active-color: color-contrast($active-background),
+  $disabled-background: $background,
+  $disabled-border: $border,
+  $disabled-color: color-contrast($disabled-background)
 ) {
   color: $color;
   @include gradient-bg($background);
@@ -61,11 +64,11 @@
 
   &:disabled,
   &.disabled {
-    color: $color;
-    background-color: $background;
+    color: $disabled-color;
+    background-color: $disabled-background;
     // Remove CSS gradients if they're enabled
     background-image: if($enable-gradients, none, null);
-    border-color: $border;
+    border-color: $disabled-border;
   }
 }
 

site/content/docs/5.0/migration.md

@@ -16,6 +16,10 @@ toc: true
 
 ### Components
 
+#### Buttons
+
+- Disabled states of buttons are easier to customize thanks to additional arguments in the `button-variant()` mixin. [See #30639.](https://github.com/twbs/bootstrap/pull/30639)
+
 #### Popovers
 
 - Renamed `whiteList` option to `allowList`