Merge branch 'dev' into feat-modal

This commit is contained in:
Lucas Larroche 2021-10-31 08:50:55 +07:00
commit 41ef519d32
35 changed files with 2121 additions and 2262 deletions

View file

@ -119,4 +119,35 @@
margin-inline-start: calc(#{$switch-width * 0.5} - var(--border-width));
}
}
// Aria-invalid
&[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);
}
}
}
}

View file

@ -211,34 +211,44 @@ textarea {
}
}
// Aria-valid
// Aria-invalid
input,
select,
textarea {
&[aria-invalid] {
@if $enable-important {
padding-right: calc(
var(--form-element-spacing-horizontal) + 1.5rem
) !important;
padding-left: var(--form-element-spacing-horizontal);
padding-inline-end: calc(
var(--form-element-spacing-horizontal) + 1.5rem
) !important;
padding-inline-start: var(--form-element-spacing-horizontal) !important;
} @else {
padding-right: calc(var(--form-element-spacing-horizontal) + 1.5rem);
padding-left: var(--form-element-spacing-horizontal);
padding-inline-end: calc(var(--form-element-spacing-horizontal) + 1.5rem);
padding-inline-start: var(--form-element-spacing-horizontal);
&:not([type="checkbox"]):not([type="radio"]) {
&[aria-invalid] {
@if $enable-important {
padding-right: calc(
var(--form-element-spacing-horizontal) + 1.5rem
) !important;
padding-left: var(--form-element-spacing-horizontal);
padding-inline-end: calc(
var(--form-element-spacing-horizontal) + 1.5rem
) !important;
padding-inline-start: var(--form-element-spacing-horizontal) !important;
} @else {
padding-right: calc(var(--form-element-spacing-horizontal) + 1.5rem);
padding-left: var(--form-element-spacing-horizontal);
padding-inline-end: calc(var(--form-element-spacing-horizontal) + 1.5rem);
padding-inline-start: var(--form-element-spacing-horizontal);
}
background-position: center right 0.75rem;
background-repeat: no-repeat;
background-size: 1rem auto;
}
&[aria-invalid="false"] {
background-image: var(--icon-valid);
}
&[aria-invalid="true"] {
background-image: var(--icon-invalid);
}
background-position: center right 0.75rem;
background-repeat: no-repeat;
background-size: 1rem auto;
}
&[aria-invalid="false"] {
--border-color: var(--form-element-valid-border-color);
background-image: var(--icon-valid);
&:active,
&:focus {
@ -254,7 +264,6 @@ textarea {
&[aria-invalid="true"] {
--border-color: var(--form-element-invalid-border-color);
background-image: var(--icon-invalid);
&:active,
&:focus {

View file

@ -1,5 +1,5 @@
/*!
* Pico.css v1.4.0 (https://picocss.com)
* Pico.css v1.4.1 (https://picocss.com)
* Copyright 2019-2021 - Licensed under MIT
*/

View file

@ -1,5 +1,5 @@
/*!
* Pico.css v1.4.0 (https://picocss.com)
* Pico.css v1.4.1 (https://picocss.com)
* Copyright 2019-2021 - Licensed under MIT
*
* Slim version example