mirror of
https://github.com/GSA/notifications-admin.git
synced 2026-09-08 08:28:15 -04:00
dbb2d47425
Make heading break on whitespace - it means if the combination of name and email address is too long for the line, email address will go underneath and be more visible. If email address too big for the allotted space, it will break onto the next line and all of it will be visible.
87 lines
1.4 KiB
SCSS
87 lines
1.4 KiB
SCSS
$item-top-padding: govuk-spacing(3);
|
|
|
|
.user-list {
|
|
|
|
@include core-19;
|
|
margin-bottom: govuk-spacing(6);
|
|
|
|
&-item {
|
|
|
|
padding: govuk-spacing(3) 0px;
|
|
border-top: 1px solid $border-colour;
|
|
|
|
&-heading {
|
|
|
|
padding-right: govuk-spacing(3);
|
|
overflow: hidden;
|
|
overflow-wrap: break-word;
|
|
|
|
.heading-small {
|
|
color: $black;
|
|
}
|
|
|
|
}
|
|
|
|
&:last-child {
|
|
border-bottom: 1px solid $border-colour;
|
|
}
|
|
|
|
& :last-child {
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
&-blank {
|
|
|
|
margin-bottom: govuk-spacing(3);
|
|
|
|
@include govuk-media-query($from: tablet) {
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
&-edit-link {
|
|
|
|
position: relative;
|
|
display: block;
|
|
margin: govuk-spacing(3) 0 govuk-spacing(3);
|
|
|
|
@include govuk-media-query($from: tablet) {
|
|
float: right;
|
|
margin: 0;
|
|
}
|
|
|
|
&:before {
|
|
content: "";
|
|
display: block;
|
|
|
|
position: absolute;
|
|
|
|
top: -1 * govuk-spacing(3) - 1;
|
|
right: 0;
|
|
bottom: -1 * govuk-spacing(3);
|
|
left: -1 * govuk-spacing(3);
|
|
|
|
background: transparent;
|
|
}
|
|
|
|
&:active:before,
|
|
&:focus:before {
|
|
border-color: $yellow;
|
|
border-style: solid;
|
|
border-width: 15px 3px;
|
|
right: -3px;
|
|
left: -3px;
|
|
|
|
@include govuk-media-query($from: tablet) {
|
|
border-width: 15px 3px 15px 15px;
|
|
left: -15px;
|
|
}
|
|
}
|
|
|
|
}
|
|
|
|
}
|