import { FC } from "react";
import { Box, Link, BoxProps } from "@mui/material";
import OrangeYoutube from "@/assets/icons/OrangeYoutube";

interface InstructionYoutubeLinkProps extends BoxProps {}

const InstructionYoutubeLink: FC<InstructionYoutubeLinkProps> = ({ sx, ...props }) => {
  return (
    <Box
      sx={{
        display: "flex",
        justifyContent: "right",
        ...sx,
      }}
      {...props}
    >
      <Link
        href="https://youtube.com"
        underline="hover"
        sx={{
          color: "#FA590B",
          display: "inline-flex",
          gap: "10px",
          fontSize: "16px"
        }}
      >
        <OrangeYoutube sx={{
          width: "24px",
          height: "24px",
        }} /> Смотреть инструкцию
      </Link>
    </Box>
  );
};

export default InstructionYoutubeLink;