Files
portfolio/app/components/Grain.tsx
denshooter a5dba298f3
Some checks failed
Dev Deployment (Zero Downtime) / deploy-dev (push) Failing after 9m26s
feat: major UI/UX overhaul, snippets system, and performance fixes
2026-02-16 12:31:40 +01:00

31 lines
840 B
TypeScript

"use client";
import { motion } from "framer-motion";
const Grain = () => {
return (
<div
className="pointer-events-none fixed inset-0 z-[9999] h-full w-full overflow-hidden"
>
<div
className="absolute inset-[-200%] h-[400%] w-[400%] bg-[url('/images/grain.png')] bg-repeat opacity-[0.03] dark:opacity-[0.05]"
style={{ transform: 'translate3d(0, 0, 0)' }}
/>
<motion.div
animate={{
x: [0, -50, 20, -10, 40, -20, 0],
y: [0, 20, -30, 10, -20, 30, 0],
}}
transition={{
duration: 0.5,
repeat: Infinity,
ease: "linear",
}}
className="absolute inset-[-200%] h-[400%] w-[400%] bg-[url('/images/grain.png')] bg-repeat opacity-[0.03] dark:opacity-[0.05]"
/>
</div>
);
};
export default Grain;