hippoz/cinny
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Added positive vaiant in button

Browse source
This commit is contained in:
unknown 2021-09-08 19:33:29 +05:30
parent cdf421f0f1
commit b9b2f9f2c3
2 changed files with 9 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/app/atoms/button/Button.jsx
View file

@ -40,7 +40,7 @@ Button.defaultProps = {
Button.propTypes = { Button.propTypes = {
id: PropTypes.string, id: PropTypes.string,
className: PropTypes.string, className: PropTypes.string,
variant: PropTypes.oneOf(['surface', 'primary', 'caution', 'danger']), variant: PropTypes.oneOf(['surface', 'primary', 'positive', 'caution', 'danger']),
iconSrc: PropTypes.string, iconSrc: PropTypes.string,
type: PropTypes.oneOf(['button', 'submit']), type: PropTypes.oneOf(['button', 'submit']),
onClick: PropTypes.func, onClick: PropTypes.func,

8
src/app/atoms/button/Button.scss
View file

@ -2,6 +2,7 @@
.btn-surface, .btn-surface,
.btn-primary, .btn-primary,
.btn-positive,
.btn-caution, .btn-caution,
.btn-danger { .btn-danger {
display: inline-flex; display: inline-flex;
@ -67,6 +68,13 @@
@include state.focus(var(--bs-primary-outline)); @include state.focus(var(--bs-primary-outline));
@include state.active(var(--bg-primary-active)); @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 { .btn-caution {
box-shadow: var(--bs-caution-border); box-shadow: var(--bs-caution-border);
@include color(var(--tc-caution-high), var(--ic-caution-normal)); @include color(var(--tc-caution-high), var(--ic-caution-normal));