mirror of
https://github.com/GSA/notifications-admin.git
synced 2026-07-15 19:01:04 -04:00
Replaced `$gutter` and similar variables such as `$gutter-half` with the `govuk-spacing()` static spacing function. This uses `govuk-spacing()` instead of `$govuk-gutter` because `$govuk-gutter` should only be used for the gaps in between grid columns and we were mostly using `$gutter` to add more space around elements. There are other places in the SCSS files where we had hardcoded a measurement in px which could be replaced with `govuk-spacing`, but this commit only replaces the existing uses of `$gutter`.
96 lines
1.6 KiB
SCSS
96 lines
1.6 KiB
SCSS
$item-top-padding: govuk-spacing(3);
|
|
|
|
.history-list {
|
|
|
|
@include core-19;
|
|
margin-bottom: govuk-spacing(6);
|
|
|
|
&-item {
|
|
|
|
padding: $item-top-padding 0 govuk-spacing(3) 0;
|
|
border-top: 1px solid $border-colour;
|
|
position: relative;
|
|
|
|
&:last-child {
|
|
border-bottom: 1px solid $border-colour;
|
|
}
|
|
|
|
.page-footer {
|
|
margin-bottom: 5px;
|
|
}
|
|
|
|
}
|
|
|
|
&-user {
|
|
display: block;
|
|
}
|
|
|
|
&-time {
|
|
display: block;
|
|
color: $secondary-text-colour;
|
|
}
|
|
|
|
&-percentage {
|
|
|
|
$axis-thickness: 2px;
|
|
border-bottom: $axis-thickness solid $black;
|
|
position: relative;
|
|
margin-bottom: 35px;
|
|
height: 35px;
|
|
|
|
&:before,
|
|
&:after {
|
|
content: "";
|
|
position: absolute;
|
|
bottom: -6px;
|
|
left: 0;
|
|
height: 10px;
|
|
width: $axis-thickness;
|
|
background: $black;
|
|
}
|
|
|
|
&:after {
|
|
left: auto;
|
|
right: 0;
|
|
}
|
|
|
|
&-without-border {
|
|
position: relative;
|
|
padding-top: 35px;
|
|
}
|
|
|
|
&-marker {
|
|
$size: 20px;
|
|
$border-thickness: 7px;
|
|
$text-width: 100px;
|
|
display: block;
|
|
width: $size;
|
|
height: $size;
|
|
position: absolute;
|
|
top: 35px - ($size / 2) - ($border-thickness - ($axis-thickness / 2));
|
|
margin-left: 0 - ($size / 2) - $border-thickness;
|
|
background: $black;
|
|
border-radius: $size;
|
|
border: $border-thickness solid $white;
|
|
}
|
|
|
|
&-left-label,
|
|
&-right-label {
|
|
width: 100%;
|
|
position: absolute;
|
|
top: 0;
|
|
}
|
|
|
|
&-left-label {
|
|
left: 0;
|
|
}
|
|
|
|
&-right-label {
|
|
right: 0;
|
|
text-align: right;
|
|
}
|
|
|
|
}
|
|
|
|
}
|