@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.
73 lines • 2.31 kB
JavaScript
import { Box, Button, Card as MuiCard, styled } from '@mui/material';
import { InputCard } from '../../components/Card/InputCard.js';
export const SkeletonHeaderAppBar = styled(Box)(({ theme }) => ({
display: 'flex',
flexDirection: 'row',
justifyContent: 'flex-end',
alignItems: 'center',
color: theme.vars?.palette?.text.primary,
paddingRight: theme.navigation?.edge ? 0 : theme.spacing?.(1),
}));
export const SkeletonWalletMenuButtonContainer = styled(Box)(({ theme }) => ({
display: 'flex',
alignItems: 'center',
padding: theme.spacing(1, 0, 1, 1.5),
gap: theme.spacing(1),
}));
export const SkeletonCardRow = styled(Box)(({ theme }) => ({
display: 'flex',
gap: theme.spacing(2),
alignItems: 'center',
marginTop: theme.spacing(1.5),
}));
export const SkeletonAmountContainer = styled(Box)({
display: 'flex',
flexDirection: 'column',
justifyContent: 'center',
height: 40,
overflowY: 'hidden',
});
export const SkeletonCard = styled(MuiCard)(({ theme }) => ({
padding: theme.spacing(1.5, 2, 2),
}));
export const SkeletonInputCard = styled(InputCard)(({ theme }) => ({
padding: theme.spacing(1.5, 2, 2),
}));
export const SkeletonReviewButtonContainer = styled(Box)(({ theme }) => ({
display: 'flex',
gap: theme.spacing(1.5),
alignItems: 'center',
}));
export const SkeletonReviewButton = styled(Button)({
height: 48,
pointerEvents: 'none',
});
export const SkeletonSendToWalletButton = styled(Button)({
height: 48,
minWidth: 48,
width: 48,
pointerEvents: 'none',
});
export const SkeletonPoweredByContainer = styled(Box)(({ theme }) => ({
display: 'flex',
flexGrow: 1,
justifyContent: 'flex-end',
alignItems: 'flex-end',
paddingBottom: theme.spacing(2),
paddingLeft: theme.spacing(3),
paddingRight: theme.spacing(3),
}));
export const SkeletonHeaderContainer = styled(Box)(({ theme }) => {
return {
display: 'flex',
flexDirection: 'column',
backgroundColor: theme.vars.palette.background.default,
position: 'relative',
top: 0,
zIndex: 1200,
gap: theme.spacing(0.5),
padding: theme.spacing(1.5, 3, 1.5, 3),
overflow: 'auto',
};
});
//# sourceMappingURL=WidgetSkeleton.style.js.map