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

refactor: :not() selectors

Browse source
This commit is contained in:
Lucas Larroche 2022-09-11 18:30:49 +07:00
parent 844a5fcf84
commit 17b3b4cead
31 changed files with 144 additions and 150 deletions
Download patch file Download diff file Expand all files Collapse all files

32
css/pico.slim.css
View file

@ -116,7 +116,7 @@ tfoot td {
--border-width: 3px;
}
:not(thead):not(tfoot) > * > td {
:not(thead, tfoot) > * > td {
--font-size: 0.875em;
}
@ -1057,7 +1057,7 @@ textarea {
border-width: 0;
}
input:not([type=checkbox]):not([type=radio]):not([type=range]) {
input:not([type=checkbox], [type=radio], [type=range]) {
height: calc(1rem * var(--line-height) + var(--form-element-spacing-vertical) * 2 + var(--border-width) * 2);
}
@ -1075,13 +1075,13 @@ fieldset legend {
font-weight: var(--form-label-font-weight, var(--font-weight));
}
input:not([type=checkbox]):not([type=radio]),
input:not([type=checkbox], [type=radio]),
select,
textarea {
width: 100%;
}
input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]),
input:not([type=checkbox], [type=radio], [type=range], [type=file]),
select,
textarea {
-webkit-appearance: none;
@ -1106,33 +1106,33 @@ textarea {
font-weight: var(--font-weight);
}
input:not([type=submit]):not([type=button]):not([type=reset]):not([type=checkbox]):not([type=radio]):not([readonly]):is(:active, :focus),
input:not([type=submit], [type=button], [type=reset], [type=checkbox], [type=radio], [readonly]):is(:active, :focus),
:where(select, textarea):is(:active, :focus) {
--background-color: var(--form-element-active-background-color);
}
input:not([type=submit]):not([type=button]):not([type=reset]):not([role=switch]):not([readonly]):is(:active, :focus),
input:not([type=submit], [type=button], [type=reset], [role=switch], [readonly]):is(:active, :focus),
:where(select, textarea):is(:active, :focus) {
--border-color: var(--form-element-active-border-color);
}
input:not([type=submit]):not([type=button]):not([type=reset]):not([type=range]):not([type=file]):not([readonly]):focus,
input:not([type=submit], [type=button], [type=reset], [type=range], [type=file], [readonly]):focus,
select:focus,
textarea:focus {
--box-shadow: 0 0 0 var(--outline-width) var(--form-element-focus-color);
}
input:not([type=submit]):not([type=button]):not([type=reset])[disabled],
input:not([type=submit], [type=button], [type=reset])[disabled],
select[disabled],
textarea[disabled],
:where(fieldset[disabled]) :is(input:not([type=submit]):not([type=button]):not([type=reset]), select, textarea) {
:where(fieldset[disabled]) :is(input:not([type=submit], [type=button], [type=reset]), select, textarea) {
--background-color: var(--form-element-disabled-background-color);
--border-color: var(--form-element-disabled-border-color);
opacity: var(--form-element-disabled-opacity);
pointer-events: none;
}
:where(input, select, textarea):not([type=checkbox]):not([type=radio])[aria-invalid] {
:where(input, select, textarea):not([type=checkbox], [type=radio])[aria-invalid] {
padding-right: calc(var(--form-element-spacing-horizontal) + 1.5rem);
padding-left: var(--form-element-spacing-horizontal);
-webkit-padding-start: var(--form-element-spacing-horizontal);
@ -1143,10 +1143,10 @@ textarea[disabled],
background-size: 1rem auto;
background-repeat: no-repeat;
}
:where(input, select, textarea):not([type=checkbox]):not([type=radio])[aria-invalid=false] {
:where(input, select, textarea):not([type=checkbox], [type=radio])[aria-invalid=false] {
background-image: var(--icon-valid);
}
:where(input, select, textarea):not([type=checkbox]):not([type=radio])[aria-invalid=true] {
:where(input, select, textarea):not([type=checkbox], [type=radio])[aria-invalid=true] {
background-image: var(--icon-invalid);
}
:where(input, select, textarea)[aria-invalid=false] {
@ -1164,7 +1164,7 @@ textarea[disabled],
--box-shadow: 0 0 0 var(--outline-width) var(--form-element-invalid-focus-color);
}
[dir=rtl] :where(input, select, textarea):not([type=checkbox]):not([type=radio])[aria-invalid], [dir=rtl] :where(input, select, textarea):not([type=checkbox]):not([type=radio])[aria-invalid=true], [dir=rtl] :where(input, select, textarea):not([type=checkbox]):not([type=radio])[aria-invalid=false] {
[dir=rtl] :where(input, select, textarea):not([type=checkbox], [type=radio]):is([aria-invalid], [aria-invalid=true], [aria-invalid=false]) {
background-position: center left 0.75rem;
}
@ -1177,7 +1177,7 @@ select:invalid {
opacity: 1;
}
input:not([type=checkbox]):not([type=radio]),
input:not([type=checkbox], [type=radio]),
select,
textarea {
margin-bottom: var(--spacing);
@ -1187,7 +1187,7 @@ select::-ms-expand {
border: 0;
background-color: transparent;
}
select:not([multiple]):not([size]) {
select:not([multiple], [size]) {
padding-right: calc(var(--form-element-spacing-horizontal) + 1.5rem);
padding-left: var(--form-element-spacing-horizontal);
-webkit-padding-start: var(--form-element-spacing-horizontal);
@ -1200,7 +1200,7 @@ select:not([multiple]):not([size]) {
background-repeat: no-repeat;
}
[dir=rtl] select:not([multiple]):not([size]) {
[dir=rtl] select:not([multiple], [size]) {
background-position: center left 0.75rem;
}