Skip to content

Commit

Permalink
Consolidate unstyled font smoothing styles
Browse files Browse the repository at this point in the history
**Why**:

- Account for missing `usa-button--unstyled:hover` and `usa-button--unstyled:active`
- Single point to remove in the future, as noted in the preceding comment
  • Loading branch information
aduth committed Apr 28, 2021
1 parent 4226b82 commit 0d3d222
Show file tree
Hide file tree
Showing 2 changed files with 11 additions and 4 deletions.
1 change: 1 addition & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@
- Fix rounded corners on sidebar current page item.
- Fix unintentional rounded corners on search text field.
- Fix utility classes not always applying as expected when applied to components. For example, using `margin-` utility classes on an unstyled button would previously unexpectedly conflict with and not take precedent over the button's own margins.
- Fix all instances of font weight appearance of unstyled buttons in content which applies anti-aliased font smoothing. Previous bug fix attempts had still missed default `:hover` and `:active` states.

## 5.0.3

Expand Down
14 changes: 10 additions & 4 deletions src/scss/components/_buttons.scss
Original file line number Diff line number Diff line change
Expand Up @@ -26,8 +26,16 @@ $button-stroke-big: inset 0 0 0 units($theme-button-stroke-width * 2);
// reset, these styles could be safely removed.
//
// See: https://github.com/uswds/uswds/pull/4115
-moz-osx-font-smoothing: inherit;
-webkit-font-smoothing: inherit;
&,
&:hover,
&.usa-button--hover,
&:active,
&.usa-button--active,
&:disabled,
&.usa-button--disabled {
-moz-osx-font-smoothing: inherit;
-webkit-font-smoothing: inherit;
}

// USWDS currently only sets hover and active unstyled button styles for the browser-native
// states, and not with the modifier classes. It also does not apply these styles to the disabled
Expand All @@ -39,8 +47,6 @@ $button-stroke-big: inset 0 0 0 units($theme-button-stroke-width * 2);
&.usa-button--active,
&:disabled,
&.usa-button--disabled {
-moz-osx-font-smoothing: inherit;
-webkit-font-smoothing: inherit;
background-color: transparent;
box-shadow: none;
text-decoration: underline;
Expand Down

0 comments on commit 0d3d222

Please sign in to comment.