Files
demo-websites/lawfirm-demos/demo-1/components/LawyerProfile.tsx

54 lines
2.1 KiB
TypeScript

'use client';
export default function LawyerProfile({lawyer, reverse = false}: Readonly<{ lawyer: any; reverse?: boolean }>) {
return (
<section className={`flex flex-col md:flex-row ${reverse ? 'md:flex-row-reverse' : ''} gap-10 md:items-start`}>
{/* image */}
<div className="w-full md:w-1/3">
<img
src={lawyer.image}
alt={lawyer.name}
className="w-full h-auto rounded-xl shadow-sm object-cover"
/>
</div>
{/* content */}
<div className="w-full md:w-2/3 space-y-6 text-[17px] text-gray-800 leading-relaxed">
<div>
<h2 className="text-2xl font-bold text-red-700">{lawyer.name}</h2>
<p>{lawyer.short}</p>
</div>
{lawyer.biography && (
<div>
<h3 className="font-semibold mb-1">Zur Person</h3>
<p className="whitespace-pre-line">{lawyer.biography}</p>
</div>
)}
{lawyer.specialties?.length > 0 && (
<div>
<h3 className="font-semibold mb-1">Fachgebiete</h3>
<ul className="list-disc pl-5 space-y-1">
{lawyer.specialties.map((s: string, i: number) => (
<li key={i}>{s}</li>
))}
</ul>
</div>
)}
{lawyer.personal?.length > 0 && (
<div>
<h3 className="font-semibold mb-1">Ausbildung & Mitgliedschaften</h3>
<ul className="list-disc pl-5 space-y-1">
{lawyer.personal.map((p: string, i: number) => (
<li key={i}>{p}</li>
))}
</ul>
</div>
)}
</div>
</section>
);
}