update
This commit is contained in:
@@ -1,5 +1,5 @@
|
||||
"use client";
|
||||
import Image from "next/legacy/image";
|
||||
import Image from "next/image";
|
||||
import Link from "next/link";
|
||||
import { useCaseStudy } from "@/lib/hooks/useCaseStudy";
|
||||
import { getImageUrl } from "@/lib/imageUtils";
|
||||
@@ -17,44 +17,45 @@ const RelatedCase = ({ slug }: RelatedCaseProps) => {
|
||||
}
|
||||
|
||||
return (
|
||||
<section className="pt-120 pb-120 c-study fade-wrapper">
|
||||
<section className="related-case-studies luxury-related pt-120 pb-120">
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-12 col-lg-9">
|
||||
<h2 className="mt-8 title-anim fw-7 text-secondary mb-24">
|
||||
Similar Case Studies
|
||||
</h2>
|
||||
<div className="col-12">
|
||||
<div className="section-header">
|
||||
<h2 className="section-title">Related Case Studies</h2>
|
||||
<p className="section-subtitle">Explore similar projects and success stories</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="row vertical-column-gap-lg">
|
||||
{caseStudy.related_case_studies.slice(0, 2).map((relatedCase) => (
|
||||
<div key={relatedCase.id} className="col-12 col-lg-6">
|
||||
<div className="c-study-single fade-top">
|
||||
<div className="thumb mb-24">
|
||||
<Link href={`/case-study/${relatedCase.slug}`} className="w-100">
|
||||
<div className="parallax-image-wrap">
|
||||
<div className="parallax-image-inner">
|
||||
<Image
|
||||
src={relatedCase.thumbnail ? getImageUrl(relatedCase.thumbnail) : one}
|
||||
className="w-100 mh-300 parallax-image"
|
||||
alt={relatedCase.title}
|
||||
width={600}
|
||||
height={400}
|
||||
/>
|
||||
</div>
|
||||
{caseStudy.related_case_studies.slice(0, 3).map((relatedCase) => (
|
||||
<div key={relatedCase.id} className="col-12 col-md-6 col-lg-4">
|
||||
<div className="related-case-card">
|
||||
<Link href={`/case-study/${relatedCase.slug}`} className="case-link">
|
||||
<div className="case-image-wrapper">
|
||||
<Image
|
||||
src={relatedCase.thumbnail ? getImageUrl(relatedCase.thumbnail) : one}
|
||||
className="case-image"
|
||||
alt={relatedCase.title}
|
||||
width={400}
|
||||
height={300}
|
||||
/>
|
||||
<div className="image-overlay">
|
||||
<i className="fa-solid fa-arrow-right"></i>
|
||||
</div>
|
||||
</Link>
|
||||
</div>
|
||||
<div className="content">
|
||||
<Link href={`/case-study/${relatedCase.slug}`} className="mb-30 fw-6">
|
||||
{relatedCase.category_name || 'Case Study'}
|
||||
</Link>
|
||||
<h4 className="fw-6 mt-8 text-secondary">
|
||||
<Link href={`/case-study/${relatedCase.slug}`}>
|
||||
{relatedCase.title}
|
||||
</Link>
|
||||
</h4>
|
||||
</div>
|
||||
</div>
|
||||
<div className="case-content">
|
||||
{relatedCase.category_name && (
|
||||
<span className="case-category">
|
||||
{relatedCase.category_name}
|
||||
</span>
|
||||
)}
|
||||
<h3 className="case-title">{relatedCase.title}</h3>
|
||||
{relatedCase.excerpt && (
|
||||
<p className="case-excerpt">{relatedCase.excerpt}</p>
|
||||
)}
|
||||
</div>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
|
||||
Reference in New Issue
Block a user