@lifi/widget
Version:
LI.FI Widget for cross-chain bridging and swapping. It will drive your multi-chain strategy and attract new users from everywhere.
72 lines • 2.41 kB
JavaScript
import { Box, Skeleton, styled } from '@mui/material';
import { cardClasses } from '@mui/material/Card';
import { ButtonTertiary } from '../ButtonTertiary.js';
export const ButtonContainer = styled(Box)(({ theme }) => ({
display: 'flex',
gap: theme.spacing(0.5),
}));
export const MaxButton = styled(ButtonTertiary)(({ theme }) => ({
padding: theme.spacing(0.5, 1, 0.5, 1),
margin: theme.spacing(0, 0, 0, 0.5),
lineHeight: 1,
fontSize: '0.75rem',
minWidth: 'unset',
height: 24,
opacity: 0,
transform: 'scale(0.85) translateY(-10px)',
transition: 'opacity 200ms cubic-bezier(0.4, 0, 0.2, 1), transform 200ms cubic-bezier(0.4, 0, 0.2, 1)',
'&[data-delay="0"]': {
[`.${cardClasses.root}:hover &`]: {
opacity: 1,
transform: 'scale(1) translateY(0)',
transitionDelay: '75ms',
},
[`.${cardClasses.root}:not(:hover) &`]: {
opacity: 0,
transform: 'scale(0.85) translateY(-10px)',
transitionDelay: '0ms',
},
},
'&[data-delay="1"]': {
[`.${cardClasses.root}:hover &`]: {
opacity: 1,
transform: 'scale(1) translateY(0)',
transitionDelay: '50ms',
},
[`.${cardClasses.root}:not(:hover) &`]: {
opacity: 0,
transform: 'scale(0.85) translateY(-10px)',
transitionDelay: '25ms',
},
},
'&[data-delay="2"]': {
[`.${cardClasses.root}:hover &`]: {
opacity: 1,
transform: 'scale(1) translateY(0)',
transitionDelay: '25ms',
},
[`.${cardClasses.root}:not(:hover) &`]: {
opacity: 0,
transform: 'scale(0.85) translateY(-10px)',
transitionDelay: '50ms',
},
},
'&[data-delay="3"]': {
[`.${cardClasses.root}:hover &`]: {
opacity: 1,
transform: 'scale(1) translateY(0)',
transitionDelay: '0ms',
},
[`.${cardClasses.root}:not(:hover) &`]: {
opacity: 0,
transform: 'scale(0.85) translateY(-10px)',
transitionDelay: '75ms',
},
},
}));
export const MaxButtonSkeleton = styled(Skeleton)(({ theme }) => ({
width: 46,
height: 24,
borderRadius: theme.vars.shape.borderRadiusSecondary,
}));
//# sourceMappingURL=AmountInputAdornment.style.js.map