Clip-Path Polygon Video Reveal

import styles from "./styles.module.css";

export default function ClipPathPolygonVideoReveal({ projects = [] }) {
  return (
    <div className={styles.grid}>
      {projects.map((project) => (
        <a key={project.title} href={project.href} className={styles.card}>
          <div className={styles.videoWrap}>
            <div
              className={styles.video}
              style={{ backgroundImage: `url(${project.image})` }}
            />
          </div>
          <div className={styles.info}>
            <span className={styles.title}>{project.title}</span>
            <span className={styles.category}>{project.category}</span>
          </div>
        </a>
      ))}
    </div>
  );
}