first commit

2025-02-12 23:25:43 -05:00
commit d8c7ec4866
1400 changed files with 90826 additions and 0 deletions
@@ -0,0 +1,107 @@
+'use client'
+
+
+import React, { useState } from "react";
+import ModalVideo from "react-modal-video";
+import Image from "next/image";
+const VideoGalleryContent = [
+  {
+    img: "img_84",
+    text1: "Promoty",
+    text2: "your Event",
+    animationDelay: "",
+    videoId:'qnwTVQlxs4g'
+  },
+  {
+    img: "img_85",
+    text1: "Social Media",
+    text2: "Promotion",
+    animationDelay: "50",
+    videoId:'qnwTVQlxs4g'
+  },
+  {
+    img: "img_86",
+    text1: "Youtube Creator",
+    text2: "Intro",
+    animationDelay: "100",
+    videoId:'qnwTVQlxs4g'
+  },
+  {
+    img: "img_87",
+    text1: "Dancing",
+    text2: "eople adv",
+    animationDelay: "150",
+    videoId:'qnwTVQlxs4g'
+  },
+  {
+    img: "img_88",
+    text1: "Cartoon for",
+    text2: "children",
+    animationDelay: "50",
+    videoId:'qnwTVQlxs4g'
+  },
+  {
+    img: "img_89",
+    text1: "Music",
+    text2: "Learning",
+    animationDelay: "100",
+    videoId:'qnwTVQlxs4g'
+  },
+  {
+    img: "img_90",
+    text1: "Greeting",
+    text2: "intro",
+    animationDelay: "150",
+    videoId:'qnwTVQlxs4g'
+  },
+  {
+    img: "img_91",
+    text1: "Work",
+    text2: "From Home",
+    animationDelay: "200",
+    videoId:'qnwTVQlxs4g'
+  },
+];
+
+const VideoGallery = () => {
+  const [isOpen, setOpen] = useState(false);
+  const [videoId, setVideoId] = useState('qnwTVQlxs4g')
+  return (
+    <div className="row justify-content-center">
+      <ModalVideo
+        channel="youtube"
+        autoplay
+        isOpen={isOpen}
+        videoId={videoId}
+        onClose={() => setOpen(false)}
+      />
+      {VideoGalleryContent.map((val, i) => (
+        <div
+          className="col-xl-3 col-lg-4 col-sm-6"
+          data-aos="fade-up"
+          data-aos-duration="1200"
+          data-aos-delay={val.animationDelay}
+          key={i}
+        >
+          <div className="block-style-twentyOne" onClick={()=>setVideoId(val.videoId)}  >
+            <Image width={330} height={230} style={{width:'100%',height:'fit-content'}}     src={`/images/media/${val.img}.png`} alt="image" className="w-100" />
+            <div className="d-flex align-items-center justify-content-center flex-column video-button">
+              <span>
+                {val.text1} <br /> {val.text2}
+              </span>
+              <span
+                className="icon d-flex align-items-center justify-content-center"
+                onClick={() => setOpen(true)}
+              >
+                <Image  width="13" height="17" src="/images/icon/118.svg" alt="image" />
+              </span>
+            </div>
+          </div>
+          {/* /.block-style-twentyOne */}
+        </div>
+      ))}
+    </div>
+  );
+};
+
+export default VideoGallery;