feat: remove form element disabled and border color

This commit is contained in:
Lucas Larroche 2024-01-24 19:29:33 +07:00
parent 72c4678cf7
commit 9ea68c42e0
12 changed files with 6 additions and 46 deletions

View File

@ -254,8 +254,6 @@ input:not([type=submit],
--pico-form-element-active-background-color: #fff;
--pico-form-element-active-border-color: var(--pico-primary-border);
--pico-form-element-focus-color: var(--pico-primary-border);
--pico-form-element-disabled-background-color: var(--pico-form-element-background-color);
--pico-form-element-disabled-border-color: var(--pico-form-element-border-color);
--pico-form-element-disabled-opacity: 0.5;
--pico-form-element-invalid-border-color: #b86a6b;
--pico-form-element-invalid-active-border-color: #c84f48;
@ -370,8 +368,6 @@ input:not([type=submit],
--pico-form-element-active-background-color: #1a1f28;
--pico-form-element-active-border-color: var(--pico-primary-border);
--pico-form-element-focus-color: var(--pico-primary-border);
--pico-form-element-disabled-background-color: var(--pico-form-element-background-color);
--pico-form-element-disabled-border-color: var(--pico-form-element-border-color);
--pico-form-element-disabled-opacity: 0.5;
--pico-form-element-invalid-border-color: #964a50;
--pico-form-element-invalid-active-border-color: #b7403b;
@ -479,8 +475,6 @@ input:not([type=submit],
--pico-form-element-active-background-color: #1a1f28;
--pico-form-element-active-border-color: var(--pico-primary-border);
--pico-form-element-focus-color: var(--pico-primary-border);
--pico-form-element-disabled-background-color: var(--pico-form-element-background-color);
--pico-form-element-disabled-border-color: var(--pico-form-element-border-color);
--pico-form-element-disabled-opacity: 0.5;
--pico-form-element-invalid-border-color: #964a50;
--pico-form-element-invalid-active-border-color: #b7403b;
@ -1250,8 +1244,6 @@ select[disabled],
textarea[disabled],
label[aria-disabled=true],
:where(fieldset[disabled]) :is(input:not([type=submit], [type=button], [type=reset]), select, textarea) {
--pico-background-color: var(--pico-form-element-disabled-background-color);
--pico-border-color: var(--pico-form-element-disabled-border-color);
opacity: var(--pico-form-element-disabled-opacity);
pointer-events: none;
}

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -287,8 +287,6 @@ nav details.dropdown summary:focus-visible {
--pico-form-element-active-background-color: #fff;
--pico-form-element-active-border-color: var(--pico-primary-border);
--pico-form-element-focus-color: var(--pico-primary-border);
--pico-form-element-disabled-background-color: var(--pico-form-element-background-color);
--pico-form-element-disabled-border-color: var(--pico-form-element-border-color);
--pico-form-element-disabled-opacity: 0.5;
--pico-form-element-invalid-border-color: #b86a6b;
--pico-form-element-invalid-active-border-color: #c84f48;
@ -408,8 +406,6 @@ nav details.dropdown summary:focus-visible {
--pico-form-element-active-background-color: #1a1f28;
--pico-form-element-active-border-color: var(--pico-primary-border);
--pico-form-element-focus-color: var(--pico-primary-border);
--pico-form-element-disabled-background-color: var(--pico-form-element-background-color);
--pico-form-element-disabled-border-color: var(--pico-form-element-border-color);
--pico-form-element-disabled-opacity: 0.5;
--pico-form-element-invalid-border-color: #964a50;
--pico-form-element-invalid-active-border-color: #b7403b;
@ -532,8 +528,6 @@ nav details.dropdown summary:focus-visible {
--pico-form-element-active-background-color: #1a1f28;
--pico-form-element-active-border-color: var(--pico-primary-border);
--pico-form-element-focus-color: var(--pico-primary-border);
--pico-form-element-disabled-background-color: var(--pico-form-element-background-color);
--pico-form-element-disabled-border-color: var(--pico-form-element-border-color);
--pico-form-element-disabled-opacity: 0.5;
--pico-form-element-invalid-border-color: #964a50;
--pico-form-element-invalid-active-border-color: #b7403b;
@ -1409,8 +1403,6 @@ select[disabled],
textarea[disabled],
label[aria-disabled=true],
:where(fieldset[disabled]) :is(input:not([type=submit], [type=button], [type=reset]), select, textarea) {
--pico-background-color: var(--pico-form-element-disabled-background-color);
--pico-border-color: var(--pico-form-element-disabled-border-color);
opacity: var(--pico-form-element-disabled-opacity);
pointer-events: none;
}

File diff suppressed because one or more lines are too long

View File

@ -254,8 +254,6 @@ input:not([type=submit],
--pico-form-element-active-background-color: #fff;
--pico-form-element-active-border-color: var(--pico-primary-border);
--pico-form-element-focus-color: var(--pico-primary-border);
--pico-form-element-disabled-background-color: var(--pico-form-element-background-color);
--pico-form-element-disabled-border-color: var(--pico-form-element-border-color);
--pico-form-element-disabled-opacity: 0.5;
--pico-form-element-invalid-border-color: #b86a6b;
--pico-form-element-invalid-active-border-color: #c84f48;
@ -370,8 +368,6 @@ input:not([type=submit],
--pico-form-element-active-background-color: #1a1f28;
--pico-form-element-active-border-color: var(--pico-primary-border);
--pico-form-element-focus-color: var(--pico-primary-border);
--pico-form-element-disabled-background-color: var(--pico-form-element-background-color);
--pico-form-element-disabled-border-color: var(--pico-form-element-border-color);
--pico-form-element-disabled-opacity: 0.5;
--pico-form-element-invalid-border-color: #964a50;
--pico-form-element-invalid-active-border-color: #b7403b;
@ -479,8 +475,6 @@ input:not([type=submit],
--pico-form-element-active-background-color: #1a1f28;
--pico-form-element-active-border-color: var(--pico-primary-border);
--pico-form-element-focus-color: var(--pico-primary-border);
--pico-form-element-disabled-background-color: var(--pico-form-element-background-color);
--pico-form-element-disabled-border-color: var(--pico-form-element-border-color);
--pico-form-element-disabled-opacity: 0.5;
--pico-form-element-invalid-border-color: #964a50;
--pico-form-element-invalid-active-border-color: #b7403b;
@ -1213,8 +1207,6 @@ select[disabled],
textarea[disabled],
label[aria-disabled=true],
:where(fieldset[disabled]) :is(input:not([type=submit], [type=button], [type=reset]), select, textarea) {
--pico-background-color: var(--pico-form-element-disabled-background-color);
--pico-border-color: var(--pico-form-element-disabled-border-color);
opacity: var(--pico-form-element-disabled-opacity);
pointer-events: none;
}

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

File diff suppressed because one or more lines are too long

View File

@ -238,10 +238,6 @@
label[aria-disabled="true"],
:where(fieldset[disabled])
:is(input:not([type="submit"], [type="button"], [type="reset"]), select, textarea) {
#{$css-var-prefix}background-color: var(
#{$css-var-prefix}form-element-disabled-background-color
);
#{$css-var-prefix}border-color: var(#{$css-var-prefix}form-element-disabled-border-color);
opacity: var(#{$css-var-prefix}form-element-disabled-opacity);
pointer-events: none;
}

View File

@ -113,12 +113,6 @@
#{$css-var-prefix}form-element-active-background-color: #{mix($slate-900, $slate-850, 75%)};
#{$css-var-prefix}form-element-active-border-color: var(#{$css-var-prefix}primary-border);
#{$css-var-prefix}form-element-focus-color: var(#{$css-var-prefix}primary-border);
#{$css-var-prefix}form-element-disabled-background-color: var(
#{$css-var-prefix}form-element-background-color
);
#{$css-var-prefix}form-element-disabled-border-color: var(
#{$css-var-prefix}form-element-border-color
);
#{$css-var-prefix}form-element-disabled-opacity: 0.5;
#{$css-var-prefix}form-element-invalid-border-color: #{mix($red-500, $slate-600)};
#{$css-var-prefix}form-element-invalid-active-border-color: #{mix($red-500, $slate-600, 75%)};

View File

@ -113,12 +113,6 @@
#{$css-var-prefix}form-element-active-background-color: #{$white};
#{$css-var-prefix}form-element-active-border-color: var(#{$css-var-prefix}primary-border);
#{$css-var-prefix}form-element-focus-color: var(#{$css-var-prefix}primary-border);
#{$css-var-prefix}form-element-disabled-background-color: var(
#{$css-var-prefix}form-element-background-color
);
#{$css-var-prefix}form-element-disabled-border-color: var(
#{$css-var-prefix}form-element-border-color
);
#{$css-var-prefix}form-element-disabled-opacity: 0.5;
#{$css-var-prefix}form-element-invalid-border-color: #{mix($red-500, $zinc-350)};
#{$css-var-prefix}form-element-invalid-active-border-color: #{mix($red-500, $zinc-350, 75%)};