diff options
author | Stefan Malzner <stefan@adlk.io> | 2019-01-15 11:59:39 +0100 |
---|---|---|
committer | Stefan Malzner <stefan@adlk.io> | 2019-01-15 11:59:39 +0100 |
commit | e31248830eb63c8bff3d9add3baa4ca8916b74e1 (patch) | |
tree | 5424634ccd5861fdf53340ad3f1001922394c5a9 /packages/forms | |
parent | Publish (diff) | |
download | ferdium-app-e31248830eb63c8bff3d9add3baa4ca8916b74e1.tar.gz ferdium-app-e31248830eb63c8bff3d9add3baa4ca8916b74e1.tar.zst ferdium-app-e31248830eb63c8bff3d9add3baa4ca8916b74e1.zip |
Button, add missing success state
Diffstat (limited to 'packages/forms')
-rw-r--r-- | packages/forms/src/button/index.tsx | 12 |
1 files changed, 11 insertions, 1 deletions
diff --git a/packages/forms/src/button/index.tsx b/packages/forms/src/button/index.tsx index d2c5ad96d..784ead04c 100644 --- a/packages/forms/src/button/index.tsx +++ b/packages/forms/src/button/index.tsx | |||
@@ -10,7 +10,7 @@ import Loader from 'react-loader'; | |||
10 | 10 | ||
11 | import { IFormField, IWithStyle } from '../typings/generic'; | 11 | import { IFormField, IWithStyle } from '../typings/generic'; |
12 | 12 | ||
13 | type ButtonType = 'primary' | 'secondary' | 'danger' | 'warning' | 'inverted'; | 13 | type ButtonType = 'primary' | 'secondary' | 'success' | 'danger' | 'warning' | 'inverted'; |
14 | 14 | ||
15 | interface IProps extends React.InputHTMLAttributes<HTMLButtonElement>, IFormField, IWithStyle { | 15 | interface IProps extends React.InputHTMLAttributes<HTMLButtonElement>, IFormField, IWithStyle { |
16 | buttonType?: ButtonType; | 16 | buttonType?: ButtonType; |
@@ -61,6 +61,14 @@ const styles = (theme: Theme) => ({ | |||
61 | fill: theme.buttonSecondaryTextColor, | 61 | fill: theme.buttonSecondaryTextColor, |
62 | }, | 62 | }, |
63 | }, | 63 | }, |
64 | success: { | ||
65 | background: theme.buttonSuccessBackground, | ||
66 | color: theme.buttonSuccessTextColor, | ||
67 | |||
68 | '& svg': { | ||
69 | fill: theme.buttonSuccessTextColor, | ||
70 | }, | ||
71 | }, | ||
64 | danger: { | 72 | danger: { |
65 | background: theme.buttonDangerBackground, | 73 | background: theme.buttonDangerBackground, |
66 | color: theme.buttonDangerTextColor, | 74 | color: theme.buttonDangerTextColor, |
@@ -144,6 +152,7 @@ class ButtonComponent extends Component<IProps> { | |||
144 | render() { | 152 | render() { |
145 | const { | 153 | const { |
146 | classes, | 154 | classes, |
155 | className, | ||
147 | theme, | 156 | theme, |
148 | disabled, | 157 | disabled, |
149 | id, | 158 | id, |
@@ -185,6 +194,7 @@ class ButtonComponent extends Component<IProps> { | |||
185 | [`${classes.button}`]: true, | 194 | [`${classes.button}`]: true, |
186 | [`${classes[buttonType as ButtonType]}`]: true, | 195 | [`${classes[buttonType as ButtonType]}`]: true, |
187 | [`${classes.disabled}`]: disabled, | 196 | [`${classes.disabled}`]: disabled, |
197 | [`${className}`]: className, | ||
188 | })} | 198 | })} |
189 | disabled={disabled} | 199 | disabled={disabled} |
190 | > | 200 | > |