mirror of
https://github.com/GSA/notifications-admin.git
synced 2026-09-09 08:39:49 -04:00
6957a95121
GOV.UK Frontend gives `<main>` different padding on the top and bottom to us. This adds our spacing to `<main>` for pages without a side nav (except the product page which is special) and to the row containing the `<main>` and side nav sections on pages that have a side nav.
31 lines
956 B
SCSS
31 lines
956 B
SCSS
// Overrides for certain GOV.UK Frontend styles to make its components match this application's design
|
|
|
|
// Notify's header navigation aligns to the right
|
|
.govuk-header__navigation {
|
|
text-align: right;
|
|
|
|
// reset the alignment of each item to left-to-right
|
|
.govuk-header__navigation-item {
|
|
text-align: left;
|
|
}
|
|
|
|
}
|
|
|
|
// The GOV.UK Frontend header component wraps content that is `position: relative`
|
|
// This changes its z-index position, putting it above the `<main>` section
|
|
// We need the `<main>` section to be above it, like the default order, to hide the theme colour
|
|
// bar on full-width pages
|
|
.govuk-main-wrapper {
|
|
position: relative;
|
|
}
|
|
|
|
// Additional padding-bottom override, following the GOV.UK Frontend spacing scale:
|
|
// https://design-system.service.gov.uk/styles/spacing/#the-responsive-spacing-scale
|
|
.govuk-\!-padding-bottom-12 {
|
|
padding-bottom: 70px;
|
|
|
|
@include govuk-media-query($from: tablet) {
|
|
padding-bottom: 90px;
|
|
}
|
|
}
|