Replace $gutter with govuk-spacing function

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`.
This commit is contained in:
Katie Smith
2020-02-21 13:21:44 +00:00
parent a85f7fa2c1
commit bc83ff6c09
35 changed files with 139 additions and 139 deletions

View File

@@ -1,11 +1,11 @@
.table {
margin-bottom: $gutter;
margin-bottom: govuk-spacing(6);
width: 100%;
}
.table-heading {
text-align: left;
margin: $gutter-half 0 $gutter-half 0;
margin: govuk-spacing(3) 0 govuk-spacing(3) 0;
}
.dashboard-table {
@@ -119,7 +119,7 @@
table {
table-layout: fixed;
margin-bottom: $gutter / 6;
margin-bottom: govuk-spacing(1);
}
th {
@@ -343,10 +343,10 @@
position: absolute;
top: -$gutter-half;
top: -govuk-spacing(3);
right: 0;
bottom: -$gutter-half + 4px;
left: -$gutter-half;
bottom: -govuk-spacing(3) + 4px;
left: -govuk-spacing(3);
background: transparent;
}
@@ -381,13 +381,13 @@ td.table-empty-message {
@include core-16;
color: $secondary-text-colour;
margin-bottom: $gutter * 1.3333;
margin-bottom: govuk-spacing(7);
border-bottom: 1px solid $border-colour;
padding: 35px 0 10px 0;
text-align: center;
.table + & {
margin-top: -$gutter;
margin-top: -govuk-spacing(6);
}
}
@@ -400,7 +400,7 @@ a.table-show-more-link {
@include core-16;
color: $secondary-text-colour;
margin-top: 10px;
margin-bottom: $gutter * 1.3333;
margin-bottom: govuk-spacing(7);
border-top: 1px solid $border-colour;
border-bottom: 1px solid $border-colour;
padding: 0.75em 0 0.5625em 0;