Skip to content

Commit

Permalink
LG-6485: Update line height value for accordion component (#316)
Browse files Browse the repository at this point in the history
* LGDS: Update line height value for accordion component

**Why**: To improve readability when the accordion heading spans multiple lines of text.

* Sync banner accordion button to text

Decrease from 1.5 to 1.2 to match

See: #316 (comment)
  • Loading branch information
aduth authored Jun 3, 2022
1 parent 51b803e commit 4296481
Show file tree
Hide file tree
Showing 3 changed files with 8 additions and 0 deletions.
6 changes: 6 additions & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
@@ -1,3 +1,9 @@
## Unreleased

### Improvements

- Increase line-height for accordion heading content to improve readability. ([#316](https://github.com/18F/identity-style-guide/pull/316))

## 6.4.2

### Dependencies
Expand Down
1 change: 1 addition & 0 deletions src/scss/components/_accordions.scss
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@
background-color: color('transparent');
background-size: units(2);
color: color('primary');
line-height: line-height($theme-body-font-family, $theme-body-line-height);

&:hover {
background-color: color('primary-lightest');
Expand Down
1 change: 1 addition & 0 deletions src/scss/components/_banner.scss
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,7 @@
// Reset default accordion button border styling for banner button.
@include u-border(0);
@include u-radius(0);
line-height: line-height($theme-banner-font-family, 2);
}

.usa-accordion__button.usa-banner__button,
Expand Down

0 comments on commit 4296481

Please sign in to comment.