infoalloggi-monorepo/apps/infoalloggi/src/pages/chi-siamo.tsx
Marco Pedone 1fc855393f Refactor Annuncio Card Component and Remove Legacy Code
- Updated `CardAnnuncio` component to enhance functionality and styling.
- Removed `CardAnnuncio2` component as it was redundant.
- Added new icons and badges for better visual representation of availability and status.
- Improved layout and responsiveness of the card.
- Updated translations in English and Italian for consistency.
- Enhanced pagination controls in the `Annunci` page with new button styles.
- Adjusted footer components to accept additional class names for customization.
- Cleaned up unused CSS animations and styles in `globals.css`.
- Modified server-side controller to include homepage field in the Annuncio data structure.
2025-11-03 18:49:27 +01:00

67 lines
2.5 KiB
TypeScript

import type { NextPage } from "next";
import Head from "next/head";
import Image from "next/image";
import { useTranslation } from "~/providers/I18nProvider";
const ChiSiamo: NextPage = () => {
const { t } = useTranslation();
return (
<>
<Head>
<title>{t.heads.chi_siamo_titolo}</title>
<meta content={t.heads.main_description} name="description" />
</Head>
<main className="mx-auto w-full max-w-7xl space-y-5 px-2 py-5 md:px-8">
<div className="inline-block rounded-md bg-accent px-3 py-1 text-primary text-sm outline outline-neutral-500">
{t.chi_siamo.title}
</div>
<div className="mx-auto w-full max-w-6xl space-y-5 sm:space-y-14">
<section className="relative mx-auto flex max-w-6xl flex-col items-center justify-between gap-8 px-4 py-4 sm:flex-row sm:gap-20 md:px-8">
<div className="mx-auto mt-5 flex-1 sm:w-9/12 md:mt-0 md:w-auto">
<Image
alt=""
className="w-full rounded-md object-cover"
height={1050}
src="/ufficio.webp"
width={1400}
/>
</div>
<div className="max-w-lg flex-1 py-5 sm:mx-auto sm:text-center md:max-w-max md:text-left">
<h3 className="font-semibold text-3xl text-gray-800 md:text-4xl">
{t.chi_siamo.cta.title1}
<span className="text-indigo-600">
{t.chi_siamo.cta.title2}
</span>
</h3>
<p className="mt-3 text-gray-500 leading-relaxed">
{t.chi_siamo.cta.desc}
</p>
</div>
</section>
<div className="flex w-full flex-col gap-8">
<div className="flex flex-col gap-8 sm:flex-row sm:items-stretch sm:justify-between">
<div className="w-full basis-1/2 space-y-2 rounded-lg border border-border p-4 hover:bg-neutral-100">
<h3 className="font-bold text-xl">{t.chi_siamo.mission}</h3>
<p>{t.chi_siamo.mission_desc}</p>
</div>
<div className="w-full basis-1/2 space-y-2 rounded-lg border border-border p-4 hover:bg-neutral-100">
<h3 className="font-bold text-xl">{t.chi_siamo.vision}</h3>
<p>{t.chi_siamo.vision_desc}</p>
</div>
</div>
<div className="w-full space-y-2 rounded-lg border border-border p-4 hover:bg-neutral-100">
<h3 className="font-bold text-xl">{t.chi_siamo.progetto}</h3>
<p>{t.chi_siamo.progetto_desc}</p>
</div>
</div>
<section className="text-center">
<p className="text-lg">{t.chi_siamo.indirizzo}</p>
</section>
</div>
</main>
</>
);
};
export default ChiSiamo;