@wulperstudio/cms
Version:
Wulper Studio Library Components CMS
46 lines • 1.23 kB
JavaScript
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
import { styled } from '@mui/material';
import { Button } from '../../../components';
export var CustomButton = styled(Button)(function (_ref) {
var expanded = _ref.expanded,
theme = _ref.theme;
return _defineProperty({
fontSize: '16px',
minHeight: 56,
borderRadius: '40px',
fontWeight: expanded ? 600 : 500,
minWidth: 250,
color: '#fff',
background: expanded ? 'linear-gradient(to right, #8e2de2, #4a00e0)' : '#191C31',
'&:hover': {
background: 'linear-gradient(to right, #8e2de2, #4a00e0)'
},
'&::before, &::after': {
position: 'unset',
top: 0,
left: 0,
width: '100%',
height: '100%',
zIndex: 0
},
'&::before': {
content: 'unset',
background: '#191C31',
width: '120%',
left: '-10%',
transform: 'skew(30deg)',
transition: 'transform 0.4s cubic-bezier(0.3, 1, 0.8, 1)'
},
'&:hover::before': {
transform: 'translate3d(100%, 0, 0)'
},
'& span': {
position: 'relative'
},
'&:active': {
transform: 'scale(0.95)'
}
}, theme.breakpoints.down('md'), {
minWidth: '100%'
});
});