mirror of
https://github.com/GSA/notifications-admin.git
synced 2026-09-11 18:37:33 -04:00
Updates, and hacks, based on the changes in: https://github.com/alphagov/govuk-frontend/pull/1309/files
57 lines
1.4 KiB
SCSS
57 lines
1.4 KiB
SCSS
// Sass bringing in the new focus style from GOVUK Frontend 3.x.x
|
|
// TO DO: Delete this file when we upgrade to GOVUK Frontend 3.x.x
|
|
//
|
|
// See the following for details of the update:
|
|
// - https://designnotes.blog.gov.uk/2019/07/29/weve-made-the-gov-uk-design-system-more-accessible/
|
|
// - https://design-system.service.gov.uk/get-started/focus-states/
|
|
// - https://github.com/alphagov/govuk-frontend/releases/tag/v3.0.0
|
|
//
|
|
// These styles were added in https://github.com/alphagov/govuk-frontend/pull/1309
|
|
|
|
// Updates to skip-link component
|
|
.govuk-skip-link {
|
|
@include govuk-typography-common;
|
|
@include govuk-focusable-fill;
|
|
}
|
|
|
|
// Updates to header component
|
|
.govuk-header__link {
|
|
@include govuk-focusable-text-link;
|
|
}
|
|
|
|
.govuk-header__link--homepage {
|
|
// Remove any borders that show when focused and hovered.
|
|
&:focus {
|
|
border-bottom: 0;
|
|
}
|
|
}
|
|
|
|
// Updates to back-link component
|
|
.govuk-back-link {
|
|
@include govuk-focusable-text-link;
|
|
|
|
// When the back link is focused, hide the bottom link border as the
|
|
// focus styles has a bottom border.
|
|
&:focus {
|
|
border-bottom-color: transparent;
|
|
}
|
|
}
|
|
|
|
// Updates to details component
|
|
.govuk-details__summary {
|
|
&:hover {
|
|
color: $govuk-link-hover-colour;
|
|
}
|
|
|
|
@include govuk-focusable-text-link;
|
|
}
|
|
|
|
// Remove the underline when focussed to avoid duplicate borders
|
|
.govuk-details__summary:focus .govuk-details__summary-text {
|
|
text-decoration: none;
|
|
}
|
|
|
|
.govuk-details__summary:before {
|
|
top: 0;
|
|
}
|