From b9b2f9f2c3e9523743495f592f923906f98ffb7f Mon Sep 17 00:00:00 2001 From: unknown Date: Wed, 8 Sep 2021 19:33:29 +0530 Subject: [PATCH] Added positive vaiant in button --- src/app/atoms/button/Button.jsx | 2 +- src/app/atoms/button/Button.scss | 8 ++++++++ 2 files changed, 9 insertions(+), 1 deletion(-) diff --git a/src/app/atoms/button/Button.jsx b/src/app/atoms/button/Button.jsx index bfe06f6..bebca86 100644 --- a/src/app/atoms/button/Button.jsx +++ b/src/app/atoms/button/Button.jsx @@ -40,7 +40,7 @@ Button.defaultProps = { Button.propTypes = { id: PropTypes.string, className: PropTypes.string, - variant: PropTypes.oneOf(['surface', 'primary', 'caution', 'danger']), + variant: PropTypes.oneOf(['surface', 'primary', 'positive', 'caution', 'danger']), iconSrc: PropTypes.string, type: PropTypes.oneOf(['button', 'submit']), onClick: PropTypes.func, diff --git a/src/app/atoms/button/Button.scss b/src/app/atoms/button/Button.scss index 224c634..1426500 100644 --- a/src/app/atoms/button/Button.scss +++ b/src/app/atoms/button/Button.scss @@ -2,6 +2,7 @@ .btn-surface, .btn-primary, +.btn-positive, .btn-caution, .btn-danger { display: inline-flex; @@ -67,6 +68,13 @@ @include state.focus(var(--bs-primary-outline)); @include state.active(var(--bg-primary-active)); } +.btn-positive { + box-shadow: var(--bs-positive-border); + @include color(var(--tc-positive-high), var(--ic-positive-normal)); + @include state.hover(var(--bg-positive-hover)); + @include state.focus(var(--bs-positive-outline)); + @include state.active(var(--bg-positive-active)); +} .btn-caution { box-shadow: var(--bs-caution-border); @include color(var(--tc-caution-high), var(--ic-caution-normal));