mirror of
https://github.com/GSA/notifications-admin.git
synced 2026-06-06 14:30:57 -04:00
bc83ff6c09
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`.
64 lines
1.3 KiB
SCSS
64 lines
1.3 KiB
SCSS
$indicator-colour: $black;
|
|
|
|
%task-list-indicator {
|
|
@include bold-16;
|
|
display: inline-block;
|
|
padding: 3px 8px 1px 8px;
|
|
position: absolute;
|
|
right: 0;
|
|
top: govuk-spacing(6) - 2px;
|
|
margin-top: -15px;
|
|
border: 2px solid $indicator-colour;
|
|
pointer-events: none;
|
|
z-index: 2;
|
|
min-width: 20%;
|
|
text-align: center;
|
|
}
|
|
|
|
.task-list {
|
|
|
|
border-top: 1px solid $border-colour;
|
|
margin: govuk-spacing(6) 0;
|
|
|
|
&-item {
|
|
|
|
position: relative;
|
|
|
|
a {
|
|
border-bottom: 1px solid $border-colour;
|
|
display: block;
|
|
padding: govuk-spacing(3) 0;
|
|
padding-right: 20%;
|
|
position: relative;
|
|
|
|
&:focus {
|
|
outline: none;
|
|
box-shadow: -3px 0 0 0 $focus-colour, 3px 0 0 0 $focus-colour;
|
|
border-color: transparent;
|
|
top: -1px;
|
|
margin-bottom: -2px;
|
|
padding-top: govuk-spacing(3) + 1px;
|
|
padding-bottom: govuk-spacing(3) + 1px;
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
&-indicator-completed {
|
|
@extend %task-list-indicator;
|
|
background-color: $indicator-colour;
|
|
color: $grey-4;
|
|
// Just a pinch of letter spacing to make reversed-out text a bit
|
|
// easier to read
|
|
letter-spacing: 0.02em;
|
|
}
|
|
|
|
&-indicator-not-completed {
|
|
@extend %task-list-indicator;
|
|
background-color: $white;
|
|
color: $indicator-colour;
|
|
}
|
|
|
|
}
|