feat: Adjust HeroSection layout and category placeholder text, and update TestimonialsSection background color and add a divider.

This commit is contained in:
pradeepkumar
2026-03-08 00:17:21 +05:30
parent 0782da8abd
commit 65f85d0027
2 changed files with 11 additions and 6 deletions

View File

@@ -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

View File

@@ -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) => (