feat: Adjust HeroSection layout and category placeholder text, and update TestimonialsSection background color and add a divider.
This commit is contained in:
@@ -98,7 +98,7 @@ export function HeroSection({ content }: { content?: HeroContent }) {
|
|||||||
};
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<section className="relative min-h-[480px] overflow-hidden">
|
<section className="relative min-h-[540px] overflow-hidden">
|
||||||
{/* Background Image */}
|
{/* Background Image */}
|
||||||
<div className="absolute inset-0">
|
<div className="absolute inset-0">
|
||||||
<Image
|
<Image
|
||||||
@@ -110,9 +110,9 @@ export function HeroSection({ content }: { content?: HeroContent }) {
|
|||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="relative max-w-6xl mx-auto px-4 sm:px-6 lg:px-8 pt-16 pb-8 min-h-[480px] flex flex-col">
|
<div className="relative max-w-6xl mx-auto px-4 sm:px-6 lg:px-8 pt-28 pb-10 min-h-[540px] flex flex-col">
|
||||||
{/* Headline */}
|
{/* Headline */}
|
||||||
<div className="text-center mb-5">
|
<div className="text-center mb-8">
|
||||||
<h1 className="font-fractul font-bold text-[24px] md:text-[28px] lg:text-[30px] leading-[50px] text-[#00293d] max-w-4xl mx-auto">
|
<h1 className="font-fractul font-bold text-[24px] md:text-[28px] lg:text-[30px] leading-[50px] text-[#00293d] max-w-4xl mx-auto">
|
||||||
{data.headline}
|
{data.headline}
|
||||||
</h1>
|
</h1>
|
||||||
@@ -186,7 +186,7 @@ export function HeroSection({ content }: { content?: HeroContent }) {
|
|||||||
className="w-full h-[42px] px-4 rounded-[7px] border border-[#00293d]/10 bg-white text-left flex items-center justify-between focus:outline-none"
|
className="w-full h-[42px] px-4 rounded-[7px] border border-[#00293d]/10 bg-white text-left flex items-center justify-between focus:outline-none"
|
||||||
>
|
>
|
||||||
<span className="font-serif text-sm text-[#00293d]">
|
<span className="font-serif text-sm text-[#00293d]">
|
||||||
{searchParams.category ? categoryOptions.find(c => c.id === searchParams.category)?.name : 'Category'}
|
{searchParams.category ? categoryOptions.find(c => c.id === searchParams.category)?.name : 'Categories'}
|
||||||
</span>
|
</span>
|
||||||
<Image
|
<Image
|
||||||
src="/assets/icons/chevron-down-icon.svg"
|
src="/assets/icons/chevron-down-icon.svg"
|
||||||
@@ -246,7 +246,7 @@ export function HeroSection({ content }: { content?: HeroContent }) {
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* Bottom Section */}
|
{/* Bottom Section */}
|
||||||
<div className="mt-8">
|
<div className="mt-auto pt-6">
|
||||||
{/* See All Agents Button */}
|
{/* See All Agents Button */}
|
||||||
<div className="flex justify-center">
|
<div className="flex justify-center">
|
||||||
<button
|
<button
|
||||||
|
|||||||
@@ -110,7 +110,7 @@ export function TestimonialsSection({ content }: { content?: TestimonialsContent
|
|||||||
const data = content ?? defaultContent;
|
const data = content ?? defaultContent;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<section className="py-12 md:py-16 bg-white">
|
<section className="py-12 md:py-16 bg-[#c5d6d6]">
|
||||||
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||||
{/* Section Header */}
|
{/* Section Header */}
|
||||||
<div className="text-center mb-6">
|
<div className="text-center mb-6">
|
||||||
@@ -148,6 +148,11 @@ export function TestimonialsSection({ content }: { content?: TestimonialsContent
|
|||||||
))}
|
))}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
{/* Divider Line */}
|
||||||
|
<div className="w-full max-w-5xl mx-auto mb-10">
|
||||||
|
<div className="h-px bg-[#00293d]/20"></div>
|
||||||
|
</div>
|
||||||
|
|
||||||
{/* Testimonials Grid */}
|
{/* Testimonials Grid */}
|
||||||
<div className="grid grid-cols-1 md:grid-cols-3 gap-6">
|
<div className="grid grid-cols-1 md:grid-cols-3 gap-6">
|
||||||
{data.testimonials.map((testimonial, index) => (
|
{data.testimonials.map((testimonial, index) => (
|
||||||
|
|||||||
Reference in New Issue
Block a user