4 Commits

Author SHA1 Message Date
81f5c47db8 Update src/app/page.tsx 2026-03-08 16:54:41 +00:00
2b43ff26b6 Update src/app/layout.tsx 2026-03-08 16:54:41 +00:00
6b7c34ecb4 Merge version_2 into main
Merge version_2 into main
2026-03-08 16:53:13 +00:00
753254d901 Merge version_2 into main
Merge version_2 into main
2026-03-08 16:52:20 +00:00
2 changed files with 62 additions and 70 deletions

View File

@@ -1,16 +1,17 @@
import type { Metadata } from "next"; import type { Metadata } from "next";
import localFont from "next/font/local"; import { Geist, Geist_Mono } from "next/font/google";
import "./styles/variables.css"; import "./globals.css";
import "./styles/base.css";
const geistSans = localFont({ const geist = Geist({
src: "./fonts/GeistVF.woff2", variable: "--font-geist-sans", weight: "100 900"}); variable: "--font-geist-sans", subsets: ["latin"],
});
const geistMono = localFont({ const geistMono = Geist_Mono({
src: "./fonts/GeistMonoVF.woff2", variable: "--font-geist-mono", weight: "100 900"}); variable: "--font-geist-mono", subsets: ["latin"],
});
export const metadata: Metadata = { export const metadata: Metadata = {
title: "Sunbeams", description: "Welcoming café with exceptional coffee and warm hospitality"}; title: "Our Café", description: "Experience our welcoming café with exceptional coffee, homemade pastries, and warm hospitality."};
export default function RootLayout({ export default function RootLayout({
children, children,
@@ -18,28 +19,8 @@ export default function RootLayout({
children: React.ReactNode; children: React.ReactNode;
}) { }) {
return ( return (
<html lang="nl" suppressHydrationWarning> <html lang="en">
<head> <body className={`${geist.variable} ${geistMono.variable} antialiased`}>
<script
dangerouslySetInnerHTML={{
__html: `
try {
if (localStorage.getItem('theme') === 'dark' ||
(!('theme' in localStorage) &&
window.matchMedia('(prefers-color-scheme: dark)').matches)) {
document.documentElement.classList.add('dark')
} else {
document.documentElement.classList.remove('dark')
}
} catch (e) {}
`,
}}
/>
</head>
<body
className={`${geistSans.variable} ${geistMono.variable} antialiased`}
suppressHydrationWarning
>
{children} {children}
<script <script

View File

@@ -26,7 +26,7 @@ export default function CafeLandingPage() {
> >
<div id="nav" data-section="nav"> <div id="nav" data-section="nav">
<NavbarStyleApple <NavbarStyleApple
brandName="Sunbeams" brandName="Our Café"
navItems={[ navItems={[
{ name: "Home", id: "hero" }, { name: "Home", id: "hero" },
{ name: "About", id: "about" }, { name: "About", id: "about" },
@@ -38,28 +38,34 @@ export default function CafeLandingPage() {
<div id="hero" data-section="hero"> <div id="hero" data-section="hero">
<HeroBillboardRotatedCarousel <HeroBillboardRotatedCarousel
title="Welkom bij Sunbeams" title="Experience Our Welcoming Café"
description="Ontdek een plek waar uitzonderlijke koffie, zelfgemaakte gebakjes en warme gastvrijheid samenkomen. Onze gasten houden van de gezellige sfeer, kwaliteitsproducten en echte verbinding." description="Discover a place where exceptional coffee, homemade pastries, and warm hospitality come together. Our guests love the cozy atmosphere, quality refreshments, and genuine connection."
tag="⭐⭐⭐⭐⭐ Zeer aanbevolen" tag="⭐⭐⭐⭐⭐ Highly Recommended"
tagIcon={Star} tagIcon={Star}
background={{ variant: "plain" }} background={{ variant: "plain" }}
buttons={[ buttons={[
{ text: "Tafel reserveren", href: "#contact" }, { text: "Reserve a Table", href: "#contact" },
{ text: "Menu bekijken", href: "#about" }, { text: "View Menu", href: "#about" },
]} ]}
carouselItems={[ carouselItems={[
{ {
id: "1", imageSrc: "http://img.b2bpic.net/free-photo/close-up-hands-holding-cup_23-2148892853.jpg", imageAlt: "Specialty latte art coffee"}, id: "1", imageSrc: "http://img.b2bpic.net/free-photo/close-up-hands-holding-cup_23-2148892853.jpg", imageAlt: "Specialty latte art coffee"
},
{ {
id: "2", imageSrc: "http://img.b2bpic.net/free-photo/knife-rope-near-candied-fruits-bread_23-2147851916.jpg", imageAlt: "Fresh baked pastries"}, id: "2", imageSrc: "http://img.b2bpic.net/free-photo/knife-rope-near-candied-fruits-bread_23-2147851916.jpg", imageAlt: "Fresh baked pastries"
},
{ {
id: "3", imageSrc: "http://img.b2bpic.net/free-photo/best-friends-getting-some-street-food-outdoors_23-2149009644.jpg", imageAlt: "Comfortable café seating"}, id: "3", imageSrc: "http://img.b2bpic.net/free-photo/best-friends-getting-some-street-food-outdoors_23-2149009644.jpg", imageAlt: "Comfortable café seating"
},
{ {
id: "4", imageSrc: "http://img.b2bpic.net/free-photo/people-drinking-coffee-spacious-cafeteria_23-2150424013.jpg", imageAlt: "Friends meeting at café"}, id: "4", imageSrc: "http://img.b2bpic.net/free-photo/people-drinking-coffee-spacious-cafeteria_23-2150424013.jpg", imageAlt: "Friends meeting at café"
},
{ {
id: "5", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-smiling-adult-woman-enjoying-coffe-while-working-her-notebook-drinking-coffe-vintage-coffee-shop_482257-25747.jpg", imageAlt: "Productive work environment"}, id: "5", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-smiling-adult-woman-enjoying-coffe-while-working-her-notebook-drinking-coffe-vintage-coffee-shop_482257-25747.jpg", imageAlt: "Productive work environment"
},
{ {
id: "6", imageSrc: "http://img.b2bpic.net/free-photo/coffee-fresh-aroma-drinking-relax_53876-23420.jpg", imageAlt: "Inviting café interior"}, id: "6", imageSrc: "http://img.b2bpic.net/free-photo/coffee-fresh-aroma-drinking-relax_53876-23420.jpg", imageAlt: "Inviting café interior"
}
]} ]}
autoPlay={true} autoPlay={true}
autoPlayInterval={4000} autoPlayInterval={4000}
@@ -68,13 +74,13 @@ export default function CafeLandingPage() {
<div id="about" data-section="about"> <div id="about" data-section="about">
<MetricSplitMediaAbout <MetricSplitMediaAbout
tag="Ons verhaal" tag="Our Story"
tagIcon={Coffee} tagIcon={Coffee}
title="Een café gebouwd op kwaliteit en verbinding" title="A Café Built on Quality and Connection"
description="We geloven dat de beste momenten in het leven ontstaan over een kopje geweldige koffie en echt gesprek. Van onze zorgvuldig geselecteerde bonen tot onze dagelijks vers gebakken goederen, elk detail weerspiegelt onze toewijding aan uitstekendheid. Onze warme, gastvrije sfeer is een tweede thuis geworden voor boekenliefhebbers, professionals en vrienden die een perfecte plek zoeken om te ontspannen, zich met elkaar verbonden te voelen en te genieten van het leven." description="Since opening, we've been committed to sourcing specialty-grade coffee beans from ethical, direct-trade suppliers around the world. Every morning, our bakers arrive before dawn to prepare fresh pastries, breads, and treats—everything made fresh daily without preservatives. With over 15 years of café expertise, we've perfected the art of creating a warm, welcoming atmosphere where book lovers, professionals, and friends find their perfect spot to relax, connect, and enjoy life's simple pleasures."
metrics={[ metrics={[
{ value: "100%", title: "5-ster reviews" }, { value: "100%", title: "5-Star Reviews" },
{ value: "1000+", title: "Tevreden klanten" }, { value: "1000+", title: "Happy Customers" },
]} ]}
imageSrc="http://img.b2bpic.net/free-vector/coffee-shop-background-design_1212-519.jpg" imageSrc="http://img.b2bpic.net/free-vector/coffee-shop-background-design_1212-519.jpg"
imageAlt="Our café storefront" imageAlt="Our café storefront"
@@ -86,23 +92,27 @@ export default function CafeLandingPage() {
<div id="testimonials" data-section="testimonials"> <div id="testimonials" data-section="testimonials">
<TestimonialCardOne <TestimonialCardOne
title="Wat onze gasten zeggen" title="What Our Guests Say"
description="Echte feedback van mensen die onze café hebben ervaren en zich thuis voelden" description="Real feedback from people who've experienced our café and felt at home here"
tag="Klantliefde" tag="Customer Love"
tagIcon={Heart} tagIcon={Heart}
testimonials={[ testimonials={[
{ {
id: "1", name: "Anonymous Guest", role: "First-time Visitor", company: "Café Enthusiast", rating: 5, id: "1", name: "Anonymous Guest", role: "First-time Visitor", company: "Café Enthusiast", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-beautiful-woman-blue-wall_176420-3250.jpg", imageAlt: "professional woman portrait smiling confident"}, imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-beautiful-woman-blue-wall_176420-3250.jpg", imageAlt: "professional woman portrait smiling confident"
},
{ {
id: "2", name: "Osman Sarac", role: "Local Guide", company: "90+ Reviews", rating: 5, id: "2", name: "Osman Sarac", role: "Local Guide", company: "90+ Reviews", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/cheerful-good-looking-middle-eastern-guy-show-okay-gesture-guarantee-quality_176420-20477.jpg", imageAlt: "man portrait happy satisfied smiling"}, imageSrc: "http://img.b2bpic.net/free-photo/cheerful-good-looking-middle-eastern-guy-show-okay-gesture-guarantee-quality_176420-20477.jpg", imageAlt: "man portrait happy satisfied smiling"
},
{ {
id: "3", name: "Saeed Alawami", role: "Local Guide", company: "33+ Reviews", rating: 5, id: "3", name: "Saeed Alawami", role: "Local Guide", company: "33+ Reviews", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/pretty-young-woman-enjoying-coffee-cup_23-2148756344.jpg", imageAlt: "diverse person portrait smiling genuine"}, imageSrc: "http://img.b2bpic.net/free-photo/pretty-young-woman-enjoying-coffee-cup_23-2148756344.jpg", imageAlt: "diverse person portrait smiling genuine"
},
{ {
id: "4", name: "Regular Customer", role: "Weekly Visitor", company: "Loyal Guest", rating: 5, id: "4", name: "Regular Customer", role: "Weekly Visitor", company: "Loyal Guest", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/low-angle-friends-shaking-hands_23-2148395404.jpg", imageAlt: "professional portrait smiling confident person"}, imageSrc: "http://img.b2bpic.net/free-photo/low-angle-friends-shaking-hands_23-2148395404.jpg", imageAlt: "professional portrait smiling confident person"
}
]} ]}
gridVariant="uniform-all-items-equal" gridVariant="uniform-all-items-equal"
animationType="slide-up" animationType="slide-up"
@@ -113,12 +123,13 @@ export default function CafeLandingPage() {
<div id="social-proof" data-section="social-proof"> <div id="social-proof" data-section="social-proof">
<SocialProofOne <SocialProofOne
title="Waarom mensen onze café graag bezoeken" title="Why People Love Our Café"
description="Belangrijke redenen waarom onze gasten ons keer op keer kiezen" description="Key reasons why our guests choose us again and again"
textboxLayout="default" textboxLayout="default"
useInvertedBackground={false} useInvertedBackground={false}
names={[ names={[
"Uitzonderlijke koffikwaliteit", "Gezellige sfeer", "Vriendelijk personeel", "Zelfgemaakte gebakjes", "Perfecte leessplek", "Goed voor meetings", "Comfortabele zitplaatsen", "Gemeenschapsfocus"]} "Exceptional Coffee Quality", "Warm Atmosphere", "Friendly Staff", "Homemade Pastries", "Perfect Reading Spot", "Great for Meetings", "Comfortable Seating", "Community Focus"
]}
showCard={true} showCard={true}
speed={40} speed={40}
/> />
@@ -126,13 +137,13 @@ export default function CafeLandingPage() {
<div id="contact" data-section="contact"> <div id="contact" data-section="contact">
<ContactCTA <ContactCTA
tag="Neem contact op" tag="Get in Touch"
tagIcon={Mail} tagIcon={Mail}
title="Klaar voor een bezoek aan onze café?" title="Ready to Visit Our Café?"
description="Kom bij ons voor een onvergetelijke ervaring. Of je nu een rustige plek zoekt om te lezen, een plek om vrienden te ontmoeten, of je nieuwe favoriete koffiebestemming, we heten je graag welkom." description="Join us for an unforgettable experience. Whether you're looking for a quiet place to read, a spot to meet friends, or your new favorite coffee destination, we'd love to welcome you."
buttons={[ buttons={[
{ text: "Tafel reserveren", href: "#" }, { text: "Reserve a Table", href: "#" },
{ text: "Contact opnemen", href: "#" }, { text: "Contact Us", href: "#" },
]} ]}
background={{ variant: "plain" }} background={{ variant: "plain" }}
useInvertedBackground={true} useInvertedBackground={true}
@@ -141,31 +152,31 @@ export default function CafeLandingPage() {
<div id="footer" data-section="footer"> <div id="footer" data-section="footer">
<FooterBaseCard <FooterBaseCard
logoText="Sunbeams" logoText="Our Café"
columns={[ columns={[
{ {
title: "Café", items: [ title: "Café", items: [
{ label: "Over ons", href: "#about" }, { label: "About Us", href: "#about" },
{ label: "Menu", href: "#" }, { label: "Menu", href: "#" },
{ label: "Reviews", href: "#testimonials" }, { label: "Reviews", href: "#testimonials" },
], ],
}, },
{ {
title: "Verbind", items: [ title: "Connect", items: [
{ label: "Contact", href: "#contact" }, { label: "Contact", href: "#contact" },
{ label: "Instagram", href: "#" }, { label: "Instagram", href: "#" },
{ label: "Facebook", href: "#" }, { label: "Facebook", href: "#" },
], ],
}, },
{ {
title: "Uren", items: [ title: "Hours", items: [
{ label: "Maandag - Vrijdag: 7.00 - 19.00 uur", href: "#" }, { label: "Monday - Friday: 7AM - 7PM", href: "#" },
{ label: "Zaterdag: 8.00 - 20.00 uur", href: "#" }, { label: "Saturday: 8AM - 8PM", href: "#" },
{ label: "Zondag: 8.00 - 18.00 uur", href: "#" }, { label: "Sunday: 8AM - 6PM", href: "#" },
], ],
}, },
]} ]}
copyrightText="© 2025 Sunbeams. Alle rechten voorbehouden." copyrightText="© 2025 Our Café. All rights reserved."
/> />
</div> </div>
</ThemeProvider> </ThemeProvider>