Style: Add focus for aria-invalid form elements

This commit is contained in:
Lucas Larroche 2021-11-08 01:55:20 +07:00
parent 76c1b3d9b8
commit 0b3f1656f2
24 changed files with 131 additions and 112 deletions

View file

@ -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);
}
}
}
}
}