darkhelm/notifications-admin
1
0
Fork 0
mirror of https://github.com/GSA/notifications-admin.git synced 2026-08-25 08:44:23 -04:00
Code Issues Packages Projects Releases Wiki Activity

Change HTML for template list items

Browse Source 
Moves the link out of the label and increases
the hit-size for the checkbox. The intention is to
reduce the chance of clicking the wrong thing by
accident.

This includes a TODO in the checkboxes component
template code. The item meta needs to be
associated with the checkbox input by use of
`aria-describedby` but this needs changes in
govuk-frontend-jinja to happen.
This commit is contained in:
Tom Byers
2020-05-26 14:51:16 +01:00
parent 05088037d2
commit a99622aec5
3 changed files with 40 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
app/assets/stylesheets/components/message.scss
View File

@@ -24,13 +24,13 @@
}
}
$message-text-left-spacing: 22px;
$govuk-checkboxes-size: 40px;
$govuk-checkboxes-label-padding-left-right: govuk-spacing(3);
$message-type-bottom-spacing: govuk-spacing(4);
.message {
&-name {
@include bold-24;
margin: 0;
a {
@@ -78,6 +78,10 @@ $message-type-bottom-spacing: govuk-spacing(4);
&-item {
&-with-checkbox {
padding-left: $govuk-checkboxes-size + $govuk-checkboxes-label-padding-left-right;
}
&-hidden-by-default {
display: none;
}
@@ -105,14 +109,12 @@ $message-type-bottom-spacing: govuk-spacing(4);
}
&-hint,
&-label {
padding-left: $message-text-left-spacing;
}
&-label {
padding-top: 0px;
padding-bottom: 0px;
position: absolute;
left: 0;
width: $govuk-checkboxes-size + $govuk-checkboxes-label-padding-left-right;
height: 100%;
padding: 0;
}
// Fix for GOVUK Frontend selector with high precendence
@@ -121,6 +123,15 @@ $message-type-bottom-spacing: govuk-spacing(4);
margin-bottom: $message-type-bottom-spacing;
}
&-hint {
padding-left: 0;
}
}
&-folder,
&-template {
@include govuk-font($size: 24, $weight: bold, $line-height: 1.25);
}
&-folder {