import { Box } from "@mui/material";

interface Props {
  color: string;
  backgroundColor: string
}

export default function EmailIcon({ color, backgroundColor }: Props) {
  return (
    <Box
      sx={{
        // height: "38px",
        // width: "24px",
        display: "flex",
        alignItems: "center",
        justifyContent: "center",
        height: "58px",
        width: "42px",
        backgroundColor: {backgroundColor},
        borderBottomLeftRadius: "12px",
        borderTopLeftRadius: "12px",
      }}
    >
      <svg
        width="15"
        height="15"
        viewBox="0 0 15 15"
        fill="none"
        xmlns="http://www.w3.org/2000/svg"
      >
        <path
          d="M1.875 3.28125H13.125V11.25C13.125 11.3743 13.0756 11.4935 12.9877 11.5815C12.8998 11.6694 12.7806 11.7188 12.6562 11.7188H2.34375C2.21943 11.7188 2.1002 11.6694 2.01229 11.5815C1.92439 11.4935 1.875 11.3743 1.875 11.25V3.28125Z"
          stroke={color}
          strokeLinecap="round"
          strokeLinejoin="round"
        />
        <path
          d="M13.125 3.28125L7.5 8.4375L1.875 3.28125"
          stroke={color}
          strokeLinecap="round"
          strokeLinejoin="round"
        />
      </svg>
    </Box>
  );
}
