Component ContactButton

src/components/ContactButton.jsx

+import React from "react"
+
+import PropTypes from "prop-types"
+
+import { styled } from "@mui/material/styles"
+import Button from "@mui/material/Button"
+import ArrowForwardIosRoundedIcon from "@mui/icons-material/ArrowForwardIosRounded"
+
+import theme from "./palette"
+
+const myPalette = theme.palette
+
+const CustomButton = styled(Button)(({ theme }) => ({
+  color: myPalette.secondary.contrastText,
+  backgroundColor: myPalette.secondary.main,
+  "&:hover": {
+    backgroundColor: myPalette.secondary.light,
+  },
+}))
+
+ContactButton.propTypes = {
+  children: PropTypes.element.isRequired,
+}
+
+function ContactButton({ children }) {
+  return (
+    <CustomButton
+      variant="contained"
+      type="submit"
+      fullWidth
+      sx={{ mt: 1, mb: 2 }}
+      endIcon={<ArrowForwardIosRoundedIcon />}
+    >
+      { children }
+    </CustomButton>
+  )
+}
+
+export default ContactButton