mirror of
https://github.com/picocss/pico.git
synced 2025-04-21 00:56:14 -04:00
feat: disabled groups (fieldset)
This commit is contained in:
parent
43cacb0b93
commit
19d2ffad02
18 changed files with 42 additions and 29 deletions
|
@ -924,7 +924,8 @@ input[type=reset]:focus {
|
||||||
0 0 0 var(--outline-width) var(--secondary-focus);
|
0 0 0 var(--outline-width) var(--secondary-focus);
|
||||||
}
|
}
|
||||||
|
|
||||||
:where(button, input[type="submit"], input[type="reset"], [role="button"])[disabled],
|
:where(button, [type="submit"], [type="button"], [type="reset"], [role="button"])[disabled],
|
||||||
|
:where([disabled]) :is(button, [type=submit], [type=button], [type=reset], [role=button]),
|
||||||
a[role=button]:not([href]) {
|
a[role=button]:not([href]) {
|
||||||
opacity: 0.5;
|
opacity: 0.5;
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
|
@ -1079,10 +1080,12 @@ textarea:focus {
|
||||||
|
|
||||||
input:not([type=submit]):not([type=button]):not([type=reset])[disabled],
|
input:not([type=submit]):not([type=button]):not([type=reset])[disabled],
|
||||||
select[disabled],
|
select[disabled],
|
||||||
textarea[disabled] {
|
textarea[disabled],
|
||||||
|
:where([disabled]) :is(input:not([type=submit]):not([type=button]):not([type=reset]), select, textarea) {
|
||||||
--background-color: var(--form-element-disabled-background-color);
|
--background-color: var(--form-element-disabled-background-color);
|
||||||
--border-color: var(--form-element-disabled-border-color);
|
--border-color: var(--form-element-disabled-border-color);
|
||||||
opacity: var(--form-element-disabled-opacity);
|
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]):not([type=radio])[aria-invalid] {
|
||||||
|
|
File diff suppressed because one or more lines are too long
2
css/pico.classless.min.css
vendored
2
css/pico.classless.min.css
vendored
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
@ -1027,7 +1027,8 @@ input[type=reset].outline:is([aria-current], :hover, :active, :focus) {
|
||||||
--color: var(--contrast-hover);
|
--color: var(--contrast-hover);
|
||||||
}
|
}
|
||||||
|
|
||||||
:where(button, input[type="submit"], input[type="reset"], [role="button"])[disabled],
|
:where(button, [type="submit"], [type="button"], [type="reset"], [role="button"])[disabled],
|
||||||
|
:where([disabled]) :is(button, [type=submit], [type=button], [type=reset], [role=button]),
|
||||||
a[role=button]:not([href]) {
|
a[role=button]:not([href]) {
|
||||||
opacity: 0.5;
|
opacity: 0.5;
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
|
@ -1182,10 +1183,12 @@ textarea:focus {
|
||||||
|
|
||||||
input:not([type=submit]):not([type=button]):not([type=reset])[disabled],
|
input:not([type=submit]):not([type=button]):not([type=reset])[disabled],
|
||||||
select[disabled],
|
select[disabled],
|
||||||
textarea[disabled] {
|
textarea[disabled],
|
||||||
|
:where([disabled]) :is(input:not([type=submit]):not([type=button]):not([type=reset]), select, textarea) {
|
||||||
--background-color: var(--form-element-disabled-background-color);
|
--background-color: var(--form-element-disabled-background-color);
|
||||||
--border-color: var(--form-element-disabled-border-color);
|
--border-color: var(--form-element-disabled-border-color);
|
||||||
opacity: var(--form-element-disabled-opacity);
|
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]):not([type=radio])[aria-invalid] {
|
||||||
|
|
File diff suppressed because one or more lines are too long
|
@ -894,7 +894,8 @@ input[type=reset]:focus {
|
||||||
0 0 0 var(--outline-width) var(--secondary-focus);
|
0 0 0 var(--outline-width) var(--secondary-focus);
|
||||||
}
|
}
|
||||||
|
|
||||||
:where(button, input[type="submit"], input[type="reset"], [role="button"])[disabled],
|
:where(button, [type="submit"], [type="button"], [type="reset"], [role="button"])[disabled],
|
||||||
|
:where([disabled]) :is(button, [type=submit], [type=button], [type=reset], [role=button]),
|
||||||
a[role=button]:not([href]) {
|
a[role=button]:not([href]) {
|
||||||
opacity: 0.5;
|
opacity: 0.5;
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
|
@ -1049,10 +1050,12 @@ textarea:focus {
|
||||||
|
|
||||||
input:not([type=submit]):not([type=button]):not([type=reset])[disabled],
|
input:not([type=submit]):not([type=button]):not([type=reset])[disabled],
|
||||||
select[disabled],
|
select[disabled],
|
||||||
textarea[disabled] {
|
textarea[disabled],
|
||||||
|
:where([disabled]) :is(input:not([type=submit]):not([type=button]):not([type=reset]), select, textarea) {
|
||||||
--background-color: var(--form-element-disabled-background-color);
|
--background-color: var(--form-element-disabled-background-color);
|
||||||
--border-color: var(--form-element-disabled-border-color);
|
--border-color: var(--form-element-disabled-border-color);
|
||||||
opacity: var(--form-element-disabled-opacity);
|
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]):not([type=radio])[aria-invalid] {
|
||||||
|
|
File diff suppressed because one or more lines are too long
2
css/pico.fluid.classless.min.css
vendored
2
css/pico.fluid.classless.min.css
vendored
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
2
css/pico.min.css
vendored
2
css/pico.min.css
vendored
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
@ -954,7 +954,8 @@ input[type=reset].outline:is([aria-current], :hover, :active, :focus) {
|
||||||
--color: var(--contrast-hover);
|
--color: var(--contrast-hover);
|
||||||
}
|
}
|
||||||
|
|
||||||
:where(button, input[type="submit"], input[type="reset"], [role="button"])[disabled],
|
:where(button, [type="submit"], [type="button"], [type="reset"], [role="button"])[disabled],
|
||||||
|
:where([disabled]) :is(button, [type=submit], [type=button], [type=reset], [role=button]),
|
||||||
a[role=button]:not([href]) {
|
a[role=button]:not([href]) {
|
||||||
opacity: 0.5;
|
opacity: 0.5;
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
|
@ -1108,10 +1109,12 @@ textarea:focus {
|
||||||
|
|
||||||
input:not([type=submit]):not([type=button]):not([type=reset])[disabled],
|
input:not([type=submit]):not([type=button]):not([type=reset])[disabled],
|
||||||
select[disabled],
|
select[disabled],
|
||||||
textarea[disabled] {
|
textarea[disabled],
|
||||||
|
:where([disabled]) :is(input:not([type=submit]):not([type=button]):not([type=reset]), select, textarea) {
|
||||||
--background-color: var(--form-element-disabled-background-color);
|
--background-color: var(--form-element-disabled-background-color);
|
||||||
--border-color: var(--form-element-disabled-border-color);
|
--border-color: var(--form-element-disabled-border-color);
|
||||||
opacity: var(--form-element-disabled-opacity);
|
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]):not([type=radio])[aria-invalid] {
|
||||||
|
|
File diff suppressed because one or more lines are too long
2
css/pico.slim.min.css
vendored
2
css/pico.slim.min.css
vendored
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
@ -175,7 +175,8 @@ input[type="reset"],
|
||||||
|
|
||||||
// Button [disabled]
|
// Button [disabled]
|
||||||
// Links without href are disabled by default
|
// Links without href are disabled by default
|
||||||
:where(button, input[type="submit"], input[type="reset"], [role="button"])[disabled],
|
:where(button, [type="submit"], [type="button"], [type="reset"], [role="button"])[disabled],
|
||||||
|
:where([disabled]) :is(button, [type="submit"], [type="button"], [type="reset"], [role="button"]),
|
||||||
a[role="button"]:not([href]) {
|
a[role="button"]:not([href]) {
|
||||||
opacity: 0.5;
|
opacity: 0.5;
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
|
|
|
@ -198,14 +198,14 @@ textarea {
|
||||||
}
|
}
|
||||||
|
|
||||||
// Disabled
|
// Disabled
|
||||||
input:not([type="submit"]):not([type="button"]):not([type="reset"]),
|
input:not([type="submit"]):not([type="button"]):not([type="reset"])[disabled],
|
||||||
select,
|
select[disabled],
|
||||||
textarea {
|
textarea[disabled],
|
||||||
&[disabled] {
|
:where([disabled]) :is(input:not([type="submit"]):not([type="button"]):not([type="reset"]), select, textarea) {
|
||||||
--background-color: var(--form-element-disabled-background-color);
|
--background-color: var(--form-element-disabled-background-color);
|
||||||
--border-color: var(--form-element-disabled-border-color);
|
--border-color: var(--form-element-disabled-border-color);
|
||||||
opacity: var(--form-element-disabled-opacity);
|
opacity: var(--form-element-disabled-opacity);
|
||||||
}
|
pointer-events: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
// Aria-invalid
|
// Aria-invalid
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue