refactor: prefix css vars

This commit is contained in:
Lucas Larroche 2022-10-22 13:11:51 +07:00
parent cba8f385c2
commit c5a1ffc733
40 changed files with 2334 additions and 2329 deletions

View file

@ -1,4 +1,4 @@
@use "../settings";
@use "../settings" as *;
/**
* Input type search
@ -7,28 +7,28 @@
// :not() are needed to add Specificity and avoid !important on padding
input:not([type="checkbox"], [type="radio"], [type="range"], [type="file"]) {
&[type="search"] {
padding-inline-start: calc(var(--form-element-spacing-horizontal) + 1.75rem);
padding-inline-start: calc(var(#{$}form-element-spacing-horizontal) + 1.75rem);
border-radius: 5rem;
background-image: var(--icon-search);
background-image: var(#{$}icon-search);
background-position: center left 1.125rem;
background-size: 1rem auto;
background-repeat: no-repeat;
&[aria-invalid] {
@if settings.$enable-important {
padding-inline-start: calc(var(--form-element-spacing-horizontal) + 1.75rem) !important;
@if $enable-important {
padding-inline-start: calc(var(#{$}form-element-spacing-horizontal) + 1.75rem) !important;
} @else {
padding-inline-start: calc(var(--form-element-spacing-horizontal) + 1.75rem);
padding-inline-start: calc(var(#{$}form-element-spacing-horizontal) + 1.75rem);
}
background-position: center left 1.125rem, center right 0.75rem;
}
&[aria-invalid="false"] {
background-image: var(--icon-search), var(--icon-valid);
background-image: var(#{$}icon-search), var(#{$}icon-valid);
}
&[aria-invalid="true"] {
background-image: var(--icon-search), var(--icon-invalid);
background-image: var(#{$}icon-search), var(#{$}icon-invalid);
}
}
}