mirror of
https://github.com/GSA/notifications-admin.git
synced 2026-07-19 05:53:51 -04:00
Works similarly to the delete template flow, because it’s a destructive, one-way action. Not on the edit template page, because it’s not something you want to be considering every time you’re editing a template. And we saw that people couldn’t find the delete button when it was on this page. Adds a bit more CSS for the `dangerous` banner type, because the content here is quite complicated. Breaking it into a list helps, but the spacing didn’t look right, so needed some tweaking. Can ship independently of the code that shows the redaction, but needs the API first.
259 lines
3.0 KiB
SCSS
259 lines
3.0 KiB
SCSS
// Extra CSS overlaying elements
|
|
|
|
#global-header-bar {
|
|
background-color: $govuk-blue;
|
|
}
|
|
|
|
#global-header,
|
|
#global-header.with-proposition {
|
|
|
|
#logo {
|
|
|
|
white-space: nowrap;
|
|
|
|
#product-name {
|
|
font-size: 24px;
|
|
font-weight: 400;
|
|
padding-left: 5px;
|
|
}
|
|
|
|
}
|
|
|
|
.header-wrapper {
|
|
.header-global {
|
|
.header-logo {
|
|
|
|
@include media(desktop) {
|
|
width: auto;
|
|
}
|
|
|
|
&:after {
|
|
display: none;
|
|
}
|
|
|
|
}
|
|
}
|
|
}
|
|
|
|
.header-proposition {
|
|
#proposition-links {
|
|
li {
|
|
padding: 0 0 0 15px;
|
|
}
|
|
}
|
|
}
|
|
|
|
}
|
|
|
|
.beta-badge {
|
|
@include phase-tag();
|
|
margin: 10px 0 0 0;
|
|
}
|
|
|
|
|
|
@include media(desktop) {
|
|
#proposition-menu {
|
|
float: right;
|
|
}
|
|
}
|
|
|
|
a {
|
|
&:visited {
|
|
color: $link-colour;
|
|
}
|
|
}
|
|
|
|
.form-control-1-1 {
|
|
width: 100%;
|
|
}
|
|
|
|
.form-control-5em {
|
|
|
|
width: 100%;
|
|
|
|
@include media(tablet) {
|
|
width: 5em;
|
|
}
|
|
|
|
}
|
|
|
|
.column-main {
|
|
|
|
.heading-large,
|
|
> .heading-medium {
|
|
margin: 10px 0 15px 0;
|
|
}
|
|
|
|
> .grid-row:first-child {
|
|
|
|
.heading-large,
|
|
.heading-medium {
|
|
margin: 10px 0 15px 0;
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
.highlight {
|
|
font-family: monospace;
|
|
overflow-x: scroll;
|
|
padding: 10px 0 10px 10px;
|
|
}
|
|
|
|
.inline {
|
|
|
|
.block-label {
|
|
|
|
@include media(tablet) {
|
|
float: none;
|
|
display: inline-block;
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
td {
|
|
vertical-align: top;
|
|
}
|
|
|
|
.heading-xlarge {
|
|
margin-bottom: 20px;
|
|
}
|
|
|
|
.heading-medium {
|
|
margin-top: $gutter;
|
|
}
|
|
|
|
#footer {
|
|
|
|
.footer-categories {
|
|
|
|
@extend %site-width-container;
|
|
|
|
&-wrapper {
|
|
padding: 0 0 $gutter * 2;
|
|
margin: 0 0 $gutter;
|
|
border-bottom: 1px solid $border-colour;
|
|
}
|
|
|
|
h2 {
|
|
margin: 0 0 $gutter-two-thirds;
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
.form-label {
|
|
margin-bottom: 5px;
|
|
}
|
|
|
|
.hint {
|
|
color: $secondary-text-colour;
|
|
}
|
|
|
|
.list-bullet {
|
|
|
|
.list-bullet {
|
|
list-style: circle;
|
|
}
|
|
|
|
}
|
|
|
|
details summary {
|
|
text-decoration: underline;
|
|
margin-bottom: $gutter-half;
|
|
}
|
|
|
|
.spreadsheet {
|
|
|
|
th,
|
|
.table-field-index {
|
|
background: $grey-4;
|
|
font-weight: bold;
|
|
text-align: center;
|
|
}
|
|
|
|
th, td {
|
|
padding-left: 10px;
|
|
padding-right: 10px;
|
|
border: 1px solid $border-colour;
|
|
}
|
|
|
|
td {
|
|
border-top: 0;
|
|
}
|
|
|
|
}
|
|
|
|
.phase-banner-beta {
|
|
border: 0;
|
|
margin-bottom: -$gutter + 2px;
|
|
}
|
|
|
|
.body-copy-table {
|
|
|
|
table {
|
|
|
|
th,
|
|
td {
|
|
@include core-19;
|
|
}
|
|
|
|
thead {
|
|
th {
|
|
@include bold-19;
|
|
}
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
.tabular-numbers {
|
|
@include core-19($tabular-numbers: true);
|
|
}
|
|
|
|
summary::-moz-details-marker {
|
|
display: none;
|
|
}
|
|
summary::-ms-details-marker {
|
|
display: none;
|
|
}
|
|
summary::-o-details-marker {
|
|
display: none;
|
|
}
|
|
|
|
summary::details-marker {
|
|
display: none;
|
|
}
|
|
|
|
summary::-webkit-details-marker {
|
|
display: none;
|
|
}
|
|
|
|
details .arrow {
|
|
font-size: 16px;
|
|
}
|
|
|
|
.block-label-hint {
|
|
@include core-16;
|
|
margin-top: 5px;
|
|
}
|
|
|
|
#content.override-elements-content {
|
|
padding-bottom: 0;
|
|
}
|
|
|
|
.multiple-choice input:disabled+label {
|
|
opacity: 1;
|
|
color: $secondary-text-colour;
|
|
cursor: default;
|
|
}
|
|
|
|
.heading-inline {
|
|
display: inline-block;
|
|
}
|