Merge pull request #11757 from dacook/buu-disabled-button

[BUU] Grey out disabled button
This commit is contained in:
Maikel
2023-11-08 13:48:23 +11:00
committed by GitHub
2 changed files with 14 additions and 1 deletions

View File

@@ -1,3 +1,13 @@
@mixin disabled-button() {
&:disabled,
&:disabled:hover {
cursor: initial;
color: $color-btn-disabled-text;
background-color: $color-btn-disabled-bg;
border-color: transparent;
}
}
input[type="submit"],
input[type="reset"],
input[type="button"]:not(.trix-button),
@@ -15,6 +25,7 @@ button:not(.plain):not(.trix-button),
line-height: $btn-regular-height - 2px; // remove 2px to compensate for border
height: $btn-regular-height;
font-weight: bold;
@include disabled-button();
&:before {
font-weight: normal !important;
@@ -100,6 +111,7 @@ button:not(.plain):not(.trix-button),
&.red {
background-color: $color-btn-red-bg;
border-color: $color-btn-red-bg;
@include disabled-button(); // required for specifity
&:hover {
background-color: $color-btn-red-hover-bg;

View File

@@ -44,7 +44,8 @@ $color-btn-shadow: 0px 1px 0px rgba(0, 0, 0, 0.05), 0px 2px 2px rg
$color-btn-hover-bg: $orient !default;
$color-btn-hover-text: $white !default;
$color-btn-hover-border: $dark-blue !default;
$color-btn-disabled-bg: $light-grey !default;
$color-btn-disabled-bg: $medium-grey !default;
$color-btn-disabled-text: $lighter-grey !default;
$color-btn-red-bg: $red !default;
$color-btn-red-hover-bg: $roof-terracotta !default;