in src/components/features/index.tsx [8:62]
export function Feature({
medium,
large,
full,
square,
squareLarge,
plain,
centered,
children,
lightOnly,
className,
href,
index,
...props
}) {
return (
<motion.div
initial={{ opacity: 0 }}
whileInView={{ opacity: 1 }}
viewport={{ once: true, margin: '-20px' }}
transition={{ duration: Math.min(0.25 + index * 0.2, 0.8) }}
className={cn(
styles.feature,
medium && styles.medium,
large && styles.large,
full && styles.full,
square && styles.square,
squareLarge && styles['square-large'],
plain && styles.plain,
centered && styles.centered,
lightOnly && styles['light-only'],
className
)}
{...props}
>
{children}
{href ? (
<Link className={styles.link} href={href}>
<svg
xmlns="http://www.w3.org/2000/svg"
width="1.5em"
viewBox="0 0 20 20"
fill="currentColor"
>
<path
fillRule="evenodd"
d="M12.293 5.293a1 1 0 011.414 0l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414-1.414L14.586 11H3a1 1 0 110-2h11.586l-2.293-2.293a1 1 0 010-1.414z"
clipRule="evenodd"
/>
</svg>
</Link>
) : null}
</motion.div>
);
}