Skip to content

Commit

Permalink
feat(button): Success variant (#96)
Browse files Browse the repository at this point in the history
  • Loading branch information
hachiojidev authored Dec 16, 2020
1 parent cb6c5f5 commit 8aae7be
Show file tree
Hide file tree
Showing 2 changed files with 15 additions and 1 deletion.
15 changes: 14 additions & 1 deletion src/components/Button/theme.ts
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import { ButtonTheme, variants } from "./types";
import { lightColors, darkColors } from "../../theme/colors";

const { PRIMARY, SECONDARY, TERTIARY, TEXT, DANGER, SUBTLE } = variants;
const { PRIMARY, SECONDARY, TERTIARY, TEXT, DANGER, SUBTLE, SUCCESS } = variants;

export const light: ButtonTheme = {
[PRIMARY]: {
Expand Down Expand Up @@ -64,6 +64,16 @@ export const light: ButtonTheme = {
boxShadowActive: "none",
color: "#FFFFFF",
},
[SUCCESS]: {
background: lightColors.success,
backgroundActive: `${lightColors.success}D9`, // 70% opacity
backgroundHover: `${lightColors.success}B3`, // 85% opacity
border: 0,
borderColorHover: "currentColor",
boxShadow: "none",
boxShadowActive: "none",
color: "#FFFFFF",
},
};

export const dark: ButtonTheme = {
Expand All @@ -90,4 +100,7 @@ export const dark: ButtonTheme = {
[SUBTLE]: {
...light.subtle,
},
[SUCCESS]: {
...light.success,
},
};
1 change: 1 addition & 0 deletions src/components/Button/types.ts
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@ export const variants = {
TEXT: "text",
DANGER: "danger",
SUBTLE: "subtle",
SUCCESS: "success",
} as const;

export type Sizes = typeof sizes[keyof typeof sizes];
Expand Down

0 comments on commit 8aae7be

Please sign in to comment.