mirrors/picocss
1
0
Fork 0
mirror of https://github.com/picocss/pico.git synced 2025-04-24 18:26:14 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

Build CSS

Browse source
This commit is contained in:
github-actions[bot] 2024-12-31 05:18:39 +00:00
parent ddf41a191a
commit 951aae3801
77 changed files with 7702 additions and 7702 deletions
Download patch file Download diff file Expand all files Collapse all files

120
scss/forms/_input-search.scss
View file

@ -1,60 +1,60 @@
@use "sass:map";
@use "../settings" as *;
@if map.get($modules, "forms/input-search") {
/**
* Input type search
*/
// :not() are needed to add Specificity and avoid !important on padding
#{$parent-selector} input:not([type="checkbox"], [type="radio"], [type="range"], [type="file"]) {
&[type="search"] {
padding-inline-start: calc(var(#{$css-var-prefix}form-element-spacing-horizontal) + 1.75rem);
background-image: var(#{$css-var-prefix}icon-search);
background-position: center
left
calc(var(#{$css-var-prefix}form-element-spacing-horizontal) + 0.125rem);
background-size: 1rem auto;
background-repeat: no-repeat;
&[aria-invalid] {
@if $enable-important {
padding-inline-start: calc(
var(#{$css-var-prefix}form-element-spacing-horizontal) + 1.75rem
) !important;
} @else {
padding-inline-start: calc(
var(#{$css-var-prefix}form-element-spacing-horizontal) + 1.75rem
);
}
background-position:
center left 1.125rem,
center right 0.75rem;
}
&[aria-invalid="false"] {
background-image: var(#{$css-var-prefix}icon-search), var(#{$css-var-prefix}icon-valid);
}
&[aria-invalid="true"] {
background-image: var(#{$css-var-prefix}icon-search), var(#{$css-var-prefix}icon-invalid);
}
}
}
[dir="rtl"] {
#{$parent-selector} :where(input) {
&:not([type="checkbox"], [type="radio"], [type="range"], [type="file"]) {
&[type="search"] {
background-position: center right 1.125rem;
&[aria-invalid] {
background-position:
center right 1.125rem,
center left 0.75rem;
}
}
}
}
}
}
@use "sass:map";
@use "../settings" as *;
@if map.get($modules, "forms/input-search") {
/**
* Input type search
*/
// :not() are needed to add Specificity and avoid !important on padding
#{$parent-selector} input:not([type="checkbox"], [type="radio"], [type="range"], [type="file"]) {
&[type="search"] {
padding-inline-start: calc(var(#{$css-var-prefix}form-element-spacing-horizontal) + 1.75rem);
background-image: var(#{$css-var-prefix}icon-search);
background-position: center
left
calc(var(#{$css-var-prefix}form-element-spacing-horizontal) + 0.125rem);
background-size: 1rem auto;
background-repeat: no-repeat;
&[aria-invalid] {
@if $enable-important {
padding-inline-start: calc(
var(#{$css-var-prefix}form-element-spacing-horizontal) + 1.75rem
) !important;
} @else {
padding-inline-start: calc(
var(#{$css-var-prefix}form-element-spacing-horizontal) + 1.75rem
);
}
background-position:
center left 1.125rem,
center right 0.75rem;
}
&[aria-invalid="false"] {
background-image: var(#{$css-var-prefix}icon-search), var(#{$css-var-prefix}icon-valid);
}
&[aria-invalid="true"] {
background-image: var(#{$css-var-prefix}icon-search), var(#{$css-var-prefix}icon-invalid);
}
}
}
[dir="rtl"] {
#{$parent-selector} :where(input) {
&:not([type="checkbox"], [type="radio"], [type="range"], [type="file"]) {
&[type="search"] {
background-position: center right 1.125rem;
&[aria-invalid] {
background-position:
center right 1.125rem,
center left 0.75rem;
}
}
}
}
}
}