3 Commits

Author SHA1 Message Date
477fb707ce Update src/app/styles/base.css 2026-05-15 08:37:03 +00:00
f6c74b71d8 Update src/app/page.tsx 2026-05-15 08:37:02 +00:00
cc1890ea80 Update src/app/layout.tsx 2026-05-15 08:37:02 +00:00
3 changed files with 123 additions and 276 deletions

View File

@@ -7,6 +7,7 @@ import { ServiceWrapper } from "@/components/ServiceWrapper";
import Tag from "@/tag/Tag"; import Tag from "@/tag/Tag";
import { getVisualEditScript } from "@/utils/visual-edit-script"; import { getVisualEditScript } from "@/utils/visual-edit-script";
import { Libre_Baskerville } from "next/font/google"; import { Libre_Baskerville } from "next/font/google";
import { Poppins } from "next/font/google";
@@ -20,15 +21,9 @@ export const metadata: Metadata = {
}, },
}; };
const libreBaskerville = Libre_Baskerville({
variable: "--font-libre-baskerville", const poppins = Poppins({ variable: "--font-poppins", subsets: ["latin"], weight: ["400", "600", "700"] });
subsets: ["latin"], const inter = Inter({ variable: "--font-inter", subsets: ["latin"] });
weight: ["400", "700"],
});
const inter = Inter({
variable: "--font-inter",
subsets: ["latin"],
});
export default function RootLayout({ export default function RootLayout({
children, children,
@@ -38,7 +33,7 @@ export default function RootLayout({
return ( return (
<html lang="en" suppressHydrationWarning> <html lang="en" suppressHydrationWarning>
<ServiceWrapper> <ServiceWrapper>
<body className={`${libreBaskerville.variable} ${inter.variable} antialiased`}> <body className={`${poppins.variable} ${inter.variable} antialiased`}>
<Tag /> <Tag />
{children} {children}
<script <script

View File

@@ -2,286 +2,138 @@
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider"; import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react"; import ReactLenis from "lenis/react";
import ContactText from '@/components/sections/contact/ContactText'; import ContactCTA from '@/components/sections/contact/ContactCTA';
import FaqSplitText from '@/components/sections/faq/FaqSplitText'; import FaqDouble from '@/components/sections/faq/FaqDouble';
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal'; import FooterBase from '@/components/sections/footer/FooterBase';
import HeroBillboardScroll from '@/components/sections/hero/HeroBillboardScroll'; import HeroSplitKpi from '@/components/sections/hero/HeroSplitKpi';
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered'; import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import ProductCardFour from '@/components/sections/product/ProductCardFour'; import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne'; import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard'; import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne'; import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
import { Coffee } from "lucide-react"; import { Coffee, MapPin, Clock } from "lucide-react";
export default function LandingPage() { export default function LandingPage() {
return ( return (
<ThemeProvider <ThemeProvider
defaultButtonVariant="text-shift" defaultButtonVariant="hover-magnetic"
defaultTextAnimation="background-highlight" defaultTextAnimation="reveal-blur"
borderRadius="rounded" borderRadius="pill"
contentWidth="mediumSmall" contentWidth="mediumLarge"
sizing="large" sizing="largeSizeMediumTitles"
background="noiseDiagonalGradient" background="noise"
cardStyle="gradient-bordered" cardStyle="glass-elevated"
primaryButtonStyle="shadow" primaryButtonStyle="primary-glow"
secondaryButtonStyle="radial-glow" secondaryButtonStyle="glass"
headingFontWeight="medium" headingFontWeight="semibold"
> >
<ReactLenis root> <ReactLenis root>
<div id="nav" data-section="nav"> <div id="nav" data-section="nav">
<NavbarStyleCentered <NavbarLayoutFloatingOverlay
navItems={[ navItems={[
{ { name: "Home", id: "#hero" },
name: "Home", { name: "Über uns", id: "#about" },
id: "#hero", { name: "Menu", id: "#menu" },
}, { name: "Stimmen", id: "#testimonials" },
{ { name: "Kontakt", id: "#contact" },
name: "Über uns", ]}
id: "#about", brandName="Caphe am Eberstein"
}, button={{ text: "Reservieren", href: "#contact" }}
{ />
name: "Speisekarte", </div>
id: "#menu",
},
{
name: "Kontakt",
id: "#contact",
},
]}
brandName="Caphe am Eberstein"
/>
</div>
<div id="hero" data-section="hero"> <div id="hero" data-section="hero">
<HeroBillboardScroll <HeroSplitKpi
background={{ background={{ variant: "sparkles-gradient" }}
variant: "plain", title="Kaffeekultur neu erleben in Pforzheim"
}} description="Dein täglicher Rückzugsort für exzellenten Specialty Coffee, hausgemachte Egg Drop Sandwiches und Vibes, die bleiben. Wir sind das Caphe am Eberstein dein 'Zuhaus' in der Nordstadt."
title="Dein Lieblingsplatz für Brunch in Pforzheim" kpis={[
description="Erlebe unvergleichlichen Kaffeegenuss und hausgemachte Delikatessen am Eberstein. Frisch, modern, mit ganz viel Herz." { value: "100%", label: "Regional bezogen" },
buttons={[ { value: "Handmade", label: "Täglich frisch" },
{ { value: "Modern", label: "Vibe check passed" }
text: "Speisekarte ansehen", ]}
href: "#menu", buttons={[{ text: "Menu entdecken", href: "#menu" }]}
}, imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DklGRPo0KHoJHExCJarv7b5d46/uploaded-1778834208618-gwvum2hq.png"
]} mediaAnimation="blur-reveal"
imageSrc="http://img.b2bpic.net/free-photo/retro-theatre-scene-celebrate-world-theatre-day_23-2151211472.jpg" />
/> </div>
</div>
<div id="about" data-section="about"> <div id="about" data-section="about">
<TestimonialAboutCard <InlineImageSplitTextAbout
useInvertedBackground={false} useInvertedBackground={true}
tag="Unsere Philosophie" heading={[
title="Dein gemütlicher Rückzugsort" { type: 'text', content: 'Mehr als nur ein ' },
description="Willkommen im Caphe am Eberstein. Mitten in der Nordstadt schaffen wir einen Ort, an dem moderner Lifestyle auf herzliche Gastfreundschaft trifft. Ob sonnige Plätze auf der Terrasse oder gemütliche Ecken drinnen hier bist du zu Hause." { type: 'image', src: 'https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DklGRPo0KHoJHExCJarv7b5d46/uploaded-1778834208618-28mtamyq.jpg' },
subdescription="Unser Raum ist barrierefrei und mit Liebe zum Detail gestaltet." { type: 'text', content: ' Kaffee.' }
icon={Coffee} ]}
imageSrc="http://img.b2bpic.net/free-photo/full-shot-people-sitting-bistro_23-2149366419.jpg" buttons={[{ text: "Lerne uns kennen", href: "#about" }]}
mediaAnimation="slide-up" />
/> </div>
</div>
<div id="menu" data-section="menu"> <div id="menu" data-section="menu">
<ProductCardFour <ProductCardTwo
animationType="slide-up" title="Unsere Favoriten"
textboxLayout="split" description="Hausgemacht, frisch & für jeden Vibe."
gridVariant="two-columns-alternating-heights" gridVariant="bento-grid"
useInvertedBackground={false} animationType="slide-up"
products={[ textboxLayout="split"
{ products={[
id: "1", { id: "1", brand: "Signature", name: "Egg Drop Sandwich", price: "8,50 €", rating: 5, imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DklGRPo0KHoJHExCJarv7b5d46/uploaded-1778834208618-gwvum2hq.png" },
name: "Signature Egg Drop", { id: "2", brand: "Matcha", name: "Strawberry Iced Matcha", price: "5,90 €", rating: 5, imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DklGRPo0KHoJHExCJarv7b5d46/uploaded-1778834208618-28mtamyq.jpg" }
price: "8,50 €", ]}
variant: "Herzhaft & fluffig", />
imageSrc: "http://img.b2bpic.net/free-photo/sandwich-with-tomato-cucumber-green-herbs-with-bowl-lentil-soup_114579-3074.jpg", </div>
},
{
id: "2",
name: "Strawberry Matcha",
price: "5,90 €",
variant: "Erfrischend & trendy",
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-hands-holding-delicious-drink_23-2149356018.jpg",
},
{
id: "3",
name: "Café Sua Da",
price: "4,50 €",
variant: "Vietnamesische Tradition",
imageSrc: "http://img.b2bpic.net/free-photo/top-view-empty-cup-with-red-kettle-brown-coffee-seeds-flowers-wooden-desk_140725-19726.jpg",
},
{
id: "4",
name: "Zimt-Schnecke",
price: "4,20 €",
variant: "Hausgemacht & warm",
imageSrc: "http://img.b2bpic.net/free-photo/shortcrust-pastry-basket-with-condensed-milk-nuts_140725-6802.jpg",
},
{
id: "5",
name: "Karottenkuchen",
price: "4,80 €",
variant: "Saftig & frisch",
imageSrc: "http://img.b2bpic.net/free-photo/top-view-delicious-donuts-concept_23-2148761711.jpg",
},
{
id: "6",
name: "Flat White",
price: "3,90 €",
variant: "Barista Spezialität",
imageSrc: "http://img.b2bpic.net/free-photo/iced-caramel-macchiato_23-2151961350.jpg",
},
]}
title="Unsere Highlights"
description="Handverlesene Spezialitäten, die Körper und Seele verwöhnen."
/>
</div>
<div id="testimonials" data-section="testimonials"> <div id="testimonials" data-section="testimonials">
<TestimonialCardOne <TestimonialCardSix
animationType="slide-up" title="Was unsere Community sagt"
textboxLayout="split" description="Eure Liebe macht uns aus."
gridVariant="three-columns-all-equal-width" animationType="slide-up"
useInvertedBackground={false} textboxLayout="split"
testimonials={[ testimonials={[
{ { id: "1", name: "Julia M.", handle: "@foodie_pforzheim", testimonial: "Der Vibe hier ist einfach unschlagbar. Das beste Egg Drop in town!", icon: Coffee }
id: "1", ]}
name: "Lisa M.", />
role: "Foodie", </div>
company: "Pforzheim",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/smiling-woman-bar_23-2147680953.jpg",
},
{
id: "2",
name: "Markus K.",
role: "Kaffeeliebhaber",
company: "Nordstadt",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/attractive-happy-young-bearded-man-trendy-hat-texting-messages-via-social-networks-browsing-internet-using-free-wifi-his-electronic-device-coffee-break-restaurant_273609-1934.jpg",
},
{
id: "3",
name: "Sarah P.",
role: "Studentin",
company: "Pforzheim",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/cute-tanned-brunette-woman-stylish-red-dress-beret-sunglasses-sits-cafe_197531-24181.jpg",
},
{
id: "4",
name: "Thomas W.",
role: "Anwohner",
company: "Nordstadt",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/hipster-woman-studying-cafe_329181-2086.jpg",
},
{
id: "5",
name: "Julia H.",
role: "Stammgast",
company: "Pforzheim",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/person-cafe-enjoying-book_23-2150064701.jpg",
},
]}
title="Was unsere Gäste sagen"
description="Wir freuen uns riesig über euer Feedback!"
/>
</div>
<div id="socialProof" data-section="socialProof"> <div id="socialProof" data-section="socialProof">
<SocialProofOne <SocialProofOne
textboxLayout="split" names={["Regio-Kaffee", "Bio-Markt Eberstein", "Nordstadt Rösterei"]}
useInvertedBackground={false} title="Regional für dich."
names={[ />
"Regio-Kaffee", </div>
"Lokale Molkerei",
"Bio-Markt Eberstein",
"Pforzheimer Bäckerverein",
"Nordstadt Rösterei",
"Frische Bio-Eier",
"Regionaler Obsthof",
]}
title="Unsere Partner"
description="Wir vertrauen nur auf die besten regionalen Lieferanten."
/>
</div>
<div id="faq" data-section="faq"> <div id="faq" data-section="faq">
<FaqSplitText <FaqDouble
useInvertedBackground={false} title="Alles Wichtige"
faqs={[ faqsAnimation="slide-up"
{ textboxLayout="split"
id: "1", faqs={[
title: "Gibt es vegane Optionen?", { id: "1", title: "Du bist vegan unterwegs?", content: "Null Stress, wir haben immer vegane Optionen am Start." },
content: "Ja, wir haben täglich vegane Kuchen und Pflanzenmilch-Optionen.", { id: "2", title: "Barrierefrei?", content: "Klar, komm einfach rein, alles ebenerdig." }
}, ]}
{ />
id: "2", </div>
title: "Ist das Café barrierefrei?",
content: "Absolut, der Eingang und der Gastraum sind komplett ebenerdig.",
},
{
id: "3",
title: "Kann man reservieren?",
content: "Gerne für größere Gruppen ruf uns einfach an.",
},
]}
sideTitle="Fragen?"
sideDescription="Hier findest du Antworten auf häufige Fragen."
faqsAnimation="slide-up"
/>
</div>
<div id="contact" data-section="contact"> <div id="contact" data-section="contact">
<ContactText <ContactCTA
useInvertedBackground={false} tag="Kontakt"
background={{ title="Komm auf einen Kaffee vorbei!"
variant: "plain", description="Wir freuen uns auf deinen Besuch bei uns am Eberstein."
}} buttons={[{ text: "Ebersteinstr. 12, Pforzheim", href: "#" }]}
text="Besuche uns in der Ebersteinstr. 12, Pforzheim Wir freuen uns auf dich!" background={{ variant: "sparkles-gradient" }}
/> />
</div> </div>
<div id="footer" data-section="footer"> <div id="footer" data-section="footer">
<FooterBaseReveal <FooterBase
logoText="Caphe am Eberstein" logoText="Caphe am Eberstein"
columns={[ columns={[
{ { title: "Links", items: [{ label: "Reservieren", href: "#contact" }, { label: "Menu", href: "#menu" }] }
title: "Infos", ]}
items: [ />
{ </div>
label: "Standort",
href: "#contact",
},
{
label: "Öffnungszeiten",
href: "#",
},
{
label: "Kontakt",
href: "#contact",
},
],
},
{
title: "Rechtliches",
items: [
{
label: "Impressum",
href: "#",
},
{
label: "Datenschutz",
href: "#",
},
],
},
]}
/>
</div>
</ReactLenis> </ReactLenis>
</ThemeProvider> </ThemeProvider>
); );
} }

View File

@@ -24,5 +24,5 @@ h3,
h4, h4,
h5, h5,
h6 { h6 {
font-family: var(--font-libre-baskerville), serif; font-family: var(--font-poppins), sans-serif;
} }