Add error color

This commit is contained in:
Germán Martínez 2019-05-22 12:37:44 +02:00
parent 0922c57d87
commit 08bcdbb1b0
8 changed files with 19 additions and 4 deletions

View File

@ -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 = ({

View File

@ -74,6 +74,10 @@
color: $disabled; color: $disabled;
} }
.error {
color: $error;
}
.white { .white {
color: white; color: white;
} }

View File

@ -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,

View File

@ -95,6 +95,10 @@
color: $disabled; color: $disabled;
} }
.error {
color: $error;
}
.white { .white {
color: white; color: white;
} }

View File

@ -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,

View File

@ -35,6 +35,10 @@
color: $disabled; color: $disabled;
} }
.error {
color: $error;
}
.white { .white {
color: white; color: white;
} }

View File

@ -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,

View File

@ -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,