mirror of
https://github.com/picocss/pico.git
synced 2025-04-25 18:56:15 -04:00
Style: Add focus for aria-invalid form elements
This commit is contained in:
parent
76c1b3d9b8
commit
0b3f1656f2
24 changed files with 131 additions and 112 deletions
|
@ -119,35 +119,21 @@
|
|||
margin-inline-end: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Aria-invalid
|
||||
// Aria-invalid
|
||||
[type="checkbox"],
|
||||
[type="checkbox"]:checked,
|
||||
[type="radio"],
|
||||
[type="radio"]:checked,
|
||||
[type="checkbox"][role="switch"],
|
||||
[type="checkbox"][role="switch"]:checked {
|
||||
|
||||
&[aria-invalid="false"] {
|
||||
--border-color: var(--form-element-valid-border-color);
|
||||
|
||||
&:active,
|
||||
&:focus {
|
||||
@if $enable-important {
|
||||
--border-color: var(
|
||||
--form-element-valid-active-border-color
|
||||
) !important;
|
||||
} @else {
|
||||
--border-color: var(--form-element-valid-active-border-color);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&[aria-invalid="true"] {
|
||||
--border-color: var(--form-element-invalid-border-color);
|
||||
|
||||
&:active,
|
||||
&:focus {
|
||||
@if $enable-important {
|
||||
--border-color: var(
|
||||
--form-element-invalid-active-border-color
|
||||
) !important;
|
||||
} @else {
|
||||
--border-color: var(--form-element-invalid-active-border-color);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
Loading…
Add table
Add a link
Reference in a new issue