Add error color
This commit is contained in:
parent
0922c57d87
commit
08bcdbb1b0
|
@ -11,7 +11,7 @@ type Props = {
|
||||||
type: 'button' | 'submit' | 'reset',
|
type: 'button' | 'submit' | 'reset',
|
||||||
size?: 'sm' | 'md' | 'lg' | 'xl' | 'xxl',
|
size?: 'sm' | 'md' | 'lg' | 'xl' | 'xxl',
|
||||||
weight?: 'light' | 'regular' | 'bolder' | 'bold',
|
weight?: 'light' | 'regular' | 'bolder' | 'bold',
|
||||||
color?: 'soft' | 'medium' | 'dark' | 'white' | 'fancy' | 'primary' | 'secondary' | 'warning' | 'disabled',
|
color?: 'soft' | 'medium' | 'dark' | 'white' | 'fancy' | 'primary' | 'secondary' | 'warning' | 'disabled' | 'error',
|
||||||
}
|
}
|
||||||
|
|
||||||
const GnoButtonLink = ({
|
const GnoButtonLink = ({
|
||||||
|
|
|
@ -74,6 +74,10 @@
|
||||||
color: $disabled;
|
color: $disabled;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.error {
|
||||||
|
color: $error;
|
||||||
|
}
|
||||||
|
|
||||||
.white {
|
.white {
|
||||||
color: white;
|
color: white;
|
||||||
}
|
}
|
|
@ -11,7 +11,7 @@ type HeadingTag = 'h1' | 'h2' | 'h3' | 'h4';
|
||||||
type Props = {
|
type Props = {
|
||||||
align?: 'left' | 'center' | 'right',
|
align?: 'left' | 'center' | 'right',
|
||||||
margin?: 'sm' | 'md' | 'lg' | 'xl',
|
margin?: 'sm' | 'md' | 'lg' | 'xl',
|
||||||
color?: 'soft' | 'medium' | 'dark' | 'white' | 'fancy' | 'primary' | 'secondary' | 'warning' | 'disabled',
|
color?: 'soft' | 'medium' | 'dark' | 'white' | 'fancy' | 'primary' | 'secondary' | 'warning' | 'disabled' | 'error',
|
||||||
tag: HeadingTag,
|
tag: HeadingTag,
|
||||||
truncate?: boolean,
|
truncate?: boolean,
|
||||||
children: React$Node,
|
children: React$Node,
|
||||||
|
|
|
@ -95,6 +95,10 @@
|
||||||
color: $disabled;
|
color: $disabled;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.error {
|
||||||
|
color: $error;
|
||||||
|
}
|
||||||
|
|
||||||
.white {
|
.white {
|
||||||
color: white;
|
color: white;
|
||||||
}
|
}
|
||||||
|
|
|
@ -11,7 +11,7 @@ type Props = {
|
||||||
noPadding?: boolean,
|
noPadding?: boolean,
|
||||||
weight?: 'light' | 'regular' | 'bolder' | 'bold',
|
weight?: 'light' | 'regular' | 'bolder' | 'bold',
|
||||||
size?: 'sm' | 'md' | 'lg' | 'xl' | 'xxl',
|
size?: 'sm' | 'md' | 'lg' | 'xl' | 'xxl',
|
||||||
color?: 'soft' | 'medium' | 'dark' | 'white' | 'fancy' | 'primary' | 'secondary' | 'warning' | 'disabled',
|
color?: 'soft' | 'medium' | 'dark' | 'white' | 'fancy' | 'primary' | 'secondary' | 'warning' | 'disabled' | 'error',
|
||||||
transform?: 'capitalize' | 'lowercase' | 'uppercase',
|
transform?: 'capitalize' | 'lowercase' | 'uppercase',
|
||||||
children: React$Node,
|
children: React$Node,
|
||||||
dot?: boolean,
|
dot?: boolean,
|
||||||
|
|
|
@ -35,6 +35,10 @@
|
||||||
color: $disabled;
|
color: $disabled;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.error {
|
||||||
|
color: $error;
|
||||||
|
}
|
||||||
|
|
||||||
.white {
|
.white {
|
||||||
color: white;
|
color: white;
|
||||||
}
|
}
|
||||||
|
|
|
@ -7,6 +7,7 @@ import {
|
||||||
disabled,
|
disabled,
|
||||||
primary,
|
primary,
|
||||||
secondary,
|
secondary,
|
||||||
|
error,
|
||||||
md,
|
md,
|
||||||
lg,
|
lg,
|
||||||
bolderFont,
|
bolderFont,
|
||||||
|
@ -27,7 +28,7 @@ const palette = {
|
||||||
main: secondary,
|
main: secondary,
|
||||||
},
|
},
|
||||||
error: {
|
error: {
|
||||||
main: '#FB4F62',
|
main: error,
|
||||||
},
|
},
|
||||||
contrastThreshold: 3,
|
contrastThreshold: 3,
|
||||||
tonalOffset: 0.2,
|
tonalOffset: 0.2,
|
||||||
|
|
|
@ -7,6 +7,7 @@ const tertiary = '#f6f9fc'
|
||||||
const fontColor = '#4a5579'
|
const fontColor = '#4a5579'
|
||||||
const fancyColor = '#fd7890'
|
const fancyColor = '#fd7890'
|
||||||
const warningColor = '#ffc05f'
|
const warningColor = '#ffc05f'
|
||||||
|
const errorColor = '#fb4f62'
|
||||||
const connectedColor = '#00c4c4'
|
const connectedColor = '#00c4c4'
|
||||||
const disabled = '#65707e'
|
const disabled = '#65707e'
|
||||||
const xs = '4px'
|
const xs = '4px'
|
||||||
|
@ -28,6 +29,7 @@ module.exports = Object.assign(
|
||||||
fontColor,
|
fontColor,
|
||||||
fancy: fancyColor,
|
fancy: fancyColor,
|
||||||
warning: warningColor,
|
warning: warningColor,
|
||||||
|
error: errorColor,
|
||||||
connected: connectedColor,
|
connected: connectedColor,
|
||||||
xs,
|
xs,
|
||||||
sm,
|
sm,
|
||||||
|
|
Loading…
Reference in New Issue