fixed mobile view

This commit is contained in:
2026-04-09 17:17:34 +02:00
parent d3f9496c05
commit c7011c5574
10 changed files with 32 additions and 27 deletions
+10 -10
View File
@@ -10,7 +10,7 @@ export const metadata: Metadata = {
export default function Contatti() {
return (
<div className="pt-32 pb-24 px-6 lg:px-8 max-w-7xl mx-auto overflow-x-hidden">
<div className="pt-24 sm:pt-32 pb-16 sm:pb-24 px-6 lg:px-8 max-w-7xl mx-auto overflow-x-hidden">
{/* Hero Section - Priority render */}
<section className="grid grid-cols-1 lg:grid-cols-12 mb-16 lg:mb-24">
<div className="col-span-12 md:col-span-8">
@@ -20,7 +20,7 @@ export default function Contatti() {
<div className="h-2 w-24 bg-primary mt-4" />
</div>
<div className="col-span-12 md:col-start-9 md:col-span-4 mt-8 md:mt-auto">
<p className="text-on-surface-variant font-medium text-lg lg:text-xl leading-relaxed">
<p className="text-on-surface-variant font-medium text-base sm:text-lg lg:text-xl leading-relaxed">
Parliamo del tuo prossimo progetto. Nessun impegno, solo una conversazione.
</p>
</div>
@@ -42,7 +42,7 @@ export default function Contatti() {
whatsapp
</p>
<a
className="text-2xl sm:text-3xl lg:text-4xl font-black tracking-tighter text-on-surface hover:text-primary transition-colors duration-300"
className="text-xl sm:text-3xl lg:text-4xl font-black tracking-tighter text-on-surface hover:text-primary transition-colors duration-300"
href="tel:+393382451171"
>
+39 338 245 1171
@@ -53,7 +53,7 @@ export default function Contatti() {
email
</p>
<a
className="text-2xl sm:text-3xl lg:text-4xl font-black tracking-tighter text-on-surface hover:text-primary transition-colors duration-300 underline decoration-2 underline-offset-8"
className="text-xl sm:text-3xl lg:text-4xl font-black tracking-tighter text-on-surface hover:text-primary transition-colors duration-300 underline decoration-2 underline-offset-8"
href="mailto:info@cimaprogetti.it"
>
info@cimaprogetti.it
@@ -93,7 +93,7 @@ export default function Contatti() {
<div className="bg-background py-12 pr-0 md:pr-12">
<div className="flex flex-col h-full">
<div className="mb-6">
<h3 className="text-3xl lg:text-4xl xl:text-5xl font-black tracking-tighter text-on-surface mb-2">
<h3 className="text-2xl sm:text-3xl lg:text-4xl xl:text-5xl font-black tracking-tighter text-on-surface mb-2">
Nicola Leone Ciardi
</h3>
<p className="text-primary font-bold uppercase text-[10px] tracking-[0.2em]">
@@ -111,7 +111,7 @@ export default function Contatti() {
<span className="material-symbols-outlined text-primary">
call
</span>
<span className="font-bold tracking-tight">
<span className="font-bold tracking-tight text-sm sm:text-base break-all sm:break-normal">
+39 338 245 1178
</span>
</a>
@@ -122,7 +122,7 @@ export default function Contatti() {
<span className="material-symbols-outlined text-primary">
mail
</span>
<span className="font-bold tracking-tight">
<span className="font-bold tracking-tight text-sm sm:text-base break-all sm:break-normal">
nicolaleone.ciardi@cimaprogetti.it
</span>
</a>
@@ -134,7 +134,7 @@ export default function Contatti() {
<div className="bg-background py-12 md:pl-12 border-t md:border-t-0 md:border-l border-outline-variant/10">
<div className="flex flex-col h-full">
<div className="mb-6">
<h3 className="text-3xl lg:text-4xl xl:text-5xl font-black tracking-tighter text-on-surface mb-2">
<h3 className="text-2xl sm:text-3xl lg:text-4xl xl:text-5xl font-black tracking-tighter text-on-surface mb-2">
Valentina Madaudo
</h3>
<p className="text-primary font-bold uppercase text-[10px] tracking-[0.2em]">
@@ -152,7 +152,7 @@ export default function Contatti() {
<span className="material-symbols-outlined text-primary">
call
</span>
<span className="font-bold tracking-tight">
<span className="font-bold tracking-tight text-sm sm:text-base break-all sm:break-normal">
+39 339 358 0805
</span>
</a>
@@ -163,7 +163,7 @@ export default function Contatti() {
<span className="material-symbols-outlined text-primary">
mail
</span>
<span className="font-bold tracking-tight">
<span className="font-bold tracking-tight text-sm sm:text-base break-all sm:break-normal">
valentina.madaudo@cimaprogetti.it
</span>
</a>
+1 -1
View File
@@ -59,7 +59,7 @@ body {
}
.text-huge {
font-size: clamp(2.5rem, 8vw, 8rem);
font-size: clamp(2rem, 8vw, 8rem);
line-height: 0.9;
letter-spacing: -0.04em;
}
+7 -2
View File
@@ -1,4 +1,4 @@
import type { Metadata } from "next";
import type { Metadata, Viewport } from "next";
import { Inter } from "next/font/google";
import "./globals.css";
import Navbar from "@/components/Navbar";
@@ -9,6 +9,12 @@ const inter = Inter({
variable: "--font-inter",
});
export const viewport: Viewport = {
width: "device-width",
initialScale: 1,
viewportFit: "cover",
};
export const metadata: Metadata = {
title: "CiMa Progetti | Digital Architecture & Integration",
description:
@@ -64,7 +70,6 @@ export default function RootLayout({
/>
{/* Optimize LCP by reducing render-blocking resources */}
<meta name="viewport" content="viewport-fit=cover" />
</head>
<body className="min-h-screen flex flex-col">
<Navbar />
@@ -57,7 +57,7 @@ export default function AboutSection() {
{/* Content Overlay */}
<div ref={textRef} className="max-w-3xl mx-auto text-center text-white relative z-10">
<h2 className="text-huge font-black uppercase mb-8">Chi Siamo</h2>
<p className="text-lg lg:text-xl leading-relaxed mb-12">
<p className="text-base sm:text-lg lg:text-xl leading-relaxed mb-8 sm:mb-12">
CiMa Progetti unisce architettura e software engineering. Costruiamo
sistemi digitali solidi e scalabili per aziende che non accettano
compromessi.
@@ -79,7 +79,7 @@ export default function AboutSection() {
<div className="mt-12">
<a
href="/contatti"
className="inline-block border-2 border-white bg-white text-dark-bg px-10 py-5 font-bold uppercase tracking-widest text-lg transition-all hover:bg-transparent hover:text-white active:scale-[0.98]"
className="inline-block border-2 border-white bg-white text-dark-bg px-6 py-3 sm:px-10 sm:py-5 font-bold uppercase tracking-widest text-sm sm:text-lg transition-all hover:bg-transparent hover:text-white active:scale-[0.98]"
>
Lavora con Noi
</a>
@@ -46,14 +46,14 @@ export default function ApproccioSection() {
<h2 className="text-huge font-black uppercase mb-8">
Tutto Collegato
</h2>
<p className="text-xl lg:text-2xl leading-relaxed text-on-background mb-12">
<p className="text-base sm:text-xl lg:text-2xl leading-relaxed text-on-background mb-8 sm:mb-12">
Non software isolati, ma infrastrutture digitali portanti. Ogni
componente dialoga con gli altri per creare un sistema unico,
costruito attorno al vostro modo di lavorare.
</p>
<a
href="#servizi"
className="inline-block border-2 border-on-background text-on-background px-10 py-5 font-bold uppercase tracking-widest text-lg transition-all hover:bg-on-background hover:text-background active:scale-[0.98]"
className="inline-block border-2 border-on-background text-on-background px-6 py-3 sm:px-10 sm:py-5 font-bold uppercase tracking-widest text-sm sm:text-lg transition-all hover:bg-on-background hover:text-background active:scale-[0.98]"
>
Scopri i Servizi
</a>
@@ -129,7 +129,7 @@ export default function BeforeAfterSection() {
<div ref={ctaRef} className="text-center mt-12">
<a
href="/contatti"
className="inline-block bg-primary text-on-primary px-10 py-5 font-bold uppercase tracking-widest text-lg transition-all hover:brightness-110 active:scale-[0.98]"
className="inline-block bg-primary text-on-primary px-6 py-3 sm:px-10 sm:py-5 font-bold uppercase tracking-widest text-sm sm:text-lg transition-all hover:brightness-110 active:scale-[0.98]"
>
Trasforma il tuo Business
</a>
@@ -48,7 +48,7 @@ export default function CtaSection() {
<Link
ref={buttonRef}
href="/contatti"
className="inline-block border-2 border-white bg-white text-primary px-12 py-6 font-black uppercase tracking-widest text-lg lg:text-xl hover:bg-transparent hover:text-white hover:border-2 hover:border-white transition-colors"
className="inline-block border-2 border-white bg-white text-primary px-8 py-4 sm:px-12 sm:py-6 font-black uppercase tracking-widest text-sm sm:text-lg lg:text-xl hover:bg-transparent hover:text-white hover:border-2 hover:border-white transition-colors"
>
Contattaci
</Link>
@@ -41,7 +41,7 @@ export default function FilosofiaSection() {
<h2 className="text-sm font-bold uppercase tracking-[0.4em] text-primary">
La nostra idea
</h2>
<blockquote className="text-3xl md:text-4xl lg:text-6xl font-black leading-tight italic">
<blockquote className="text-2xl sm:text-3xl md:text-4xl lg:text-6xl font-black leading-tight italic">
&ldquo;La forma segue la funzione. La struttura la rende
duratura.&rdquo;
</blockquote>
@@ -51,7 +51,7 @@ export default function FilosofiaSection() {
</p>
<a
href="/contatti"
className="inline-block border-2 border-white text-white px-10 py-5 font-bold uppercase tracking-widest text-lg transition-all hover:bg-white hover:text-dark-bg active:scale-[0.98]"
className="inline-block border-2 border-white text-white px-6 py-3 sm:px-10 sm:py-5 font-bold uppercase tracking-widest text-sm sm:text-lg transition-all hover:bg-white hover:text-dark-bg active:scale-[0.98]"
>
Inizia il Progetto
</a>
@@ -32,7 +32,7 @@ export default function HeroSection() {
<div className="max-w-5xl mx-auto text-center">
<h1
ref={headlineRef}
className="text-huge font-black uppercase mb-12"
className="text-huge font-black uppercase mb-8 sm:mb-12"
>
La <span className="text-primary">struttura</span> digitale del
tuo business.
@@ -40,13 +40,13 @@ export default function HeroSection() {
<div ref={ctaRef} className="flex flex-col sm:flex-row gap-6 justify-center">
<Link
href="/contatti"
className="bg-primary text-on-primary px-10 py-5 font-bold uppercase tracking-widest text-lg transition-all hover:brightness-110 active:scale-[0.98] text-center"
className="bg-primary text-on-primary px-6 py-3 sm:px-10 sm:py-5 font-bold uppercase tracking-widest text-sm sm:text-lg transition-all hover:brightness-110 active:scale-[0.98] text-center"
>
Inizia il Progetto
</Link>
<a
href="#filosofia"
className="border-2 border-on-background text-on-background px-10 py-5 font-bold uppercase tracking-widest text-lg transition-all hover:bg-on-background hover:text-background active:scale-[0.98] text-center"
className="border-2 border-on-background text-on-background px-6 py-3 sm:px-10 sm:py-5 font-bold uppercase tracking-widest text-sm sm:text-lg transition-all hover:bg-on-background hover:text-background active:scale-[0.98] text-center"
>
Scopri il Metodo
</a>
@@ -100,11 +100,11 @@ export default function ServicesSection() {
>
<div className="max-w-7xl mx-auto w-full">
<div className="mb-16 text-center lg:text-left">
<h2 className="text-4xl lg:text-5xl font-black uppercase mb-6">
<h2 className="text-2xl sm:text-4xl lg:text-5xl font-black uppercase mb-4 sm:mb-6">
Cosa Facciamo
</h2>
<div className="w-24 h-2 bg-primary mb-8 hidden lg:block" />
<p className="text-xl text-secondary leading-relaxed max-w-2xl">
<p className="text-base sm:text-xl text-secondary leading-relaxed max-w-2xl">
Soluzioni su misura per il vostro metodo di lavoro. Automazione,
gestione dati e competenze umane in un unico flusso.
</p>
@@ -232,7 +232,7 @@ export default function ServicesSection() {
<div className="text-center mt-12">
<a
href="/contatti"
className="inline-block bg-primary text-on-primary px-10 py-5 font-bold uppercase tracking-widest text-lg transition-all hover:brightness-110 active:scale-[0.98]"
className="inline-block bg-primary text-on-primary px-6 py-3 sm:px-10 sm:py-5 font-bold uppercase tracking-widest text-sm sm:text-lg transition-all hover:brightness-110 active:scale-[0.98]"
>
Parliamo del tuo Progetto
</a>