style: improve TestimonialCard layout consistency and remove redundant availability labels from dashboard and profile pages

This commit is contained in:
pradeepkumar
2026-04-15 16:57:53 +05:30
parent 99a594ed16
commit b9e52b0485
4 changed files with 4 additions and 10 deletions

View File

@@ -481,9 +481,6 @@ export default function AgentDashboard() {
} }
content={ content={
<div> <div>
{availabilityData.type && (
<p className="font-semibold font-serif text-[14px] leading-[19px] text-[#00293D] mb-2">{availabilityData.type}</p>
)}
<div className="space-y-1"> <div className="space-y-1">
{availabilityData.schedule.length > 0 ? ( {availabilityData.schedule.length > 0 ? (
availabilityData.schedule.map((item, index) => ( availabilityData.schedule.map((item, index) => (

View File

@@ -409,9 +409,6 @@ export default function AgentProfileView() {
} }
content={ content={
<div> <div>
{availabilityData.type && (
<p className="font-semibold font-serif text-[14px] leading-[19px] text-[#00293D] mb-2">{availabilityData.type}</p>
)}
<div className="space-y-1"> <div className="space-y-1">
{availabilityData.schedule.length > 0 ? ( {availabilityData.schedule.length > 0 ? (
availabilityData.schedule.map((item, index) => ( availabilityData.schedule.map((item, index) => (

View File

@@ -12,7 +12,7 @@ interface TestimonialCardProps {
export function TestimonialCard({ text, author, role, rating }: TestimonialCardProps) { export function TestimonialCard({ text, author, role, rating }: TestimonialCardProps) {
return ( return (
<div className="p-4 border border-[#00293D]/10 rounded-[15px]"> <div className="p-4 border border-[#00293D]/10 rounded-[15px] h-full flex flex-col">
<div className="mb-4"> <div className="mb-4">
<Image <Image
src="/assets/icons/quote-icon.svg" src="/assets/icons/quote-icon.svg"
@@ -23,8 +23,8 @@ export function TestimonialCard({ text, author, role, rating }: TestimonialCardP
/> />
<p className="font-medium text-[#00293D] text-[14px] leading-[17px] font-fractul">I have been working with Lorem .</p> <p className="font-medium text-[#00293D] text-[14px] leading-[17px] font-fractul">I have been working with Lorem .</p>
</div> </div>
<p className="text-[#00293D] text-[14px] leading-[19px] font-normal font-serif mb-4">{text}</p> <p className="text-[#00293D] text-[14px] leading-[19px] font-normal font-serif mb-4 flex-1">{text}</p>
<div className="pt-4 border-t border-gray-100 space-y-2"> <div className="pt-4 border-t border-[#00293D]/20 space-y-2">
<StarRating rating={rating} /> <StarRating rating={rating} />
<p className="font-normal text-[#00293D] text-[14px] leading-[17px] font-fractul">{author}</p> <p className="font-normal text-[#00293D] text-[14px] leading-[17px] font-fractul">{author}</p>
<p className="font-fractul font-medium text-[14px] leading-[17px] text-[#00293D]">{role}</p> <p className="font-fractul font-medium text-[14px] leading-[17px] text-[#00293D]">{role}</p>

View File

@@ -30,7 +30,7 @@ export function TestimonialsSection({ testimonials }: TestimonialsSectionProps)
<p className="font-serif font-normal text-[14px] leading-[19px] text-[#00293D] text-center mb-8"> <p className="font-serif font-normal text-[14px] leading-[19px] text-[#00293D] text-center mb-8">
Clients rate our real estate services {averageRating} out of 5 on average, based on {testimonials.length} recent client review{testimonials.length !== 1 ? 's' : ''}. Clients rate our real estate services {averageRating} out of 5 on average, based on {testimonials.length} recent client review{testimonials.length !== 1 ? 's' : ''}.
</p> </p>
<div className="flex flex-col lg:grid lg:grid-cols-3 gap-6"> <div className="flex flex-col lg:grid lg:grid-cols-3 gap-6 lg:items-stretch">
{testimonials.map((testimonial) => ( {testimonials.map((testimonial) => (
<TestimonialCard <TestimonialCard
key={testimonial.id} key={testimonial.id}