Portfolio youtube links updated

This commit is contained in:
akash 2025-10-07 11:04:46 +05:30
parent 9830f8b001
commit fb0da8818a
2 changed files with 124 additions and 69 deletions

View File

@ -52,8 +52,8 @@ const CaseStudies = () => {
<Image <Image
src="/assets/images/about/3.webp" src="/assets/images/about/3.webp"
alt="shape2" alt="shape2"
width={100} width={133}
height={100} height={283}
priority priority
/> />
</div> </div>
@ -88,17 +88,45 @@ const CaseStudies = () => {
> >
<div className="case-study-single-box"> <div className="case-study-single-box">
<div className="case-study-thumb2"> <div className="case-study-thumb2">
{/* ✅ Video Handling Updated */}
{item.video ? ( {item.video ? (
<video // If YouTube link present → show embedded video
src={item.video} item.video.includes("youtube.com") || item.video.includes("youtu.be") ? (
controls <iframe
style={{ width="100%"
width: "100%", height="315"
height: "auto", src={
objectFit: "cover", item.video
borderRadius: "8px", .replace("watch?v=", "embed/")
}} .replace("youtu.be/", "youtube.com/embed/")
/> .replace("youtube.com/shorts/", "youtube.com/embed/")
}
title={item.title}
frameBorder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
allowFullScreen
style={{
width: "100%",
height: "auto",
aspectRatio: "16/9",
borderRadius: "8px",
objectFit: "cover",
}}
></iframe>
) : (
// Otherwise show normal local video
<video
src={item.video}
controls
style={{
width: "100%",
height: "auto",
objectFit: "cover",
borderRadius: "8px",
}}
/>
)
) : ( ) : (
<Image <Image
src={item.image} src={item.image}
@ -110,6 +138,7 @@ const CaseStudies = () => {
style={{ width: "100%", height: "auto", objectFit: "contain" }} style={{ width: "100%", height: "auto", objectFit: "contain" }}
/> />
)} )}
{/* Lightbox Icon */} {/* Lightbox Icon */}
{item.category !== "video" && item.imagePopup && ( {item.category !== "video" && item.imagePopup && (
<div className="single_portfolio_icon"> <div className="single_portfolio_icon">
@ -122,6 +151,7 @@ const CaseStudies = () => {
</a> </a>
</div> </div>
)} )}
{/* Title & Description */} {/* Title & Description */}
<div className="case-study-content"> <div className="case-study-content">
<div className={item.contentInnerClass || "case-study-content-inner"}> <div className={item.contentInnerClass || "case-study-content-inner"}>
@ -147,7 +177,7 @@ const CaseStudies = () => {
{/* Optional Video */} {/* Optional Video */}
{item.videoLink && !["meta", "graphic"].includes(item.category) && ( {item.videoLink && !["meta", "graphic"].includes(item.category) && (
<div className="video-icon style-two"> <div className="video-icon style-two">
<a className="video-vemo-icon" href={item.videoLink}> <a className="video-vemo-icon" href={item.videoLink} target="_blank">
<i className="fa fa-play" /> <i className="fa fa-play" />
</a> </a>
</div> </div>

View File

@ -814,35 +814,36 @@ export const PortfolioData = [
{ {
id: 45, id: 45,
category: "video", category: "video",
video: "/assets/video/logo Portfolio Presentation.mp4",
colClass: "col-lg-4 col-md-6", colClass: "col-lg-4 col-md-6",
alt: "metatronCube solutions", alt: "metatronCube solutions",
title: "Video Editing", title: "Video Editing",
name: "Logo Presentation", name: "Logo Presentation",
link: "#", link: "https://www.youtube.com/watch?v=KbI5qQDaYjI",
videoLink: "/assets/video/logo Portfolio Presentation.mp4", video: "https://www.youtube.com/watch?v=KbI5qQDaYjI",
}, videoLink: "https://www.youtube.com/watch?v=KbI5qQDaYjI",
}
,
{ {
id: 46, id: 46,
category: "video", category: "video",
video: "/assets/video/Main Scene.mp4", video: "https://www.youtube.com/watch?v=ckvV7Mgcq_Q",
colClass: "col-lg-4 col-md-6", colClass: "col-lg-4 col-md-6",
alt: "metatronCube solutions", alt: "metatronCube solutions",
title: "Video Editing", title: "Video Editing",
name: "MetatronCube Solutions", name: "MetatronCube Solutions",
link: "#", link: "https://www.youtube.com/watch?v=ckvV7Mgcq_Q",
videoLink: "/assets/video/Main Scene.mp4", videoLink: "https://www.youtube.com/watch?v=ckvV7Mgcq_Q",
}, },
{ {
id: 47, id: 47,
category: "video", category: "video",
video: "/assets/video/metatroncube.mp4", video: "https://www.youtube.com/watch?v=4WhJFTbaCko",
colClass: "col-lg-4 col-md-6", colClass: "col-lg-4 col-md-6",
alt: "Dine360", alt: "Dine360",
title: "Video Editing", title: "Video Editing",
name: "Dine360", name: "Dine360",
link: "#", link: "https://www.youtube.com/watch?v=4WhJFTbaCko",
videoLink: "/assets/video/metatroncube.mp4", videoLink: "https://www.youtube.com/watch?v=4WhJFTbaCko",
}, },
{ {
id: 48, id: 48,
@ -869,46 +870,101 @@ export const PortfolioData = [
{ {
id: 50, id: 50,
category: "video", category: "video",
video: "/assets/video/5.mp4", video: "https://www.youtube.com/watch?v=69dcbrCQRt4",
colClass: "col-lg-4 col-md-6", colClass: "col-lg-4 col-md-6",
alt: "metatronCube solutions", alt: "metatronCube solutions",
title: "Video Editing", title: "Video Editing",
name: "Behind The Scenes", name: "Behind The Scenes",
link: "#", link: "https://www.youtube.com/watch?v=69dcbrCQRt4",
videoLink: "/assets/video/5.mp4", videoLink: "https://www.youtube.com/watch?v=69dcbrCQRt4",
}, },
{ {
id: 51, id: 51,
category: "video", category: "video",
video: "/assets/video/metatron canada video 2.mp4", video: "https://www.youtube.com/shorts/PqK6UwPaU2I",
colClass: "col-lg-4 col-md-6", colClass: "col-lg-4 col-md-6",
alt: "metatronCube solutions", alt: "metatronCube solutions",
title: "Video Editing", title: "Video Editing",
name: "MetatronCube Solutions", name: "MetatronCube Solutions",
link: "#", link: "https://www.youtube.com/shorts/PqK6UwPaU2I",
videoLink: "/assets/video/metatron canada video 2.mp4", videoLink: "https://www.youtube.com/shorts/PqK6UwPaU2I",
}, },
{ {
id: 52, id: 52,
category: "video", category: "video",
video: "/assets/video/metatron video one.mp4", video: "https://www.youtube.com/shorts/Jdq3rIbdMM0",
colClass: "col-lg-4 col-md-6", colClass: "col-lg-4 col-md-6",
alt: "metatronCube solutions", alt: "metatronCube solutions",
title: "Video Editing", title: "Video Editing",
name: "MetatronCube Solutions", name: "MetatronCube Solutions",
link: "#", link: "https://www.youtube.com/shorts/Jdq3rIbdMM0",
videoLink: "/assets/video/metatron video one.mp4", videoLink: "https://www.youtube.com/shorts/Jdq3rIbdMM0",
}, },
{ {
id: 53, id: 53,
category: "video", category: "video",
video: "/assets/video/clothing reel.mp4", video: "https://www.youtube.com/shorts/YgCb5BIm93w",
colClass: "col-lg-4 col-md-6", colClass: "col-lg-4 col-md-6",
alt: "clothing", alt: "clothing",
title: "Video Editing", title: "Video Editing",
name: "Falcon Fashions", name: "Falcon Fashions",
link: "#", link: "https://www.youtube.com/shorts/YgCb5BIm93w",
videoLink: "/assets/video/clothing reel.mp4", videoLink: "https://www.youtube.com/shorts/YgCb5BIm93w",
},
{
id: 60,
category: "video",
video: "https://www.youtube.com/shorts/Wd89RALJjJw",
colClass: "col-lg-4 col-md-6",
alt: "clothing",
title: "Video Editing",
name: "Chennora",
link: "https://www.youtube.com/shorts/Wd89RALJjJw",
videoLink: "https://www.youtube.com/shorts/Wd89RALJjJw",
},
{
id: 61,
category: "video",
video: "https://www.youtube.com/shorts/QUm9hHtF6z4",
colClass: "col-lg-4 col-md-6",
alt: "MetatronCube Solutions",
title: "Video Editing",
name: "MetatronCube Software Solutions",
link: "https://www.youtube.com/shorts/QUm9hHtF6z4",
videoLink: "https://www.youtube.com/shorts/QUm9hHtF6z4",
},
{
id: 70,
category: "video",
video: "https://www.youtube.com/watch?v=Rzm5ZWueMwY&feature=youtu.be",
colClass: "col-lg-4 col-md-6",
alt: "Shiva Shakthi Restaurant",
title: "Video Editing",
name: "Shiva Shakthi Restaurant",
link: "https://www.youtube.com/watch?v=Rzm5ZWueMwY&feature=youtu.be",
videoLink: "https://www.youtube.com/watch?v=Rzm5ZWueMwY&feature=youtu.be",
},
{
id: 71,
category: "video",
video: "https://www.youtube.com/watch?v=_gYcJ_sMAQg",
colClass: "col-lg-4 col-md-6",
alt: "Race Werks",
title: "Video Editing",
name: "Race Werks",
link: "https://www.youtube.com/watch?v=_gYcJ_sMAQg",
videoLink: "https://www.youtube.com/watch?v=_gYcJ_sMAQg",
},
{
id: 65,
category: "video",
video: "https://www.youtube.com/shorts/rksfIUjSe-Y",
colClass: "col-lg-4 col-md-6",
alt: "MetatronCube Software Solutions",
title: "Video Editing",
name: "MetatronCube Software Solutions",
link: "https://www.youtube.com/shorts/rksfIUjSe-Y",
videoLink: "https://www.youtube.com/shorts/rksfIUjSe-Y",
}, },
{ {
id: 54, id: 54,
@ -976,28 +1032,7 @@ export const PortfolioData = [
link: "#", link: "#",
videoLink: "/assets/video/4.mp4", videoLink: "/assets/video/4.mp4",
}, },
{
id: 60,
category: "video",
video: "/assets/video/6.mp4",
colClass: "col-lg-4 col-md-6",
alt: "clothing",
title: "Video Editing",
name: "Chennora",
link: "#",
videoLink: "/assets/video/6.mp4",
},
{
id: 61,
category: "video",
video: "/assets/video/7.mp4",
colClass: "col-lg-4 col-md-6",
alt: "MetatronCube Solutions",
title: "Video Editing",
name: "MetatronCube Software Solutions",
link: "#",
videoLink: "/assets/video/7.mp4",
},
{ {
id: 62, id: 62,
category: "video", category: "video",
@ -1031,17 +1066,7 @@ export const PortfolioData = [
link: "#", link: "#",
videoLink: "/assets/video/12.mp4", videoLink: "/assets/video/12.mp4",
}, },
{
id: 65,
category: "video",
video: "/assets/video/13.mp4",
colClass: "col-lg-4 col-md-6",
alt: "MetatronCube Software Solutions",
title: "Video Editing",
name: "MetatronCube Software Solutions",
link: "#",
videoLink: "/assets/video/13.mp4",
},
{ {
id: 66, id: 66,
category: "video", category: "video",