mirror of
https://github.com/primer/css.git
synced 2024-09-11 16:36:07 +03:00
Use control
tokens for legacy form CSS (#2510)
* use control tokens * Create early-seas-peel.md
This commit is contained in:
parent
4c3826fac6
commit
49e81506a9
5
.changeset/early-seas-peel.md
Normal file
5
.changeset/early-seas-peel.md
Normal file
@ -0,0 +1,5 @@
|
||||
---
|
||||
"@primer/css": patch
|
||||
---
|
||||
|
||||
Use `control` tokens for legacy form CSS border-color
|
@ -17,7 +17,7 @@
|
||||
background-color: var(--bgColor-default, var(--color-canvas-default));
|
||||
background-repeat: no-repeat; // Repeat and position set for form states (success, error, etc)
|
||||
background-position: right 8px center; // For form validation. This keeps images 8px from right and centered vertically.
|
||||
border: $border-width $border-style var(--borderColor-default, var(--color-border-default));
|
||||
border: $border-width $border-style var(--control-borderColor-rest, var(--color-border-default));
|
||||
border-radius: $border-radius;
|
||||
box-shadow: var(--shadow-inset, var(--color-primer-shadow-inset));
|
||||
transition: 80ms cubic-bezier(0.33, 1, 0.68, 1);
|
||||
@ -49,14 +49,14 @@
|
||||
|
||||
&[disabled],
|
||||
fieldset[disabled] & {
|
||||
color: var(--fgColor-disabled, var(--color-primer-fg-disabled));
|
||||
color: var(--control-fgColor-disabled, var(--color-primer-fg-disabled));
|
||||
background-color: var(--control-bgColor-disabled, var(--color-input-disabled-bg));
|
||||
border-color: var(--borderColor-default, var(--color-border-default));
|
||||
-webkit-text-fill-color: var(--fgColor-disabled, var(--color-primer-fg-disabled)); // Fix for Safari
|
||||
border-color: var(--control-borderColor-disabled, var(--color-border-default));
|
||||
-webkit-text-fill-color: var(--control-fgColor-disabled, var(--color-primer-fg-disabled)); // Fix for Safari
|
||||
opacity: 1; // Fix for Safari iOS
|
||||
|
||||
&::placeholder {
|
||||
color: var(--fgColor-disabled, var(--color-primer-fg-disabled));
|
||||
color: var(--control-fgColor-disabled, var(--color-primer-fg-disabled));
|
||||
}
|
||||
}
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user