mirror of
https://github.com/GSA/notifications-admin.git
synced 2026-09-10 10:03:21 -04:00
f692d876f3
The content of the GOV.UK Frontend header component is `position: relative`. This changed the [default z-index stacking](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Positioning/Understanding_z_index/Stacking_without_z-index_ so it was above `<main>`. This aligns `<main>` with the header, meaning `<main>` appears above it due to being below it in the document.
21 lines
653 B
SCSS
21 lines
653 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;
|
|
}
|