Hope you all like this!

Author: Deadcoder001

Ashif/package-lock.json

@@ -17,7 +17,7 @@ export default function About({ scrollContainerRef }) {
           scrollContainerRef={scrollContainerRef}
           baseOpacity={0}
           enableBlur={true}
-          baseRotation={5}
+          baseRotation={0}
           blurStrength={10}
           containerClassName="my-12"
           textClassName="font-sans text-base sm:text-lg md:text-xl"

Ashif/src/components/About.jsx

@@ -17,12 +17,6 @@ export default function ContactForm() {
     setForm({ ...form, [e.target.name]: e.target.value });
   };
 
-  const handleSubmit = (e) => {
-    e.preventDefault();
-    alert('Message sent!');
-    setForm({ name: '', email: '', message: '' });
-  };
-
   return (
     <div id="contact" className="relative flex w-full items-center justify-center overflow-hidden bg-background pt-16 pb-32 md:pt-24 md:pb-48">
       <GridPattern
@@ -38,7 +32,10 @@ export default function ContactForm() {
         {/* Centered Form */}
         <div className="max-w-md mx-auto px-8 py-6 bg-gray-50 rounded-lg shadow-lg">
           <h2 className="text-2xl font-semibold text-gray-800 mb-4 text-center">Contact Me</h2>
-          <form onSubmit={handleSubmit}>
+          <form 
+            action="https://formspree.io/f/xrbwdkqb" 
+            method="POST"
+          >
             <div className="mb-4">
               <label className="block text-gray-800 mb-1" htmlFor="name">Your Name</label>
               <input

Ashif/src/components/ContactForm.jsx

@@ -25,15 +25,17 @@ const projectData = [
     {
         title: 'Sahityaa Sangamm',
         description: 'A modern e-commerce platform built with Blade and Laravel.',
-        // --- 2. Use the imported variable here ---
-        imageUrl: project1Img,
+        // Use your Cloudinary video URL here:
+        videoUrl: 'https://res.cloudinary.com/dktapziq9/video/upload/v1764394626/1764393871242766_dqfnqn.mp4',
+        imageUrl: project1Img, // optional fallback
         liveUrl: 'https://sahityaasangamm.in',
         repoUrl: '#',
         tags: ['Blade', 'Laravel', 'MySQL'],
     },
     {
         title: 'Portfolio Website',
         description: 'My personal portfolio website built with React and Tailwind CSS.',
+        videoUrl: 'https://res.cloudinary.com/dktapziq9/video/upload/v1764395075/1764395026924189_ij9257.mov',
         imageUrl: project7Img,
         liveUrl: 'https://ashifelahi.netlify.app',
         repoUrl: 'https://github.com/Deadcoder001/React-Personal-Portfolio.git',
@@ -42,6 +44,7 @@ const projectData = [
     {
         title: 'ONS Trading Application',
         description: 'A real-time trading application using Django and Bootstrap 5.',
+        videoUrl: 'https://res.cloudinary.com/dktapziq9/video/upload/v1764395357/1764395325884939_lrg7f4.mp4',
         imageUrl: project5Img,
         liveUrl: 'https://ons-trading.onrender.com',
         repoUrl: 'https://github.com/Deadcoder001/ons_trading.git',
@@ -61,7 +64,7 @@ const projectData = [
         description: 'A modern e-commerce platform using React (Its Frontend Only For Now).',
         // --- 2. Use the imported variable here ---
         imageUrl: project3Img,
-        liveUrl: '#',
+        liveUrl: 'https://meghariseproducts.com',
         repoUrl: '#',
         tags: ['React', 'Vue', 'Tailwind CSS'],
     },
@@ -117,11 +120,22 @@ const ProjectCard = ({ project }) => (
         style={{ border: '1px solid #e5e7eb' }}
     >
         <div className="flex flex-col h-full bg-white rounded-[16px] overflow-hidden">
-            <img
-                src={project.imageUrl}
-                alt={project.title}
-                className="w-full h-1/2 object-cover"
-            />
+            {project.videoUrl ? (
+                <video
+                    src={project.videoUrl}
+                    autoPlay
+                    loop
+                    muted
+                    className="w-full h-1/2 object-cover"
+                    poster={project.imageUrl}
+                />
+            ) : (
+                <img
+                    src={project.imageUrl}
+                    alt={project.title}
+                    className="w-full h-1/2 object-cover"
+                />
+            )}
             <div className="p-4 flex-grow flex flex-col">
                 <h3 className="text-lg font-bold text-gray-900 mb-1">
                     {project.title}

Ashif/src/components/Projects.jsx

@@ -15,7 +15,6 @@ const skillsRow1 = [
 ];
 
 const skillsRow2 = [
-
   <Html key="html" />,
   <MongoDB key="mongodb" />,
   <PostgreSQL key="postgresql" />,
@@ -38,7 +37,21 @@ export default function Skills() {
           </h2>
         </div>
       </div>
-      <div className="flex flex-col gap-4">
+      <div className="relative max-w-screen-lg mx-auto flex flex-col gap-4">
+        {/* Left Blur */}
+        <div className="pointer-events-none absolute left-0 top-0 h-full w-16 z-10"
+             style={{
+               background: 'linear-gradient(to right, rgba(255,255,255,0.9) 60%, rgba(255,255,255,0))',
+               filter: 'blur(6px)'
+             }}
+        />
+        {/* Right Blur */}
+        <div className="pointer-events-none absolute right-0 top-0 h-full w-16 z-10"
+             style={{
+               background: 'linear-gradient(to left, rgba(255,255,255,0.9) 60%, rgba(255,255,255,0))',
+               filter: 'blur(6px)'
+             }}
+        />
         <VelocityText baseVelocity={-5} numCopies={4}>
           {skillsRow1.map((logo, index) => (
             <div key={index} className="w-20 h-20 text-gray-600 mx-4">