// ** MUI Imports import Box from '@mui/material/Box' import Card from '@mui/material/Card' import Button from '@mui/material/Button' import Typography from '@mui/material/Typography' import Grid, { GridProps } from '@mui/material/Grid' import { styled, useTheme } from '@mui/material/styles' import MuiCardContent, { CardContentProps } from '@mui/material/CardContent' // Styled CardContent component const CardContent = styled(MuiCardContent)(({ theme }) => ({ padding: `${theme.spacing(7, 7.5)} !important`, [theme.breakpoints.down('sm')]: { paddingBottom: '0 !important' } })) // Styled Grid component const StyledGrid = styled(Grid)(({ theme }) => ({ [theme.breakpoints.down('sm')]: { display: 'flex', justifyContent: 'center' } })) // Styled component for the image const Img = styled('img')(({ theme }) => ({ right: 0, bottom: 0, width: 298, position: 'absolute', [theme.breakpoints.down('sm')]: { width: 250, position: 'static' } })) const CardCongratulationsDaisy = () => { // ** Hook const theme = useTheme() return ( `${theme.spacing(7, 7.5)} !important` }}> Congratulations{' '} Daisy ! 🎉 You have done 84% 😍 more task today. Check your new badge in your profile. Congratulations Daisy ) } export default CardCongratulationsDaisy