15 Commits

Author SHA1 Message Date
0ec6fe9bdc Merge version_5 into main
Merge version_5 into main
2025-12-26 11:00:01 +00:00
5a3a0b4f64 Update src/app/page.tsx 2025-12-26 10:59:57 +00:00
a4b48ce257 Merge version_5 into main
Merge version_5 into main
2025-12-26 10:58:20 +00:00
aa00ab51e9 Update src/app/page.tsx 2025-12-26 10:58:16 +00:00
4fe3075447 Merge version_5 into main
Merge version_5 into main
2025-12-26 10:56:29 +00:00
7f401cddf5 Update src/app/page.tsx 2025-12-26 10:56:24 +00:00
370cc4b2fd Merge version_5 into main
Merge version_5 into main
2025-12-26 10:54:37 +00:00
190f527d84 Update src/app/page.tsx 2025-12-26 10:54:33 +00:00
d19439d0f6 Merge version_4 into main
Merge version_4 into main
2025-12-26 10:49:51 +00:00
0704529d35 Update src/app/page.tsx 2025-12-26 10:49:47 +00:00
4e33e3d831 Merge version_3 into main
Merge version_3 into main
2025-12-26 10:45:58 +00:00
f073845021 Update src/app/page.tsx 2025-12-26 10:45:53 +00:00
0a2eb3a8aa Merge version_2 into main
Merge version_2 into main
2025-12-26 10:41:24 +00:00
a72a2af0de Update src/app/page.tsx 2025-12-26 10:41:19 +00:00
a0cd6a31d9 Update src/app/globals.css 2025-12-26 10:41:18 +00:00
2 changed files with 166 additions and 267 deletions

View File

@@ -4,13 +4,13 @@
/* Base units */
/* --vw is set by ThemeProvider */
--background: #f8faff;;
--card: #f0f4ff;;
--foreground: #1a1a2e;;
--primary-cta: #3b82f6;;
--secondary-cta: #ffffff;;
--accent: #d5c6ff;;
--background-accent: #b394fa;;
--background: #ffffff;
--card: #fcfcfc;
--foreground: #00120ae6;
--primary-cta: #15ad59;
--secondary-cta: #ffffff;
--accent: #e2e2e2;
--background-accent: #c4c4c4;
/* text sizing - set by ThemeProvider */
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);
@@ -495,7 +495,7 @@ html {
body {
background-color: var(--background);
color: var(--foreground);
font-family: var(--font-dm-sans), sans-serif;
font-family: var(--font-inter-tight), sans-serif;
position: relative;
min-height: 100vh;
overscroll-behavior: none;
@@ -508,5 +508,5 @@ h3,
h4,
h5,
h6 {
font-family: var(--font-dm-sans), sans-serif;
font-family: var(--font-inter-tight), sans-serif;
}

View File

@@ -1,15 +1,6 @@
"use client"
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import HeroBillboardScroll from '@/components/sections/hero/HeroBillboardScroll';
import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
import FeatureCardSeven from '@/components/sections/feature/FeatureCardSeven';
import TestimonialCardTen from '@/components/sections/testimonial/TestimonialCardTen';
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FooterSplit from '@/components/sections/footer/FooterSplit';
import { Heart, Leaf, Mail, MapPin, Phone, Sprout, Star } from 'lucide-react';
export default function LandingPage() {
return (
@@ -25,254 +16,162 @@ export default function LandingPage() {
secondaryButtonStyle="layered"
headingFontWeight="bold"
>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingOverlay
brandName="No kinoa"
navItems={[
{ name: "About", id: "about" },
{ name: "Tea Collection", id: "products" },
{ name: "Benefits", id: "features" },
{ name: "Reviews", id: "testimonials" },
{ name: "Contact", id: "contact" }
]}
button={{
text: "Shop Now",
href: "contact"
}}
/>
</div>
<div id="hero" data-section="hero">
<HeroBillboardScroll
title="Discover Pure Tea Excellence"
description="Premium, sustainably sourced teas crafted for your well-being. Experience the art of tea with No kinoa."
tag="Premium Tea Collection"
tagIcon={Leaf}
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766745309132-gmr6t7cl.jpg"
imageAlt="Steaming cup of premium tea"
buttons={[
{ text: "Explore Collection", href: "products" },
{ text: "Learn More", href: "about" }
]}
/>
</div>
<div id="about" data-section="about">
<TestimonialAboutCard
tag="Our Story"
tagIcon={Sprout}
title="Bringing ancient tea traditions to modern wellness"
description="Founded on passion for quality"
subdescription="No kinoa Tea Company"
icon={Heart}
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766745314626-2ym71jw6.jpg"
imageAlt="Traditional tea brewing ceremony"
useInvertedBackground="noInvert"
/>
</div>
<div id="products" data-section="products">
<ProductCardTwo
title="Our Tea Collection"
description="Handpicked teas from the finest gardens around the world, each selection crafted for exceptional taste and health benefits."
tag="Best Sellers"
tagIcon={Star}
products={[
{
id: "green-tea-01",
brand: "No kinoa",
name: "Organic Green Tea Premium",
price: "$24.99",
rating: 5,
reviewCount: "148",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766745310530-7x1rnnq3.jpg",
imageAlt: "Premium green tea leaves"
},
{
id: "black-tea-01",
brand: "No kinoa",
name: "Classic Black Tea Blend",
price: "$21.99",
rating: 5,
reviewCount: "96",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766745311535-x8qbbar9.jpg",
imageAlt: "Black tea blend"
},
{
id: "white-tea-01",
brand: "No kinoa",
name: "Delicate White Tea",
price: "$26.99",
rating: 5,
reviewCount: "67",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766745312419-jtmnlnre.jpg",
imageAlt: "White tea premium selection"
},
{
id: "herbal-blend-01",
brand: "No kinoa",
name: "Wellness Herbal Blend",
price: "$19.99",
rating: 5,
reviewCount: "203",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766745313395-9dug9k92.jpg",
imageAlt: "Herbal wellness tea"
}
]}
gridVariant="four-items-2x2-equal-grid"
animationType="blur-reveal"
textboxLayout="default"
useInvertedBackground="noInvert"
/>
</div>
<div id="features" data-section="features">
<FeatureCardSeven
title="Why Choose No kinoa Tea"
description="Discover the benefits of premium tea and our commitment to quality"
tag="Benefits"
features={[
{
id: 1,
title: "100% Organic & Pure",
description: "All our teas are sourced from certified organic farms with no additives or artificial ingredients. We believe in natural purity.",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766745310530-7x1rnnq3.jpg"
},
{
id: 2,
title: "Health & Wellness",
description: "Rich in antioxidants and natural nutrients. Each cup supports your daily wellness routine with powerful health benefits.",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766745314626-2ym71jw6.jpg"
},
{
id: 3,
title: "Sustainable Sourcing",
description: "We partner with fair-trade farms that prioritize environmental conservation and support local communities.",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766745311535-x8qbbar9.jpg"
}
]}
animationType="slide-up"
textboxLayout="default"
useInvertedBackground="noInvert"
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardTen
title="Loved by Tea Enthusiasts"
description="Real reviews from our community of tea lovers"
tag="Customer Stories"
textboxLayout="default"
useInvertedBackground="noInvert"
testimonials={[
{
id: "1",
title: "Exceptional Quality",
quote: "No kinoa tea has completely transformed my daily routine. The flavor is incredible and I feel the health benefits immediately.",
name: "Sarah Mitchell",
role: "Wellness Coach",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766578240153-v8phsdtg.jpg",
imageAlt: "Sarah Mitchell"
},
{
id: "2",
title: "True Premium Experience",
quote: "I've tried many premium teas, but No kinoa stands out. Every cup tastes fresh and the customer service is outstanding.",
name: "James Chen",
role: "Tea Connoisseur",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766565662495-bt8vf9hb.jpg",
imageAlt: "James Chen"
},
{
id: "3",
title: "Life Changing",
quote: "The organic certification and sustainable sourcing give me peace of mind. Plus it tastes absolutely amazing!",
name: "Emma Rodriguez",
role: "Nutritionist",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766745317025-2924ozs6.jpg",
imageAlt: "Emma Rodriguez"
},
{
id: "4",
title: "Best Investment in Health",
quote: "Worth every penny. I've noticed improved sleep, better focus, and overall wellness since switching to No kinoa.",
name: "David Park",
role: "Entrepreneur",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766679215769-8spgigse.jpg",
imageAlt: "David Park"
}
]}
/>
</div>
<div id="contact" data-section="contact">
<ContactSplitForm
title="Get in Touch"
description="Have questions about our teas or need personalized recommendations? We'd love to hear from you. Reach out and join the No kinoa community."
inputs={[
{
name: "name",
type: "text",
placeholder: "Your Name",
required: true
},
{
name: "email",
type: "email",
placeholder: "Email Address",
required: true
}
]}
textarea={{
name: "message",
placeholder: "Tell us what you'd like to know...",
rows: 5,
required: true
}}
useInvertedBackground="noInvert"
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766745315859-uawn5fjd.jpg"
imageAlt="Tea relaxation moment"
mediaPosition="right"
buttonText="Send Message"
/>
</div>
<div id="footer" data-section="footer">
<FooterSplit
logoText="No kinoa"
title="Premium tea for a better life"
columns={[
{
title: "Product",
items: [
{ label: "Tea Collection", href: "#products" },
{ label: "Best Sellers", href: "#products" },
{ label: "About Tea", href: "#features" }
]
},
{
title: "Company",
items: [
{ label: "About Us", href: "#about" },
{ label: "Our Story", href: "#about" },
{ label: "Sustainability", href: "#about" }
]
},
{
title: "Support",
items: [
{ label: "Contact", href: "#contact" },
{ label: "FAQ", href: "#contact" },
{ label: "Shipping Info", href: "#contact" }
]
}
]}
contactItems={[
{ icon: Phone, text: "(555) 123-4567" },
{ icon: Mail, text: "hello@nokinoa.com" },
{ icon: MapPin, text: "Premium Tea Headquarters" }
]}
/>
<div className="min-h-screen bg-gradient-to-br from-emerald-50 to-teal-50">
<div className="container mx-auto px-4 py-16">
<div className="text-center space-y-8">
<h1 className="text-5xl font-bold text-emerald-900">
No kinoa
</h1>
<p className="text-xl text-emerald-700 max-w-2xl mx-auto">
Premium Organic Tea Collection - Discover pure, organic teas crafted for wellness.
Premium, sustainably sourced tea blends.
</p>
<div className="space-y-4">
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6 mt-12">
<div className="bg-white/80 backdrop-blur-sm rounded-lg p-6 shadow-lg">
<h3 className="font-semibold text-emerald-900 mb-2">Organic Green Tea Premium</h3>
<p className="text-emerald-700">$24.99</p>
<p className="text-sm text-emerald-600 mt-2">Premium green tea leaves</p>
</div>
<div className="bg-white/80 backdrop-blur-sm rounded-lg p-6 shadow-lg">
<h3 className="font-semibold text-emerald-900 mb-2">Classic Black Tea Blend</h3>
<p className="text-emerald-700">$21.99</p>
<p className="text-sm text-emerald-600 mt-2">Black tea blend</p>
</div>
<div className="bg-white/80 backdrop-blur-sm rounded-lg p-6 shadow-lg">
<h3 className="font-semibold text-emerald-900 mb-2">Delicate White Tea</h3>
<p className="text-emerald-700">$26.99</p>
<p className="text-sm text-emerald-600 mt-2">White tea premium selection</p>
</div>
<div className="bg-white/80 backdrop-blur-sm rounded-lg p-6 shadow-lg">
<h3 className="font-semibold text-emerald-900 mb-2">Wellness Herbal Blend</h3>
<p className="text-emerald-700">$19.99</p>
<p className="text-sm text-emerald-600 mt-2">Herbal wellness tea</p>
</div>
</div>
</div>
<div className="mt-16 bg-white/80 backdrop-blur-sm rounded-lg p-8 max-w-3xl mx-auto">
<h2 className="text-3xl font-bold text-emerald-900 mb-6">About Our Story</h2>
<p className="text-emerald-700 mb-4">
Bringing ancient tea traditions to modern wellness. Founded on passion for quality.
</p>
<div className="grid grid-cols-1 md:grid-cols-3 gap-6 mt-8">
<div className="text-center">
<h4 className="font-semibold text-emerald-900 mb-2">100% Organic & Pure</h4>
<p className="text-emerald-600 text-sm">
All our teas are sourced from certified organic farms with no additives.
</p>
</div>
<div className="text-center">
<h4 className="font-semibold text-emerald-900 mb-2">Health & Wellness</h4>
<p className="text-emerald-600 text-sm">
Rich in antioxidants and natural nutrients for daily wellness.
</p>
</div>
<div className="text-center">
<h4 className="font-semibold text-emerald-900 mb-2">Sustainable Sourcing</h4>
<p className="text-emerald-600 text-sm">
We partner with fair-trade farms that prioritize environmental conservation.
</p>
</div>
</div>
</div>
<div className="mt-16 bg-white/80 backdrop-blur-sm rounded-lg p-8 max-w-3xl mx-auto">
<h2 className="text-3xl font-bold text-emerald-900 mb-6">Customer Reviews</h2>
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
<div className="bg-emerald-50 rounded-lg p-6">
<p className="text-emerald-700 mb-4">
"No kinoa tea has completely transformed my daily routine. The flavor is incredible."
</p>
<p className="font-semibold text-emerald-900">Sarah Mitchell</p>
<p className="text-emerald-600 text-sm">Wellness Coach</p>
</div>
<div className="bg-emerald-50 rounded-lg p-6">
<p className="text-emerald-700 mb-4">
"I've tried many premium teas, but No kinoa stands out. Every cup tastes fresh."
</p>
<p className="font-semibold text-emerald-900">James Chen</p>
<p className="text-emerald-600 text-sm">Tea Connoisseur</p>
</div>
</div>
</div>
<div className="mt-16 bg-white/80 backdrop-blur-sm rounded-lg p-8 max-w-2xl mx-auto">
<h2 className="text-3xl font-bold text-emerald-900 mb-6">Get in Touch</h2>
<p className="text-emerald-700 mb-6">
Have questions about our teas? We'd love to hear from you.
</p>
<form className="space-y-4">
<div>
<input
type="text"
placeholder="Your Name"
className="w-full px-4 py-3 border border-emerald-200 rounded-lg focus:outline-none focus:ring-2 focus:ring-emerald-500"
required
/>
</div>
<div>
<input
type="email"
placeholder="Email Address"
className="w-full px-4 py-3 border border-emerald-200 rounded-lg focus:outline-none focus:ring-2 focus:ring-emerald-500"
required
/>
</div>
<div>
<textarea
placeholder="Tell us what you'd like to know..."
rows={5}
className="w-full px-4 py-3 border border-emerald-200 rounded-lg focus:outline-none focus:ring-2 focus:ring-emerald-500"
required
/>
</div>
<button
type="submit"
className="w-full bg-emerald-600 text-white py-3 px-6 rounded-lg hover:bg-emerald-700 transition-colors"
>
Send Message
</button>
</form>
</div>
<footer className="mt-16 pt-8 border-t border-emerald-200">
<div className="grid grid-cols-1 md:grid-cols-3 gap-8">
<div>
<h3 className="font-bold text-emerald-900 mb-4">Product</h3>
<ul className="space-y-2 text-emerald-700">
<li>Tea Collection</li>
<li>Best Sellers</li>
<li>About Tea</li>
</ul>
</div>
<div>
<h3 className="font-bold text-emerald-900 mb-4">Company</h3>
<ul className="space-y-2 text-emerald-700">
<li>About Us</li>
<li>Our Story</li>
<li>Sustainability</li>
</ul>
</div>
<div>
<h3 className="font-bold text-emerald-900 mb-4">Support</h3>
<ul className="space-y-2 text-emerald-700">
<li>Contact</li>
<li>FAQ</li>
<li>Shipping Info</li>
</ul>
</div>
</div>
<div className="mt-8 pt-8 border-t border-emerald-200 text-center">
<p className="text-emerald-600">
© 2024 No kinoa. Premium tea for a better life.
</p>
<div className="flex justify-center space-x-4 mt-4 text-emerald-700">
<span>(555) 123-4567</span>
<span>hello@nokinoa.com</span>
</div>
</div>
</footer>
</div>
</div>
</div>
</ThemeProvider>
);