build ui header, footer, home page, about page

app/components/home/VideoGallery.tsx

@@ -0,0 +1,35 @@
+interface VideoGalleryProps {
+    data: {
+        heading: string;
+        videoUrl: string;
+        thumbnail: string;
+    };
+}
+
+const VideoGallery = ({ data }: VideoGalleryProps) => {
+    return (
+        <section className="video-section bg-cover">
+            <video autoPlay loop muted playsInline className="video-bg">
+                <source src={data.videoUrl} type="video/mp4" />
+            </video>
+            <div className="text-image">
+                <img src="/assets/img/home-1/feature/text.png" alt="img" />
+            </div>
+            <div className="text-image-2">
+                <img src="/assets/img/home-1/feature/text-2.png" alt="img" />
+            </div>
+            <div className="container">
+                <div className="video-content">
+                    <div className="shape">
+                        <img src="/assets/img/home-1/feature/Vector.png" alt="img" />
+                    </div>
+                    <h2 className="split-text-right split-text-in-right">{data.heading.split(' ').map((word, index) => (
+                        <span key={index}>{word}{index === 0 ? <br /> : ' '}</span>
+                    ))}</h2>
+                </div>
+            </div>
+        </section>
+    );
+};
+
+export default VideoGallery;