mirror of
https://github.com/GSA/notifications-admin.git
synced 2026-06-05 22:10:44 -04:00
This is borrowed from an earlier prototype, and is meant to be temporary – something better than just plain text. Text in generated content isn’t always announced by screen readers, so we should definitely move away from that once we understand what text will be shown on the phone and where it comes from.
34 lines
836 B
SCSS
34 lines
836 B
SCSS
.broadcast-message-wrapper {
|
|
|
|
position: relative;
|
|
width: 100%;
|
|
max-width: 464px;
|
|
box-sizing: border-box;
|
|
padding: govuk-spacing(9) govuk-spacing(3) govuk-spacing(3) govuk-spacing(3);
|
|
background: $panel-colour;
|
|
border: 2px solid $black;
|
|
border-radius: 5px;
|
|
white-space: normal;
|
|
margin: govuk-spacing(2) 0 govuk-spacing(4) 0;
|
|
clear: both;
|
|
word-wrap: break-word;
|
|
|
|
&:before {
|
|
content: "Emergency alert";
|
|
display: block;
|
|
border-bottom: 2px solid $black;
|
|
position: absolute;
|
|
top: govuk-spacing(2);
|
|
left: 0;
|
|
padding: 2px govuk-spacing(3) govuk-spacing(2) 45px;
|
|
width: 100%;
|
|
box-sizing: border-box;
|
|
font-weight: bold;
|
|
background: file-url('exclamation.svg');
|
|
background-size: 20px;
|
|
background-repeat: no-repeat;
|
|
background-position: govuk-spacing(3) 3px;
|
|
}
|
|
|
|
}
|