mirror of
https://github.com/picocss/pico.git
synced 2025-04-26 11:16:15 -04:00
Define validation states with aria-invalid
This commit is contained in:
parent
c49273df6c
commit
d49c7ffcf2
10 changed files with 95 additions and 39 deletions
|
@ -221,24 +221,19 @@ textarea {
|
|||
}
|
||||
|
||||
// Validation states
|
||||
@if $enable-input-states and $enable-classes {
|
||||
&[aria-invalid] {
|
||||
padding-right: 2rem;
|
||||
background-position: center right .75rem;
|
||||
background-repeat: no-repeat;
|
||||
background-size: 1rem auto;
|
||||
}
|
||||
|
||||
// Validation states
|
||||
&.valid,
|
||||
&.invalid {
|
||||
padding-right: 2rem;
|
||||
background-position: center right .75rem;
|
||||
background-repeat: no-repeat;
|
||||
background-size: 1rem auto;
|
||||
}
|
||||
&[aria-invalid="false"] {
|
||||
background-image: var(--icon-valid);
|
||||
}
|
||||
|
||||
&.valid {
|
||||
background-image: var(--icon-valid);
|
||||
}
|
||||
|
||||
&.invalid {
|
||||
background-image: var(--icon-invalid);
|
||||
}
|
||||
&[aria-invalid="true"]{
|
||||
background-image: var(--icon-invalid);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue