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

export default function AddEmoji() {
  return (
    <Box
      sx={{
        height: "40px",
        width: "60px",
        display: "flex",
        alignItems: "center",
        justifyContent: "center",
      }}
    >
      <svg
        width="60"
        height="40"
        viewBox="0 0 60 40"
        fill="none"
        xmlns="http://www.w3.org/2000/svg"
      >
        <path
          d="M40.3333 0H1.66667C0.746192 0 0 0.89543 0 2V38C0 39.1046 0.746192 40 1.66667 40H40.3333V0Z"
          fill="#EEE4FC"
        />
        <path
          d="M58 0H40V40H58C58.4602 40 60 39.1046 60 38V2C60 0.89543 58.4602 0 58 0Z"
          fill="#7E2AEA"
        />
        <path
          d="M49.518 24.612C49.398 24.612 49.296 24.576 49.212 24.504C49.14 24.42 49.104 24.318 49.104 24.198V20.454H45.414C45.294 20.454 45.192 20.418 45.108 20.346C45.036 20.262 45 20.16 45 20.04V19.464C45 19.344 45.036 19.248 45.108 19.176C45.192 19.092 45.294 19.05 45.414 19.05H49.104V15.414C49.104 15.294 49.14 15.198 49.212 15.126C49.296 15.042 49.398 15 49.518 15H50.148C50.268 15 50.364 15.042 50.436 15.126C50.52 15.198 50.562 15.294 50.562 15.414V19.05H54.27C54.39 19.05 54.486 19.092 54.558 19.176C54.642 19.248 54.684 19.344 54.684 19.464V20.04C54.684 20.16 54.642 20.262 54.558 20.346C54.486 20.418 54.39 20.454 54.27 20.454H50.562V24.198C50.562 24.318 50.52 24.42 50.436 24.504C50.364 24.576 50.268 24.612 50.148 24.612H49.518Z"
          fill="white"
        />
        <path
          d="M20 31C21.0949 30.9993 22.1837 30.8371 23.2313 30.5187L31 20C31 17.8244 30.3549 15.6977 29.1462 13.8887C27.9375 12.0798 26.2195 10.6699 24.2095 9.83733C22.1995 9.00477 19.9878 8.78693 17.854 9.21137C15.7202 9.6358 13.7602 10.6835 12.2218 12.2218C10.6835 13.7602 9.6358 15.7202 9.21137 17.854C8.78693 19.9878 9.00477 22.1995 9.83733 24.2095C10.6699 26.2195 12.0798 27.9375 13.8887 29.1462C15.6977 30.3549 17.8244 31 20 31Z"
          stroke="#7E2AEA"
          strokeWidth="2"
          strokeLinecap="round"
          strokeLinejoin="round"
        />
        <path
          d="M15.875 19.084C16.6344 19.084 17.25 18.4684 17.25 17.709C17.25 16.9496 16.6344 16.334 15.875 16.334C15.1156 16.334 14.5 16.9496 14.5 17.709C14.5 18.4684 15.1156 19.084 15.875 19.084Z"
          fill="#7E2AEA"
        />
        <path
          d="M24.125 19.084C24.8844 19.084 25.5 18.4684 25.5 17.709C25.5 16.9496 24.8844 16.334 24.125 16.334C23.3656 16.334 22.75 16.9496 22.75 17.709C22.75 18.4684 23.3656 19.084 24.125 19.084Z"
          fill="#7E2AEA"
        />
        <path
          d="M24.7677 22.75C24.2831 23.5849 23.5878 24.2778 22.7512 24.7595C21.9147 25.2412 20.9663 25.4947 20.001 25.4947C19.0357 25.4947 18.0874 25.2412 17.2508 24.7595C16.4143 24.2778 15.719 23.5849 15.2344 22.75"
          stroke="#7E2AEA"
          strokeWidth="2"
          strokeLinecap="round"
          strokeLinejoin="round"
        />
      </svg>
    </Box>
  );
}