Update text tokens
Signed-off-by: Charles de Dreuille <charles.dedreuille@gmail.com>
This commit is contained in:
@@ -60,9 +60,9 @@
|
||||
--canon-bg: #f4f4f4;
|
||||
|
||||
/* Text colors */
|
||||
--canon-fg-primary: #000;
|
||||
--canon-fg-text-primary: #000;
|
||||
--canon-fg-accent: #fff;
|
||||
--canon-fg-secondary: #646464;
|
||||
--canon-fg-text-secondary: #646464;
|
||||
}
|
||||
|
||||
[data-theme-name='legacy'][data-theme='dark'] {
|
||||
@@ -82,7 +82,7 @@
|
||||
--canon-fg-danger: #f50000;
|
||||
|
||||
/* Text colors */
|
||||
--canon-fg-primary: #fff;
|
||||
--canon-fg-text-primary: #fff;
|
||||
--canon-fg-accent: #000;
|
||||
--canon-fg-secondary: #b3b3b3;
|
||||
--canon-fg-text-secondary: #b3b3b3;
|
||||
}
|
||||
|
||||
@@ -383,7 +383,7 @@ export const Border: Story = {
|
||||
args: {
|
||||
style: {
|
||||
background: 'var(--canon-bg-elevated)',
|
||||
color: 'var(--canon-fg-primary)',
|
||||
color: 'var(--canon-fg-text-primary)',
|
||||
padding: '4px 8px',
|
||||
width: '80px',
|
||||
height: '32px',
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
.canon-Box {
|
||||
font-family: var(--canon-font-regular);
|
||||
color: var(--canon-fg-primary);
|
||||
color: var(--canon-fg-text-primary);
|
||||
}
|
||||
|
||||
@@ -36,14 +36,14 @@
|
||||
&:hover {
|
||||
background-color: transparent;
|
||||
box-shadow: inset 0 0 0 1px var(--canon-border-focus);
|
||||
color: var(--canon-fg-primary);
|
||||
color: var(--canon-fg-text-primary);
|
||||
}
|
||||
}
|
||||
|
||||
.canon-Button--variant-secondary {
|
||||
background-color: transparent;
|
||||
box-shadow: inset 0 0 0 1px var(--canon-border);
|
||||
color: var(--canon-fg-primary);
|
||||
color: var(--canon-fg-text-primary);
|
||||
|
||||
&:hover {
|
||||
box-shadow: inset 0 0 0 1px var(--canon-border-hover);
|
||||
@@ -52,10 +52,10 @@
|
||||
|
||||
.canon-Button--variant-tertiary {
|
||||
background-color: transparent;
|
||||
color: var(--canon-fg-primary);
|
||||
color: var(--canon-fg-text-primary);
|
||||
|
||||
&:hover {
|
||||
color: var(--canon-fg-secondary);
|
||||
color: var(--canon-fg-text-secondary);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -23,7 +23,7 @@
|
||||
gap: var(--canon-space-2);
|
||||
font-size: var(--canon-font-size-xs);
|
||||
font-family: var(--canon-font-regular);
|
||||
color: var(--canon-fg-primary);
|
||||
color: var(--canon-fg-text-primary);
|
||||
user-select: none;
|
||||
|
||||
&:hover {
|
||||
|
||||
@@ -24,14 +24,14 @@
|
||||
.canon-FieldLabel {
|
||||
font-size: var(--canon-font-size-2);
|
||||
font-weight: var(--canon-font-weight-regular);
|
||||
color: var(--canon-fg-primary);
|
||||
color: var(--canon-fg-text-primary);
|
||||
margin-bottom: var(--canon-space-1_5);
|
||||
}
|
||||
|
||||
.canon-FieldDescription {
|
||||
font-size: var(--canon-font-size-2);
|
||||
font-weight: var(--canon-font-weight-regular);
|
||||
color: var(--canon-fg-secondary);
|
||||
color: var(--canon-fg-text-secondary);
|
||||
margin: 0;
|
||||
padding-top: var(--canon-space-1_5);
|
||||
}
|
||||
@@ -47,7 +47,7 @@
|
||||
.canon-FieldValidity {
|
||||
font-size: var(--canon-font-size-2);
|
||||
font-weight: var(--canon-font-weight-regular);
|
||||
color: var(--canon-fg-secondary);
|
||||
color: var(--canon-fg-text-secondary);
|
||||
margin: 0;
|
||||
padding-top: var(--canon-space-1_5);
|
||||
}
|
||||
|
||||
@@ -16,7 +16,7 @@
|
||||
|
||||
.canon-Heading {
|
||||
font-family: var(--canon-font-regular);
|
||||
color: var(--canon-fg-primary);
|
||||
color: var(--canon-fg-text-primary);
|
||||
line-height: 100%;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
|
||||
@@ -21,13 +21,13 @@
|
||||
background-color: var(--canon-bg-elevated);
|
||||
font-size: var(--canon-font-size-3);
|
||||
font-weight: var(--canon-font-weight-regular);
|
||||
color: var(--canon-fg-primary);
|
||||
color: var(--canon-fg-text-primary);
|
||||
transition: border-color 0.2s ease-in-out, outline-color 0.2s ease-in-out;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.canon-Input::placeholder {
|
||||
color: var(--canon-fg-secondary);
|
||||
color: var(--canon-fg-text-secondary);
|
||||
}
|
||||
|
||||
.canon-Input:hover {
|
||||
|
||||
@@ -16,7 +16,7 @@
|
||||
|
||||
.canon-Text {
|
||||
font-family: var(--canon-font-regular);
|
||||
color: var(--canon-fg-primary);
|
||||
color: var(--canon-fg-text-primary);
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
@@ -95,8 +95,8 @@
|
||||
--canon-border-hover: rgba(0, 0, 0, 0.2);
|
||||
--canon-border-success: #008000;
|
||||
--canon-border-warning: #e36d05;
|
||||
--canon-fg-primary: #000;
|
||||
--canon-fg-secondary: #646464;
|
||||
--canon-fg-text-primary: #000;
|
||||
--canon-fg-text-secondary: #646464;
|
||||
--canon-fg-link: #fff;
|
||||
--canon-fg-link-hover: #fff;
|
||||
--canon-fg-accent: #fff;
|
||||
@@ -137,6 +137,6 @@
|
||||
--canon-fg-warning: #e36d05;
|
||||
--canon-fg-link: #fff;
|
||||
--canon-fg-link-hover: #fff;
|
||||
--canon-fg-primary: #000;
|
||||
--canon-fg-secondary: #646464;
|
||||
--canon-fg-text-primary: #000;
|
||||
--canon-fg-text-secondary: #646464;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user