35 lines
792 B
TypeScript
35 lines
792 B
TypeScript
import { Delete } from "@mui/icons-material";
|
|
import { Theme, Button, ButtonProps } from "@mui/material";
|
|
import { red } from "@mui/material/colors";
|
|
import { makeStyles } from "@mui/styles";
|
|
|
|
const useStyles = makeStyles((theme: Theme) => ({
|
|
deleteButton: {
|
|
color: "#fff",
|
|
background: red["500"],
|
|
"&:hover": {
|
|
background: red["600"]
|
|
}
|
|
},
|
|
rightIcon: {
|
|
marginLeft: theme.spacing(1)
|
|
}
|
|
}));
|
|
|
|
const DeleteButton = (props: ButtonProps) => {
|
|
const classes = useStyles();
|
|
|
|
return (
|
|
<Button
|
|
variant="contained"
|
|
size="small"
|
|
{...props}
|
|
className={classes.deleteButton}
|
|
aria-label="Delete">
|
|
{props.children}
|
|
<Delete className={classes.rightIcon} fontSize="small" />
|
|
</Button>
|
|
);
|
|
};
|
|
|
|
export default DeleteButton;
|