pos-dashboard-v2/src/components/dialogs/DialogCloseButton.tsx
2025-08-05 12:35:40 +07:00

31 lines
828 B
TypeScript

'use client'
//Mui Imports
import { styled } from '@mui/material'
import Button from '@mui/material/Button'
import type { ButtonProps } from '@mui/material/Button'
const DialogCloseButton = styled(Button)<ButtonProps>({
top: 0,
right: 0,
color: 'var(--mui-palette-text-disabled)',
position: 'absolute',
boxShadow: 'var(--mui-customShadows-xs)',
transform: 'translate(9px, -10px)',
borderRadius: 'var(--mui-shape-customBorderRadius-sm)',
backgroundColor: 'var(--mui-palette-background-paper) !important',
transition: 'transform 0.25s ease-in-out, box-shadow 0.25s ease-in-out',
blockSize: 30,
inlineSize: 30,
minInlineSize: 0,
padding: 0,
'&:hover, &:active': {
transform: 'translate(7px, -5px) !important'
},
'& i, & svg': {
fontSize: '1.25rem'
}
})
export default DialogCloseButton