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

feat: disabled groups (fieldset)

Browse source
This commit is contained in:
Lucas Larroche 2022-03-06 18:25:58 +07:00
parent 43cacb0b93
commit 19d2ffad02
18 changed files with 42 additions and 29 deletions
Download patch file Download diff file Expand all files Collapse all files

7
css/pico.classless.css
View file

@ -924,7 +924,8 @@ input[type=reset]: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]) {
opacity: 0.5;
pointer-events: none;
@ -1079,10 +1080,12 @@ textarea:focus {
input:not([type=submit]):not([type=button]):not([type=reset])[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);
--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] {

2
css/pico.classless.css.map
View file

File diff suppressed because one or more lines are too long

2
css/pico.classless.min.css vendored
View file

File diff suppressed because one or more lines are too long

2
css/pico.classless.min.css.map
View file

File diff suppressed because one or more lines are too long

7
css/pico.css
View file

@ -1027,7 +1027,8 @@ input[type=reset].outline:is([aria-current], :hover, :active, :focus) {
--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]) {
opacity: 0.5;
pointer-events: none;
@ -1182,10 +1183,12 @@ textarea:focus {
input:not([type=submit]):not([type=button]):not([type=reset])[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);
--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] {

2
css/pico.css.map
View file

File diff suppressed because one or more lines are too long

7
css/pico.fluid.classless.css
View file

@ -894,7 +894,8 @@ input[type=reset]: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]) {
opacity: 0.5;
pointer-events: none;
@ -1049,10 +1050,12 @@ textarea:focus {
input:not([type=submit]):not([type=button]):not([type=reset])[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);
--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] {

2
css/pico.fluid.classless.css.map
View file

File diff suppressed because one or more lines are too long

2
css/pico.fluid.classless.min.css vendored
View file

File diff suppressed because one or more lines are too long

2
css/pico.fluid.classless.min.css.map
View file

File diff suppressed because one or more lines are too long

2
css/pico.min.css vendored
View file

File diff suppressed because one or more lines are too long

2
css/pico.min.css.map
View file

File diff suppressed because one or more lines are too long

7
css/pico.slim.css
View file

@ -954,7 +954,8 @@ input[type=reset].outline:is([aria-current], :hover, :active, :focus) {
--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]) {
opacity: 0.5;
pointer-events: none;
@ -1108,10 +1109,12 @@ textarea:focus {
input:not([type=submit]):not([type=button]):not([type=reset])[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);
--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] {

2
css/pico.slim.css.map
View file

File diff suppressed because one or more lines are too long

2
css/pico.slim.min.css vendored
View file

File diff suppressed because one or more lines are too long

2
css/pico.slim.min.css.map
View file

File diff suppressed because one or more lines are too long

3
scss/content/_button.scss
View file

@ -175,7 +175,8 @@ input[type="reset"],
// Button [disabled]
// 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]) {
opacity: 0.5;
pointer-events: none;

16
scss/content/_form.scss
View file

@ -198,14 +198,14 @@ textarea {
}
// Disabled
input:not([type="submit"]):not([type="button"]):not([type="reset"]),
select,
textarea {
&[disabled] {
--background-color: var(--form-element-disabled-background-color);
--border-color: var(--form-element-disabled-border-color);
opacity: var(--form-element-disabled-opacity);
}
input:not([type="submit"]):not([type="button"]):not([type="reset"])[disabled],
select[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);
--border-color: var(--form-element-disabled-border-color);
opacity: var(--form-element-disabled-opacity);
pointer-events: none;
}
// Aria-invalid