Skip to content

Commit

Permalink
Remove explicitly set line-height values
Browse files Browse the repository at this point in the history
We were explicitly setting line-heights on the button and the toggle - normally the
govuk-font mixin will do this for us and will choose a line-height value appropriate to
the font size.

We were seeing an issue with the focus state on smaller screens where there was
a thin black line between lines. See #2322
 for more detail.

This commit removes the explicitly set line-height so that the focus state displays as
expected.
  • Loading branch information
Vanita Barrett authored and hannalaakso committed Oct 13, 2021
1 parent c7189db commit 57718a0
Showing 1 changed file with 4 additions and 3 deletions.
7 changes: 4 additions & 3 deletions src/govuk/components/accordion/_index.scss
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@
// Buttons within the sections don’t need default styling
.govuk-accordion__section-button {
@include govuk-text-colour;
@include govuk-font($size: 24, $weight: bold, $line-height: 1.25);
@include govuk-font($size: 24, $weight: bold);
display: block;
margin-bottom: 0;
padding-top: govuk-spacing(3);
Expand Down Expand Up @@ -202,6 +202,7 @@
border: 0;

border-top: $govuk-accordion-bottom-border-width solid $govuk-border-colour;

// Visually separate the section from the one underneath when user changes colours in their
// browser.
border-bottom: govuk-spacing(2) solid transparent;
Expand Down Expand Up @@ -311,15 +312,15 @@

// Add toggle link with Chevron icon on left.
.govuk-accordion__section-toggle {
@include govuk-font($size: 19, $line-height: 1);
@include govuk-font($size: 19);
color: $govuk-link-colour;
}

// The NVDA fix means a display:inline element cannot receive box model spacing styling such as margin.
// As a result this is applied to the pseudo element that has a display:block property to maintain Design
.govuk-accordion__section-summary:before,
.govuk-accordion__section-toggle:before {
@include govuk-responsive-margin(1, "top");
margin-top: 8px;
}

// Space between icon and text,
Expand Down

0 comments on commit 57718a0

Please sign in to comment.