import { motion } from "framer-motion";
import PlusIcon from "./icons/PlusIcon";

interface MoreProjectButtonProps {
  onClick?: () => void;
}

function MoreProjectButton({ onClick }: MoreProjectButtonProps) {
  return (
    <motion.button
      initial={{ opacity: 0 }}
      whileInView={{ opacity: 1 }}
      viewport={{ once: true, margin: "-100px" }}
      transition={{ duration: 1, ease: [0.58, 0.12, 0.27, 0.98], delay: 0.2 }}
      className="sm:aspect-[4/3] border border-[#3D425C] rounded-[48px] px-6 py-4 flex sm:flex-col sm:justify-center justify-between items-center gap-2"
      onClick={onClick}
    >
      <p className="font-gilroy font-medium leading-none">Показать еще</p>
      <PlusIcon />
    </motion.button>
  );
}

export default MoreProjectButton;