Frontend: Update ChiSiamo and Proprietari pages with new layout and images for improved visual appeal
This commit is contained in:
parent
e544b25795
commit
0ea14d0650
5 changed files with 83 additions and 17 deletions
Binary file not shown.
|
Before Width: | Height: | Size: 133 KiB After Width: | Height: | Size: 74 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 96 KiB After Width: | Height: | Size: 61 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 63 KiB After Width: | Height: | Size: 43 KiB |
|
|
@ -1,5 +1,8 @@
|
|||
import { ArrowRight } from "lucide-react";
|
||||
import type { NextPage } from "next";
|
||||
import Head from "next/head";
|
||||
import Image from "next/image";
|
||||
import Link from "next/link";
|
||||
import { useTranslation } from "~/providers/I18nProvider";
|
||||
const ChiSiamo: NextPage = () => {
|
||||
const { t } = useTranslation();
|
||||
|
|
@ -10,25 +13,88 @@ const ChiSiamo: NextPage = () => {
|
|||
<title>{t.heads.chi_siamo_titolo}</title>
|
||||
<meta name="description" content={t.heads.main_description} />
|
||||
</Head>
|
||||
<main className="mx-auto w-full max-w-6xl space-y-8 px-2 py-5 sm:space-y-20 sm:px-8">
|
||||
<main className="mx-auto w-full max-w-6xl space-y-5 px-2 py-5 md:px-8">
|
||||
<div className="bg-primary/10 text-primary inline-block rounded-lg px-3 py-1 text-sm">
|
||||
{t.chi_siamo.title}
|
||||
</div>
|
||||
<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="border-border w-full basis-1/2 space-y-2 rounded-lg border p-4 hover:bg-neutral-100">
|
||||
<h3 className="text-xl font-bold">{t.chi_siamo.mission}</h3>
|
||||
<p>{t.chi_siamo.mission_desc}</p>
|
||||
<div className="mx-auto w-full 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
|
||||
src="/rent_2.webp"
|
||||
alt=""
|
||||
className="w-full rounded-md object-cover"
|
||||
width={1400}
|
||||
height={1050}
|
||||
/>
|
||||
</div>
|
||||
<div className="border-border w-full basis-1/2 space-y-2 rounded-lg border p-4 hover:bg-neutral-100">
|
||||
<h3 className="text-xl font-bold">{t.chi_siamo.vision}</h3>
|
||||
<p>{t.chi_siamo.vision_desc}</p>
|
||||
<div className="max-w-lg flex-1 py-5 sm:mx-auto sm:text-center md:max-w-max md:text-left">
|
||||
<h3 className="text-3xl font-semibold text-gray-800 md:text-4xl">
|
||||
{t.proprietari.cta2.title1}{" "}
|
||||
<span className="text-indigo-600">
|
||||
{t.proprietari.cta2.title2}
|
||||
</span>
|
||||
{t.proprietari.cta2.title3}
|
||||
</h3>
|
||||
<p className="mt-3 leading-relaxed text-gray-500">
|
||||
{t.proprietari.cta2.desc}
|
||||
</p>
|
||||
<Link
|
||||
className="mt-5 inline-flex items-center rounded-full bg-indigo-50 px-4 py-2 font-medium text-indigo-600"
|
||||
href="/contatti"
|
||||
>
|
||||
{t.proprietari.contattaci}
|
||||
<ArrowRight className="ml-1 h-5 w-5 duration-150" />
|
||||
</Link>
|
||||
</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="border-border w-full basis-1/2 space-y-2 rounded-lg border p-4 hover:bg-neutral-100">
|
||||
<h3 className="text-xl font-bold">{t.chi_siamo.mission}</h3>
|
||||
<p>{t.chi_siamo.mission_desc}</p>
|
||||
</div>
|
||||
<div className="border-border w-full basis-1/2 space-y-2 rounded-lg border p-4 hover:bg-neutral-100">
|
||||
<h3 className="text-xl font-bold">{t.chi_siamo.vision}</h3>
|
||||
<p>{t.chi_siamo.vision_desc}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="border-border w-full space-y-2 rounded-lg border p-4 hover:bg-neutral-100">
|
||||
<h3 className="text-xl font-bold">{t.chi_siamo.progetto}</h3>
|
||||
<p>{t.chi_siamo.progetto_desc}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="border-border w-full space-y-2 rounded-lg border p-4 hover:bg-neutral-100">
|
||||
<h3 className="text-xl font-bold">{t.chi_siamo.progetto}</h3>
|
||||
<p>{t.chi_siamo.progetto_desc}</p>
|
||||
</div>
|
||||
|
||||
<section className="relative mx-auto flex max-w-6xl flex-col-reverse items-center justify-between gap-8 px-4 py-4 sm:flex-row sm:gap-20 md:px-8">
|
||||
<div className="max-w-lg flex-1 py-5 sm:mx-auto sm:text-center md:max-w-max md:text-left">
|
||||
<h3 className="text-3xl font-semibold text-gray-800 md:text-4xl">
|
||||
{t.proprietari.cta1.title1}{" "}
|
||||
<span className="text-indigo-600">
|
||||
{t.proprietari.cta1.title2}
|
||||
</span>
|
||||
</h3>
|
||||
<p className="mt-3 leading-relaxed text-gray-500">
|
||||
{t.proprietari.cta1.desc}
|
||||
</p>
|
||||
<Link
|
||||
className="mt-5 inline-flex items-center rounded-full bg-indigo-50 px-4 py-2 font-medium text-indigo-600"
|
||||
href="/contatti"
|
||||
>
|
||||
{t.proprietari.contattaci}
|
||||
<ArrowRight className="ml-1 h-5 w-5 duration-150" />
|
||||
</Link>
|
||||
</div>
|
||||
<div className="mx-auto mt-5 flex-1 sm:w-9/12 md:mt-0 md:w-auto">
|
||||
<Image
|
||||
src="/rent_0.webp"
|
||||
alt=""
|
||||
className="w-full rounded-md object-cover"
|
||||
width={1400}
|
||||
height={1050}
|
||||
/>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
</main>
|
||||
</>
|
||||
|
|
|
|||
|
|
@ -45,8 +45,8 @@ const Proprietari: NextPage = () => {
|
|||
src="/rent_0.webp"
|
||||
alt=""
|
||||
className="w-full rounded-md object-cover"
|
||||
width={800}
|
||||
height={300}
|
||||
width={1400}
|
||||
height={1050}
|
||||
/>
|
||||
</div>
|
||||
</section>
|
||||
|
|
@ -66,8 +66,8 @@ const Proprietari: NextPage = () => {
|
|||
src="/rent_2.webp"
|
||||
alt=""
|
||||
className="w-full rounded-md object-cover"
|
||||
width={800}
|
||||
height={300}
|
||||
width={1400}
|
||||
height={1050}
|
||||
/>
|
||||
</div>
|
||||
<div className="max-w-lg flex-1 py-5 sm:mx-auto sm:text-center md:max-w-max md:text-left">
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue