diff --git a/public/assets/icons/cities-icon.svg b/public/assets/icons/cities-icon.svg new file mode 100644 index 0000000..b3d7be3 --- /dev/null +++ b/public/assets/icons/cities-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/public/assets/icons/properties-icon.svg b/public/assets/icons/properties-icon.svg new file mode 100644 index 0000000..2df8ac9 --- /dev/null +++ b/public/assets/icons/properties-icon.svg @@ -0,0 +1,7 @@ + + + + + + + diff --git a/public/assets/icons/quote-marks.svg b/public/assets/icons/quote-marks.svg new file mode 100644 index 0000000..6601d9f --- /dev/null +++ b/public/assets/icons/quote-marks.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/components/home/TestimonialsSection.tsx b/src/components/home/TestimonialsSection.tsx index 1803869..a44d2ec 100644 --- a/src/components/home/TestimonialsSection.tsx +++ b/src/components/home/TestimonialsSection.tsx @@ -1,102 +1,160 @@ 'use client'; +import Image from 'next/image'; + const testimonials = [ { id: '1', rating: 5, - title: 'I have been working with Lorem...', - content: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean in nulla lorem. Fusce dui diam, auctor nec ligula vel. Congue pharetra leo. Praesent scelerisque diam, sed lacinia mauris commodo in. Fusce dui diam, auctor nec.', - author: 'Caren Robert', + title: 'I have been working with Lorem ..', + content: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean commodo ligula eget dolor. Sed dignissim, nisl eget tincidunt vulputate, lacus justo bibendum ipsum, vitae tempus risus lorem at nunc. Integer sed arcu vitae risus feugiat vehicula. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.', + author: 'Conor Kenney', role: 'Chief Operations Officer', }, { id: '2', rating: 5, - title: 'I have been working with Lorem...', - content: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean in nulla lorem. Fusce dui diam, auctor nec ligula vel. Congue pharetra leo. Praesent scelerisque diam, sed lacinia mauris commodo in. Fusce dui diam, auctor nec.', - author: 'Caren Robert', + title: 'I have been working with Lorem ..', + content: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean commodo ligula eget dolor. Sed dignissim, nisl eget tincidunt vulputate, lacus justo bibendum ipsum, vitae tempus risus lorem at nunc. Integer sed arcu vitae risus feugiat vehicula. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.', + author: 'Conor Kenney', role: 'Chief Operations Officer', }, { id: '3', rating: 5, - title: 'I have been working with Lorem...', - content: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean in nulla lorem. Fusce dui diam, auctor nec ligula vel. Congue pharetra leo. Praesent scelerisque diam, sed lacinia mauris commodo in. Fusce dui diam, auctor nec.', - author: 'Caren Robert', + title: 'I have been working with Lorem ..', + content: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean commodo ligula eget dolor. Sed dignissim, nisl eget tincidunt vulputate, lacus justo bibendum ipsum, vitae tempus risus lorem at nunc. Integer sed arcu vitae risus feugiat vehicula. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.', + author: 'Conor Kenney', role: 'Chief Operations Officer', }, ]; -function StarRating({ rating }: { rating: number }) { +interface TestimonialCardProps { + title: string; + content: string; + author: string; + role: string; + rating: number; +} + +function TestimonialCard({ title, content, author, role, rating }: TestimonialCardProps) { return ( -
- {[...Array(5)].map((_, i) => ( - - - - ))} +
+ {/* Quote Icon */} +
+ Quote +
+ + {/* Title */} +

+ {title} +

+ + {/* Content */} +

+ {content} +

+ + {/* Star Rating */} +
+ {[...Array(rating)].map((_, i) => ( + Star + ))} +
+ + {/* Author Info */} +
+

+ {author} +

+

+ {role} +

+
); } export function TestimonialsSection() { return ( -
+
{/* Section Header */} -
-

+
+

Our Clients' Trust Is Our Foundation

-

+

We help buyers, sellers, and investors close successful real estate deals with confidence in every transaction.

-

- Clients rate our real estate services an average of 4.8 on average, based on recent client reviews. +

+ Clients rate our real estate services 4.9 out of 5 on average, based on recent client reviews.

- {/* Rating Summary */} -
-
- 4.8 / 5 Stars + {/* Stats Section */} +
+ {/* Cities Stat */} +
+ Cities +
+ + 25+ Cities & + +
+ + neighborhoods served + +
-
- 1,200+ Happy Clients + + {/* Properties Stat */} +
+ Properties +
+ + 1,000+ Properties + +
+ + bought and sold for our clients. + +
{/* Testimonials Grid */} -
+
{testimonials.map((testimonial) => ( -
- {/* Rating */} -
- -
- - {/* Title */} -

{testimonial.title}

- - {/* Content */} -

- {testimonial.content} -

- - {/* Author */} -
-

{testimonial.author}

-

{testimonial.role}

-
-
+ title={testimonial.title} + content={testimonial.content} + author={testimonial.author} + role={testimonial.role} + rating={testimonial.rating} + /> ))}