mirrors/picocss
1
0
Fork 0
mirror of https://github.com/picocss/pico.git synced 2025-04-26 11:16:15 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat(accessibility): Add aria-current

Browse source
This commit is contained in:
Lucas Larroche 2022-02-27 16:12:53 +07:00
parent b0255697d7
commit df298eb4aa
47 changed files with 137 additions and 69 deletions
Download patch file Download diff file Expand all files Collapse all files

42
css/pico.slim.css
View file

@ -618,7 +618,7 @@ a {
-webkit-text-decoration: var(--text-decoration);
text-decoration: var(--text-decoration);
}
a:hover, a:active, a:focus {
a[aria-current], a:hover, a:active, a:focus {
--color: var(--primary-hover);
--text-decoration: underline;
}
@ -628,7 +628,7 @@ a:focus {
a.secondary {
--color: var(--secondary);
}
a.secondary:hover, a.secondary:active, a.secondary:focus {
a.secondary[aria-current], a.secondary:hover, a.secondary:active, a.secondary:focus {
--color: var(--secondary-hover);
}
a.secondary:focus {
@ -637,7 +637,7 @@ a.secondary:focus {
a.contrast {
--color: var(--contrast);
}
a.contrast:hover, a.contrast:active, a.contrast:focus {
a.contrast[aria-current], a.contrast:hover, a.contrast:active, a.contrast:focus {
--color: var(--contrast-hover);
}
a.contrast:focus {
@ -926,16 +926,20 @@ input[type=reset],
text-align: center;
cursor: pointer;
}
button:hover, button:active, button:focus,
button[aria-current], button:hover, button:active, button:focus,
input[type=submit][aria-current],
input[type=submit]:hover,
input[type=submit]:active,
input[type=submit]:focus,
input[type=button][aria-current],
input[type=button]:hover,
input[type=button]:active,
input[type=button]:focus,
input[type=reset][aria-current],
input[type=reset]:hover,
input[type=reset]:active,
input[type=reset]:focus,
[role=button][aria-current],
[role=button]:hover,
[role=button]:active,
[role=button]:focus {
@ -963,16 +967,20 @@ input[type=reset],
--color: var(--secondary-inverse);
cursor: pointer;
}
button.secondary:hover, button.secondary:active, button.secondary:focus,
button.secondary[aria-current], button.secondary:hover, button.secondary:active, button.secondary:focus,
input[type=submit].secondary[aria-current],
input[type=submit].secondary:hover,
input[type=submit].secondary:active,
input[type=submit].secondary:focus,
input[type=button].secondary[aria-current],
input[type=button].secondary:hover,
input[type=button].secondary:active,
input[type=button].secondary:focus,
input[type=reset][aria-current],
input[type=reset]:hover,
input[type=reset]:active,
input[type=reset]:focus,
[role=button].secondary[aria-current],
[role=button].secondary:hover,
[role=button].secondary:active,
[role=button].secondary:focus {
@ -998,16 +1006,20 @@ input[type=reset].contrast,
--border-color: var(--contrast);
--color: var(--contrast-inverse);
}
button.contrast:hover, button.contrast:active, button.contrast:focus,
button.contrast[aria-current], button.contrast:hover, button.contrast:active, button.contrast:focus,
input[type=submit].contrast[aria-current],
input[type=submit].contrast:hover,
input[type=submit].contrast:active,
input[type=submit].contrast:focus,
input[type=button].contrast[aria-current],
input[type=button].contrast:hover,
input[type=button].contrast:active,
input[type=button].contrast:focus,
input[type=reset].contrast[aria-current],
input[type=reset].contrast:hover,
input[type=reset].contrast:active,
input[type=reset].contrast:focus,
[role=button].contrast[aria-current],
[role=button].contrast:hover,
[role=button].contrast:active,
[role=button].contrast:focus {
@ -1032,16 +1044,20 @@ input[type=reset].outline,
--background-color: transparent;
--color: var(--primary);
}
button.outline:hover, button.outline:active, button.outline:focus,
button.outline[aria-current], button.outline:hover, button.outline:active, button.outline:focus,
input[type=submit].outline[aria-current],
input[type=submit].outline:hover,
input[type=submit].outline:active,
input[type=submit].outline:focus,
input[type=button].outline[aria-current],
input[type=button].outline:hover,
input[type=button].outline:active,
input[type=button].outline:focus,
input[type=reset].outline[aria-current],
input[type=reset].outline:hover,
input[type=reset].outline:active,
input[type=reset].outline:focus,
[role=button].outline[aria-current],
[role=button].outline:hover,
[role=button].outline:active,
[role=button].outline:focus {
@ -1056,16 +1072,20 @@ input[type=reset].outline.secondary,
[role=button].outline.secondary {
--color: var(--secondary);
}
button.outline.secondary:hover, button.outline.secondary:active, button.outline.secondary:focus,
button.outline.secondary[aria-current], button.outline.secondary:hover, button.outline.secondary:active, button.outline.secondary:focus,
input[type=submit].outline.secondary[aria-current],
input[type=submit].outline.secondary:hover,
input[type=submit].outline.secondary:active,
input[type=submit].outline.secondary:focus,
input[type=button].outline.secondary[aria-current],
input[type=button].outline.secondary:hover,
input[type=button].outline.secondary:active,
input[type=button].outline.secondary:focus,
input[type=reset].outline.secondary[aria-current],
input[type=reset].outline.secondary:hover,
input[type=reset].outline.secondary:active,
input[type=reset].outline.secondary:focus,
[role=button].outline.secondary[aria-current],
[role=button].outline.secondary:hover,
[role=button].outline.secondary:active,
[role=button].outline.secondary:focus {
@ -1079,16 +1099,20 @@ input[type=reset].outline.contrast,
[role=button].outline.contrast {
--color: var(--contrast);
}
button.outline.contrast:hover, button.outline.contrast:active, button.outline.contrast:focus,
button.outline.contrast[aria-current], button.outline.contrast:hover, button.outline.contrast:active, button.outline.contrast:focus,
input[type=submit].outline.contrast[aria-current],
input[type=submit].outline.contrast:hover,
input[type=submit].outline.contrast:active,
input[type=submit].outline.contrast:focus,
input[type=button].outline.contrast[aria-current],
input[type=button].outline.contrast:hover,
input[type=button].outline.contrast:active,
input[type=button].outline.contrast:focus,
input[type=reset].outline.contrast[aria-current],
input[type=reset].outline.contrast:hover,
input[type=reset].outline.contrast:active,
input[type=reset].outline.contrast:focus,
[role=button].outline.contrast[aria-current],
[role=button].outline.contrast:hover,
[role=button].outline.contrast:active,
[role=button].outline.contrast:focus {