diff options
Diffstat (limited to 'src/components/atoms/buttons')
| -rw-r--r-- | src/components/atoms/buttons/button.stories.tsx | 4 | ||||
| -rw-r--r-- | src/components/atoms/buttons/button.tsx | 6 | ||||
| -rw-r--r-- | src/components/atoms/buttons/buttons.module.scss | 8 |
3 files changed, 10 insertions, 8 deletions
diff --git a/src/components/atoms/buttons/button.stories.tsx b/src/components/atoms/buttons/button.stories.tsx index 1061d83..d47a1ea 100644 --- a/src/components/atoms/buttons/button.stories.tsx +++ b/src/components/atoms/buttons/button.stories.tsx @@ -65,7 +65,7 @@ export default { type: 'select', }, description: 'Button kind.', - options: ['primary', 'secondary', 'tertiary'], + options: ['primary', 'secondary', 'tertiary', 'neutral'], table: { category: 'Options', defaultValue: { summary: 'secondary' }, @@ -93,7 +93,7 @@ export default { type: 'select', }, description: 'The link shape.', - options: ['circle', 'rectangle', 'square'], + options: ['circle', 'rectangle', 'square', 'initial'], table: { category: 'Options', defaultValue: { summary: 'rectangle' }, diff --git a/src/components/atoms/buttons/button.tsx b/src/components/atoms/buttons/button.tsx index b223046..545c5c5 100644 --- a/src/components/atoms/buttons/button.tsx +++ b/src/components/atoms/buttons/button.tsx @@ -9,7 +9,7 @@ export type ButtonProps = { /** * Button accessible label. */ - ariaLabel?: string; + 'aria-label'?: string; /** * Button state. Default: false. */ @@ -25,7 +25,7 @@ export type ButtonProps = { /** * Button shape. Default: rectangle. */ - shape?: 'circle' | 'rectangle' | 'square'; + shape?: 'circle' | 'rectangle' | 'square' | 'initial'; /** * Button type attribute. Default: button. */ @@ -39,7 +39,6 @@ export type ButtonProps = { */ const Button: FC<ButtonProps> = ({ className = '', - ariaLabel, children, disabled = false, kind = 'secondary', @@ -55,7 +54,6 @@ const Button: FC<ButtonProps> = ({ type={type} disabled={disabled} className={`${styles.btn} ${kindClass} ${shapeClass} ${className}`} - aria-label={ariaLabel} {...props} > {children} diff --git a/src/components/atoms/buttons/buttons.module.scss b/src/components/atoms/buttons/buttons.module.scss index 87c92db..8e3e196 100644 --- a/src/components/atoms/buttons/buttons.module.scss +++ b/src/components/atoms/buttons/buttons.module.scss @@ -10,6 +10,10 @@ font-weight: 600; transition: all 0.3s ease-in-out 0s; + &--initial { + border-radius: 0; + } + &--rectangle { padding: var(--spacing-2xs) var(--spacing-md); } @@ -107,7 +111,7 @@ fun.convert-px(-4) var(--color-shadow-light), fun.convert-px(7) fun.convert-px(10) fun.convert-px(12) fun.convert-px(-3) var(--color-shadow-light); - transform: scale(1.1); + transform: scale(var(--scale-up, 1.1)); } &:focus { @@ -119,7 +123,7 @@ box-shadow: 0 0 0 0 var(--color-shadow); color: var(--color-primary-dark); text-decoration: underline transparent 0; - transform: scale(0.94); + transform: scale(var(--scale-down, 0.94)); } } } |
