Replace old focus CSS for message-name/-type

Template list items without checkboxes use the
`.message-name` and `.message-type` classes for
their links and hints.

This means styles used to expand the focus area
previously are clashing with the new approach.

This removes the old ones and gives
`.message-type` paragraphs a non-static position
to give them a z-position and so raise them above
the expanded link area.
This commit is contained in:
Tom Byers
2020-10-23 12:00:33 +01:00
parent 5058727587
commit 744d76e8d9

View File

@@ -34,8 +34,6 @@ $message-type-bottom-spacing: govuk-spacing(4);
margin: 0;
a {
margin-bottom: -1 * govuk-spacing(6);
padding-bottom: govuk-spacing(6);
&:hover .message-name-separator:before {
border-color: $link-hover-colour;
@@ -59,6 +57,7 @@ $message-type-bottom-spacing: govuk-spacing(4);
}
&-type {
position: relative; /* needs to be non-static to have a z-index above the link :before element */
color: $govuk-secondary-text-colour;
margin: 0 0 $message-type-bottom-spacing 0;
padding-left: 0;