From e52a20c8af8493695ddc5029dda89332941f6b4c Mon Sep 17 00:00:00 2001 From: Andrew Duthie Date: Tue, 16 Aug 2022 07:55:38 -0400 Subject: [PATCH] Limit active disabled button styles to default button (#6744) * Remove upstream-patched disabled button styling See: https://github.com/uswds/uswds/pull/4077 * Limit active disabled button styles to default button **Why**: Because the styling was only implemented with the expectation of use with the default button, and conflicts with other button states (e.g. unstyled buttons used as the submit buttons on some forms). Previously: #6564 changelog: Improvements, Forms, Use pressed state appearance for buttons disabled on form submission --- app/assets/stylesheets/components/_btn.scss | 16 +++------------- 1 file changed, 3 insertions(+), 13 deletions(-) diff --git a/app/assets/stylesheets/components/_btn.scss b/app/assets/stylesheets/components/_btn.scss index 5902fb88bd0..ef7815d1b7c 100644 --- a/app/assets/stylesheets/components/_btn.scss +++ b/app/assets/stylesheets/components/_btn.scss @@ -10,21 +10,11 @@ // of a link. display: inline; width: auto; - - // Temporary: To be backported to design system. Unstyled buttons should not ever show the default - // opaque disabled background color. Typically a button would not be both disabled and active, but - // it is possible in some browsers when e.g. disabling a button in response to its own click. - &.usa-button:disabled:hover, - &.usa-button:disabled.usa-button--hover, - &.usa-button:disabled:active, - &.usa-button:disabled.usa-button--active, - &.usa-button:disabled:focus, - &.usa-button:disabled.usa-focus { - background-color: transparent; - } } .usa-button:disabled.usa-button--active, .usa-button--disabled.usa-button--active { - @include set-text-and-bg('primary-darker', $context: 'Button'); + &:not(.usa-button--unstyled, .usa-button--secondary, .usa-button--accent-cool, .usa-button--accent-warm, .usa-button--base, .usa-button--outline, .usa-button--inverse) { + @include set-text-and-bg('primary-darker', $context: 'Button'); + } }