Merge version_2 into main #6

Merged
bender merged 4 commits from version_2 into main 2026-03-13 13:51:47 +00:00
4 changed files with 59 additions and 66 deletions

View File

@@ -6,6 +6,7 @@ import { ServiceWrapper } from "@/components/ServiceWrapper";
import Tag from "@/tag/Tag";
import { getVisualEditScript } from "@/utils/visual-edit-script";
import { Libre_Baskerville } from "next/font/google";
import { Raleway } from "next/font/google";
@@ -14,12 +15,9 @@ export const metadata: Metadata = {
description: 'Scopri le opere di Flavia Esposito, pittrice contemporanea. Arte astratta elegante e minimalista. Collezione Orizzonti Lenti.',
};
const libreBaskerville = Libre_Baskerville({
variable: "--font-libre-baskerville", subsets: ["latin"],
weight: ["400", "700"],
});
const inter = Inter({
variable: "--font-inter", subsets: ["latin"],
const raleway = Raleway({
variable: "--font-raleway", subsets: ["latin"],
});
export default function RootLayout({
@@ -30,7 +28,7 @@ export default function RootLayout({
return (
<html lang="en" suppressHydrationWarning>
<ServiceWrapper>
<body className={`${libreBaskerville.variable} ${inter.variable} antialiased`}>
<body className={`${raleway.variable} antialiased`}>
<Tag />
{children}
<script

View File

@@ -16,29 +16,24 @@ export default function LandingPage() {
defaultButtonVariant="text-stagger"
defaultTextAnimation="entrance-slide"
borderRadius="soft"
contentWidth="small"
contentWidth="mediumLarge"
sizing="largeSizeMediumTitles"
background="fluid"
background="none"
cardStyle="solid"
primaryButtonStyle="diagonal-gradient"
secondaryButtonStyle="radial-glow"
headingFontWeight="bold"
primaryButtonStyle="flat"
secondaryButtonStyle="glass"
headingFontWeight="semibold"
>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
brandName="Flavia Place Art"
navItems={[
{ name: "Opere", id: "opere" },
{ name: "Opere", id: "gallery" },
{ name: "Chi sono", id: "about" },
{ name: "Tecnica", id: "technique" },
{ name: "Processo", id: "process" },
{ name: "Contatti", id: "contact" }
]}
button={{ text: "Scopri le opere", href: "#opere" }}
animateOnLoad={true}
navItemClassName="text-sm font-light tracking-wide hover:opacity-60 transition-opacity duration-300"
buttonClassName="px-6 py-2 bg-gradient-to-r from-[var(--primary-cta)] to-[var(--secondary-cta)] text-[var(--primary-cta-text)] rounded-md hover:shadow-lg transition-shadow duration-300"
buttonTextClassName="font-semibold text-sm"
/>
</div>
@@ -47,19 +42,19 @@ export default function LandingPage() {
title="Il colore come linguaggio"
description="Scopri un percorso estetico attraverso la pittura astratta contemporanea. Ogni opera è un invito a rallentare lo sguardo e abitare lo spazio sottile tra memoria e presente."
background={{ variant: "plain" }}
buttons={[{ text: "Scopri le opere", href: "#opere" }]}
buttons={[{ text: "Scopri le opere", href: "#gallery" }]}
mediaItems={[
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=ri8f5t", imageAlt: "Flavia Esposito, pittrice contemporanea, al lavoro nel suo studio"
}
]}
buttonAnimation="slide-up"
containerClassName="max-w-7xl mx-auto px-6 py-24"
titleClassName="text-5xl md:text-6xl font-bold leading-tight tracking-tight mb-6"
descriptionClassName="text-lg md:text-xl leading-relaxed text-gray-600 max-w-2xl mb-8"
containerClassName="max-w-7xl mx-auto px-6 py-32"
titleClassName="text-5xl md:text-7xl font-light leading-tight tracking-tight mb-6"
descriptionClassName="text-lg md:text-xl leading-relaxed text-gray-600 max-w-2xl mb-8 font-light"
buttonContainerClassName="flex gap-4"
buttonClassName="px-8 py-3 bg-gradient-to-r from-[var(--primary-cta)] to-pink-600 text-white rounded-md hover:shadow-xl transition-all duration-300"
buttonTextClassName="font-semibold"
buttonClassName="px-8 py-3 bg-[var(--foreground)] text-[var(--background)] rounded-sm hover:opacity-80 transition-opacity duration-300"
buttonTextClassName="font-light text-sm"
mediaWrapperClassName="md:w-1/2 mt-12 md:mt-0"
/>
</div>
@@ -79,12 +74,12 @@ export default function LandingPage() {
metricsAnimation="slide-up"
useInvertedBackground={false}
containerClassName="max-w-7xl mx-auto px-6 py-24"
titleClassName="text-4xl md:text-5xl font-bold mb-8"
descriptionClassName="text-base md:text-lg leading-relaxed text-gray-700 mb-12 max-w-3xl"
titleClassName="text-4xl md:text-5xl font-light mb-8"
descriptionClassName="text-base md:text-lg leading-relaxed text-gray-600 mb-12 max-w-3xl font-light"
metricsContainerClassName="grid grid-cols-3 gap-8 mt-12"
metricCardClassName="text-center"
metricValueClassName="text-3xl font-bold text-[var(--primary-cta)] mb-2"
metricTitleClassName="text-sm uppercase tracking-widest text-gray-600"
metricValueClassName="text-3xl font-light text-[var(--foreground)] mb-2"
metricTitleClassName="text-xs uppercase tracking-widest text-gray-500 font-light"
/>
</div>
@@ -100,15 +95,15 @@ export default function LandingPage() {
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=m8jwus&_wi=1"
imageAlt="Collezione Orizzonti Lenti - Dettaglio opera"
mediaAnimation="slide-up"
useInvertedBackground={true}
useInvertedBackground={false}
mediaPosition="right"
containerClassName="max-w-7xl mx-auto px-6 py-24"
titleClassName="text-4xl md:text-5xl font-bold mb-6"
descriptionClassName="text-base md:text-lg leading-relaxed text-gray-700 mb-10"
titleClassName="text-4xl md:text-5xl font-light mb-6"
descriptionClassName="text-base md:text-lg leading-relaxed text-gray-600 mb-10 font-light"
accordionContainerClassName="space-y-4"
accordionClassName="border-b border-gray-300 pb-4"
accordionTitleClassName="text-lg font-semibold cursor-pointer hover:text-[var(--primary-cta)] transition-colors"
accordionContentClassName="text-gray-600 mt-3 leading-relaxed"
accordionClassName="border-b border-gray-200 pb-4"
accordionTitleClassName="text-lg font-light cursor-pointer hover:text-[var(--foreground)] transition-colors"
accordionContentClassName="text-gray-600 mt-3 leading-relaxed font-light"
/>
</div>
@@ -147,14 +142,14 @@ export default function LandingPage() {
textboxLayout="default"
useInvertedBackground={false}
containerClassName="max-w-7xl mx-auto px-6 py-24"
textBoxTitleClassName="text-4xl md:text-5xl font-bold mb-4"
textBoxDescriptionClassName="text-lg text-gray-600 mb-16 max-w-3xl"
textBoxTitleClassName="text-4xl md:text-5xl font-light mb-4"
textBoxDescriptionClassName="text-lg text-gray-600 mb-16 max-w-3xl font-light"
gridClassName="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8"
cardClassName="group cursor-pointer"
imageClassName="w-full h-80 object-cover rounded-md mb-4 group-hover:opacity-90 transition-opacity duration-300"
cardNameClassName="text-xl font-semibold mb-2"
cardBrandClassName="text-sm text-gray-500 uppercase tracking-widest mb-2"
cardPriceClassName="text-lg font-semibold text-[var(--primary-cta)]"
imageClassName="w-full h-80 object-cover rounded-sm mb-4 group-hover:opacity-80 transition-opacity duration-300"
cardNameClassName="text-lg font-light mb-2"
cardBrandClassName="text-xs text-gray-500 uppercase tracking-widest mb-2 font-light"
cardPriceClassName="text-lg font-light text-[var(--foreground)]"
/>
</div>
@@ -173,12 +168,12 @@ export default function LandingPage() {
useInvertedBackground={false}
mediaPosition="left"
containerClassName="max-w-7xl mx-auto px-6 py-24"
titleClassName="text-4xl md:text-5xl font-bold mb-6"
descriptionClassName="text-base md:text-lg leading-relaxed text-gray-700 mb-10"
titleClassName="text-4xl md:text-5xl font-light mb-6"
descriptionClassName="text-base md:text-lg leading-relaxed text-gray-600 mb-10 font-light"
accordionContainerClassName="space-y-4"
accordionClassName="border-b border-gray-300 pb-4"
accordionTitleClassName="text-lg font-semibold cursor-pointer hover:text-[var(--primary-cta)] transition-colors"
accordionContentClassName="text-gray-600 mt-3 leading-relaxed"
accordionClassName="border-b border-gray-200 pb-4"
accordionTitleClassName="text-lg font-light cursor-pointer hover:text-[var(--foreground)] transition-colors"
accordionContentClassName="text-gray-600 mt-3 leading-relaxed font-light"
/>
</div>
@@ -199,17 +194,17 @@ export default function LandingPage() {
]}
animationType="blur-reveal"
textboxLayout="default"
useInvertedBackground={true}
useInvertedBackground={false}
containerClassName="max-w-7xl mx-auto px-6 py-24"
textBoxTitleClassName="text-4xl md:text-5xl font-bold mb-4"
textBoxDescriptionClassName="text-lg text-gray-600 mb-16 max-w-3xl"
textBoxTitleClassName="text-4xl md:text-5xl font-light mb-4"
textBoxDescriptionClassName="text-lg text-gray-600 mb-16 max-w-3xl font-light"
gridClassName="grid grid-cols-1 md:grid-cols-3 gap-8"
cardClassName="bg-white rounded-md overflow-hidden hover:shadow-lg transition-shadow duration-300"
cardClassName="bg-white rounded-sm overflow-hidden hover:shadow-md transition-shadow duration-300"
imageWrapperClassName="w-full h-64 overflow-hidden"
imageClassName="w-full h-full object-cover group-hover:scale-105 transition-transform duration-300"
cardTitleClassName="text-xl font-semibold mt-4 px-4"
excerptClassName="text-gray-600 mt-2 px-4 text-sm leading-relaxed"
authorDateClassName="text-xs text-gray-500 mt-4 px-4 pb-4"
cardTitleClassName="text-lg font-light mt-4 px-4"
excerptClassName="text-gray-600 mt-2 px-4 text-sm leading-relaxed font-light"
authorDateClassName="text-xs text-gray-500 mt-4 px-4 pb-4 font-light"
/>
</div>
@@ -218,13 +213,13 @@ export default function LandingPage() {
text="Richiedi informazioni\n\nSe desideri informazioni su un'opera, desideri commissioni, o vuoi semplicemente sapere di più sul mio lavoro, sono felice di ascoltare. Scrivimi qui sotto."
background={{ variant: "plain" }}
useInvertedBackground={false}
buttons={[{ text: "Compila il modulo", href: "#contact-form" }]}
buttons={[{ text: "Scrivi", href: "mailto:info@flaviaplaceart.com" }]}
containerClassName="max-w-4xl mx-auto px-6 py-24"
contentClassName="text-center"
textClassName="text-4xl md:text-5xl font-bold mb-8 leading-tight"
textClassName="text-4xl md:text-5xl font-light mb-8 leading-tight"
buttonContainerClassName="flex justify-center gap-4 mt-12"
buttonClassName="px-8 py-3 bg-gradient-to-r from-[var(--primary-cta)] to-pink-600 text-white rounded-md hover:shadow-xl transition-all duration-300"
buttonTextClassName="font-semibold"
buttonClassName="px-8 py-3 bg-[var(--foreground)] text-[var(--background)] rounded-sm hover:opacity-80 transition-opacity duration-300"
buttonTextClassName="font-light text-sm"
/>
</div>
@@ -233,7 +228,7 @@ export default function LandingPage() {
columns={[
{
title: "Navigazione", items: [
{ label: "Opere", href: "#opere" },
{ label: "Opere", href: "#gallery" },
{ label: "Chi sono", href: "#about" },
{ label: "Tecnica", href: "#technique" },
{ label: "Contatti", href: "#contact" }
@@ -256,9 +251,9 @@ export default function LandingPage() {
copyrightText="© 2024 Flavia Esposito - Flavia Place Art. Tutti i diritti riservati."
containerClassName="max-w-7xl mx-auto px-6 py-16"
columnsClassName="grid grid-cols-1 md:grid-cols-3 gap-12 mb-12"
columnTitleClassName="font-bold text-lg mb-4"
columnItemClassName="text-gray-600 hover:text-[var(--primary-cta)] transition-colors text-sm"
copyrightTextClassName="text-gray-500 text-center text-sm"
columnTitleClassName="font-light text-lg mb-4"
columnItemClassName="text-gray-600 hover:text-[var(--foreground)] transition-colors text-sm font-light"
copyrightTextClassName="text-gray-500 text-center text-sm font-light"
/>
</div>
</ThemeProvider>

View File

@@ -11,7 +11,7 @@ html {
body {
background-color: var(--background);
color: var(--foreground);
font-family: var(--font-inter), sans-serif;
font-family: var(--font-raleway), sans-serif;
position: relative;
min-height: 100vh;
overscroll-behavior: none;
@@ -24,5 +24,5 @@ h3,
h4,
h5,
h6 {
font-family: var(--font-libre-baskerville), serif;
font-family: var(--font-raleway), serif;
}

View File

@@ -12,13 +12,13 @@
--background: #ffffff;
--card: #f9f9f9;
--foreground: #120006e6;
--primary-cta: #e63946;
--foreground: #1a1a1a;
--primary-cta: #1a1a1a;
--primary-cta-text: #ffffff;
--secondary-cta: #f9f9f9;
--secondary-cta-text: #120006e6;
--accent: #e2e2e2;
--background-accent: #c4c4c4;
--accent: #e0e0e0;
--background-accent: #d0d0d0;
/* text sizing - set by ThemeProvider */
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);