a11y: underline on hover/active links and buttons
This commit is contained in:
@@ -18,4 +18,53 @@ button, .button-primary, .button-secondary, .menu-button, .logo {
|
||||
line-height: var(--line-loose);
|
||||
letter-spacing: 0.12em;
|
||||
word-spacing: 0.16em;
|
||||
text-decoration: underline;
|
||||
text-underline-offset: 0.175rem;
|
||||
text-decoration-thickness: 0.075rem;
|
||||
transition: 0.2s;
|
||||
}
|
||||
|
||||
button:hover, .button-primary:hover, .button-secondary:hover, .logo:hover {
|
||||
text-decoration: underline;
|
||||
text-underline-offset: 0.175rem;
|
||||
text-decoration-thickness: 0.075rem;
|
||||
transition: 0.2s;
|
||||
}
|
||||
|
||||
button:active, .button-primary:active, .button-secondary:active, .logo:active {
|
||||
text-decoration: underline;
|
||||
text-underline-offset: 0.175rem;
|
||||
text-decoration-thickness: 0.075rem;
|
||||
transition: 0.2s;
|
||||
}
|
||||
|
||||
.menu-button:hover,
|
||||
.desktop-nav a[aria-current="page"]:hover,
|
||||
.mobile-menu a[aria-current="page"]:hover {
|
||||
text-decoration: underline;
|
||||
text-underline-offset: 0.175rem;
|
||||
text-decoration-thickness: 0.075rem;
|
||||
transition: 0.2s;
|
||||
}
|
||||
|
||||
.menu-button:active,
|
||||
.desktop-nav a[aria-current="page"]:active,
|
||||
.mobile-menu a[aria-current="page"]:active,
|
||||
.desktop-nav a[aria-current="page"],
|
||||
.mobile-menu a[aria-current="page"] {
|
||||
text-decoration: underline;
|
||||
text-underline-offset: 0.175rem;
|
||||
text-decoration-thickness: 0.075rem;
|
||||
transition: 0.2s;
|
||||
}
|
||||
|
||||
|
||||
.menu-button:active,
|
||||
.desktop-nav a[aria-current="page"]:active,
|
||||
.mobile-menu a[aria-current="page"]:active {
|
||||
text-decoration: underline;
|
||||
text-underline-offset: 0.175rem;
|
||||
text-decoration-thickness: 0.075rem;
|
||||
transition: 0.2s;
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user