remove button
This commit is contained in:
parent
119eb47947
commit
4a9c87d8d8
2 changed files with 0 additions and 69 deletions
|
@ -1,59 +0,0 @@
|
|||
import { styled } from 'lib/themedStyles';
|
||||
|
||||
export interface ButtonProps {
|
||||
buttonType: 'primary' | 'secondary';
|
||||
buttonSize: 'S' | 'M' | 'L';
|
||||
isInverted?: boolean;
|
||||
}
|
||||
|
||||
const StyledButton = styled('button')<ButtonProps>`
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0px 12px;
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
white-space: nowrap;
|
||||
margin-right: 0.5rem;
|
||||
margin-bottom: 0.5rem;
|
||||
|
||||
background: ${(props) =>
|
||||
props.isInverted
|
||||
? 'transparent'
|
||||
: props.theme.buttonStyles[props.buttonType].backgroundColor.normal};
|
||||
color: ${(props) =>
|
||||
props.isInverted
|
||||
? props.theme.buttonStyles[props.buttonType].invertedColors.normal
|
||||
: props.theme.buttonStyles[props.buttonType].color};
|
||||
font-size: ${(props) => props.theme.buttonStyles.fontSize[props.buttonSize]};
|
||||
height: ${(props) => props.theme.buttonStyles.height[props.buttonSize]};
|
||||
|
||||
&:hover:enabled {
|
||||
background: ${(props) =>
|
||||
props.isInverted
|
||||
? 'transparent'
|
||||
: props.theme.buttonStyles[props.buttonType].backgroundColor.hover};
|
||||
color: ${(props) =>
|
||||
props.isInverted
|
||||
? props.theme.buttonStyles[props.buttonType].invertedColors.hover
|
||||
: props.theme.buttonStyles[props.buttonType].color};
|
||||
cursor: pointer;
|
||||
}
|
||||
&:active:enabled {
|
||||
background: ${(props) =>
|
||||
props.isInverted
|
||||
? 'transparent'
|
||||
: props.theme.buttonStyles[props.buttonType].backgroundColor.active};
|
||||
color: ${(props) =>
|
||||
props.isInverted
|
||||
? props.theme.buttonStyles[props.buttonType].invertedColors.active
|
||||
: props.theme.buttonStyles[props.buttonType].color};
|
||||
}
|
||||
&:disabled {
|
||||
opacity: 0.5;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
`;
|
||||
|
||||
export default StyledButton;
|
|
@ -1,10 +0,0 @@
|
|||
import StyledButton, {
|
||||
ButtonProps,
|
||||
} from 'components/common/Button/Button.styled';
|
||||
import React from 'react';
|
||||
|
||||
type Props = ButtonProps;
|
||||
|
||||
export const Button: React.FC<Props> = (props) => {
|
||||
return <StyledButton {...props} />;
|
||||
};
|
Loading…
Add table
Reference in a new issue