mirrors/picocss
1
0
Fork 0
mirror of https://github.com/picocss/pico.git synced 2025-06-17 19:55:22 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

refactor: prefix css vars

Browse source
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
Download patch file Download diff file Expand all files Collapse all files

22
scss/forms/_input-date.scss
View file

@ -1,3 +1,5 @@
@use "../settings" as *;
/**
* Input type datetime
*/
@ -5,18 +7,18 @@
// :not() are needed to add Specificity and avoid !important on padding
input:not([type="checkbox"], [type="radio"], [type="range"], [type="file"]) {
&:is([type="date"], [type="datetime-local"], [type="month"], [type="time"], [type="week"]) {
--icon-position: 0.75rem;
--icon-width: 1rem;
padding-right: calc(var(--icon-width) + var(--icon-position));
background-image: var(--icon-date);
background-position: center right var(--icon-position);
background-size: var(--icon-width) auto;
#{$✨}icon-position: 0.75rem;
#{$✨}icon-width: 1rem;
padding-right: calc(var(#{$✨}icon-width) + var(#{$✨}icon-position));
background-image: var(#{$✨}icon-date);
background-position: center right var(#{$✨}icon-position);
background-size: var(#{$✨}icon-width) auto;
background-repeat: no-repeat;
}
// Time
&[type="time"] {
background-image: var(--icon-time);
background-image: var(#{$✨}icon-time);
}
}
@ -27,9 +29,9 @@ input:not([type="checkbox"], [type="radio"], [type="range"], [type="file"]) {
[type="time"],
[type="week"] {
&::-webkit-calendar-picker-indicator {
width: var(--icon-width);
margin-right: calc(var(--icon-width) * -1);
margin-left: var(--icon-position);
width: var(#{$✨}icon-width);
margin-right: calc(var(#{$✨}icon-width) * -1);
margin-left: var(#{$✨}icon-position);
opacity: 0;
}
}