Merge version_2 into main #2
310
src/app/page.tsx
310
src/app/page.tsx
@@ -10,9 +10,9 @@ import HeroCentered from '@/components/sections/hero/HeroCentered';
|
||||
import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
|
||||
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
|
||||
import ProductCardThree from '@/components/sections/product/ProductCardThree';
|
||||
import TestimonialCardThirteen from '@/components/sections/testimonial/TestimonialCardThirteen';
|
||||
import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
|
||||
import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
|
||||
import { Instagram, Leaf, Moon, Star, Waves } from "lucide-react";
|
||||
import { Instagram, Leaf, Moon, Star, Waves, Gift, Users, Phone } from "lucide-react";
|
||||
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
@@ -29,214 +29,118 @@ export default function LandingPage() {
|
||||
headingFontWeight="light"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "Home", id: "hero"},
|
||||
{
|
||||
name: "About", id: "about"},
|
||||
{
|
||||
name: "Services", id: "features"},
|
||||
{
|
||||
name: "Portfolio", id: "portfolio"},
|
||||
{
|
||||
name: "Contact", id: "contact"},
|
||||
]}
|
||||
brandName="紀州童"
|
||||
button={{ text: "Get Quote", href: "#contact" }}
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "Lineup", id: "portfolio" },
|
||||
{ name: "Gifts", id: "gifts" },
|
||||
{ name: "Reviews", id: "testimonials" },
|
||||
{ name: "Company", id: "about" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="紀州童"
|
||||
button={{ text: "Order Now", href: "#contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroCentered
|
||||
background={{
|
||||
variant: "gradient-bars"}}
|
||||
title="紀州童: Crafting Zen Landscapes"
|
||||
description="Exquisite landscape architecture and garden design, rooted in traditional Japanese aesthetics and modern precision."
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/old-women-balcony-with-coffee_1398-4083.jpg", alt: "Happy homeowner garden"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/go-green-responsibility-sustainable-concept_53876-13915.jpg", alt: "Modern luxury home garden"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/happy-middle-aged-best-friends-spending-time-together-city_23-2148979138.jpg", alt: "Backyard oasis happy person"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/happy-friends-having-new-year-party-outdoors_23-2149144045.jpg", alt: "Successful landscape project client"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/expressive-woman-posing-outdoor_344912-3068.jpg", alt: "Expressive woman posing outdoor"},
|
||||
]}
|
||||
buttons={[
|
||||
{
|
||||
text: "View Our Portfolio", href: "#portfolio"},
|
||||
{
|
||||
text: "Inquire Today", href: "#contact"},
|
||||
]}
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text", text: "Traditional Craftsmanship"},
|
||||
{
|
||||
type: "text", text: "Zen Philosophy"},
|
||||
{
|
||||
type: "text", text: "Sustainable Beauty"},
|
||||
{
|
||||
type: "text", text: "Modern Precision"},
|
||||
{
|
||||
type: "text", text: "Nature-Inspired"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroCentered
|
||||
background={{ variant: "gradient-bars" }}
|
||||
title="紀州童: Crafting Zen Landscapes"
|
||||
description="Exquisite landscape architecture and garden design, rooted in traditional Japanese aesthetics and modern precision."
|
||||
avatars={[
|
||||
{ src: "http://img.b2bpic.net/free-photo/old-women-balcony-with-coffee_1398-4083.jpg", alt: "Happy homeowner garden" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/go-green-responsibility-sustainable-concept_53876-13915.jpg", alt: "Modern luxury home garden" },
|
||||
]}
|
||||
buttons={[
|
||||
{ text: "View Lineup", href: "#portfolio" },
|
||||
{ text: "Get Consultation", href: "#contact" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<TestimonialAboutCard
|
||||
useInvertedBackground={true}
|
||||
tag="Our Philosophy"
|
||||
title="Nature as Artistry"
|
||||
description="At 紀州童, we treat every plot of land as a canvas. Our designs balance the enduring beauty of natural landscapes with refined artistic structure."
|
||||
subdescription="We specialize in creating tranquil, sustainable environments that enhance your daily connection to the natural world."
|
||||
icon={Leaf}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/bird-s-eye-view-houses_198169-249.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
imageAlt="Professional landscape designer working"
|
||||
/>
|
||||
</div>
|
||||
<div id="portfolio" data-section="portfolio">
|
||||
<ProductCardThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="one-large-left-three-stacked-right"
|
||||
useInvertedBackground={true}
|
||||
products={[
|
||||
{ id: "p1", name: "Zen Garden Oasis", price: "$2,500", imageSrc: "http://img.b2bpic.net/free-photo/cinematic-style-mall_23-2151551284.jpg" },
|
||||
{ id: "p2", name: "Stone Patio Path", price: "$1,200", imageSrc: "http://img.b2bpic.net/free-photo/sky-old-grass-summer-nobody_1203-5139.jpg" },
|
||||
{ id: "p3", name: "Forest Canopy Setup", price: "$3,800", imageSrc: "http://img.b2bpic.net/free-photo/woman-working-her-flower-shop_53876-56029.jpg" },
|
||||
{ id: "p4", name: "Minimalist Courtyard", price: "$1,900", imageSrc: "http://img.b2bpic.net/free-photo/creative-feng-shui-arrangement_23-2149058743.jpg" },
|
||||
]}
|
||||
title="Premium Product Lineup"
|
||||
description="Explore our carefully curated selection of landscape elements."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureBorderGlow
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
icon: Leaf,
|
||||
title: "Garden Design", description: "Custom blueprints for harmonious garden layouts."},
|
||||
{
|
||||
icon: Waves,
|
||||
title: "Water Features", description: "Tranquil koi ponds and naturalistic stream designs."},
|
||||
{
|
||||
icon: Star,
|
||||
title: "Hardscaping", description: "Stone masonry and expert construction for patios."},
|
||||
{
|
||||
icon: Star,
|
||||
title: "Plant Curation", description: "Sourcing native species for vibrant, healthy growth."},
|
||||
{
|
||||
icon: Moon,
|
||||
title: "Lighting Design", description: "Subtle night-time illumination for garden serenity."},
|
||||
]}
|
||||
title="Service Excellence"
|
||||
description="Comprehensive landscaping services built on professional expertise."
|
||||
/>
|
||||
</div>
|
||||
<div id="gifts" data-section="gifts">
|
||||
<FeatureBorderGlow
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
title="Exclusive Gift Recommendations"
|
||||
description="Thoughtful garden-inspired gifts for special occasions."
|
||||
features={[
|
||||
{ icon: Gift, title: "Bonsai Starter Kit", description: "Begin your journey into traditional pruning." },
|
||||
{ icon: Leaf, title: "Zen Garden Tray", description: "Bring miniature serenity to your office desk." },
|
||||
{ icon: Moon, title: "Stone Lantern Set", description: "Illuminated grace for your evening garden." },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="portfolio" data-section="portfolio">
|
||||
<ProductCardThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={true}
|
||||
products={[
|
||||
{
|
||||
id: "p1", name: "Zen Garden Oasis", price: "Featured", imageSrc: "http://img.b2bpic.net/free-photo/cinematic-style-mall_23-2151551284.jpg"},
|
||||
{
|
||||
id: "p2", name: "Stone Patio Path", price: "Featured", imageSrc: "http://img.b2bpic.net/free-photo/sky-old-grass-summer-nobody_1203-5139.jpg"},
|
||||
{
|
||||
id: "p3", name: "Forest Canopy Setup", price: "Featured", imageSrc: "http://img.b2bpic.net/free-photo/woman-working-her-flower-shop_53876-56029.jpg"},
|
||||
{
|
||||
id: "p4", name: "Minimalist Courtyard", price: "Featured", imageSrc: "http://img.b2bpic.net/free-photo/creative-feng-shui-arrangement_23-2149058743.jpg"},
|
||||
{
|
||||
id: "p5", name: "Contemporary Hedge", price: "Featured", imageSrc: "http://img.b2bpic.net/free-photo/close-up-old-wooden-pots-with-plants-wooden-steps_169016-10589.jpg"},
|
||||
{
|
||||
id: "p6", name: "Traditional Bonsai Walk", price: "Featured", imageSrc: "http://img.b2bpic.net/free-photo/side-view-woman-holding-flower-pot_23-2148271020.jpg"},
|
||||
]}
|
||||
title="Selected Works"
|
||||
description="A showcase of our recent garden transformations."
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardThirteen
|
||||
showRating={true}
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
title="Customer Reviews"
|
||||
description="Honest feedback from those who have transformed their homes."
|
||||
testimonials={[
|
||||
{ id: "1", name: "Yuki Tanaka", handle: "@yuki", testimonial: "A truly transformative garden experience.", rating: 5 },
|
||||
{ id: "2", name: "Kenji Sato", handle: "@kenjisato", testimonial: "Precision and art in every stone placed.", rating: 5 },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardSix
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1", name: "Yuki Tanaka", handle: "@yuki", testimonial: "A truly transformative garden experience.", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-farmer-woman-checking-strawberry-farm_1150-6764.jpg"},
|
||||
{
|
||||
id: "2", name: "Kenji Sato", handle: "@kenjisato", testimonial: "Precision and art in every stone placed.", imageSrc: "http://img.b2bpic.net/free-photo/outdoor-portrait-stylish-european-woman-pink-fashion-suit-outside-villa_343596-2164.jpg"},
|
||||
{
|
||||
id: "3", name: "Hana Mori", handle: "@hanam", testimonial: "My backyard is now my sanctuary.", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-adult-woman-drawing-summer-field_1157-23549.jpg"},
|
||||
{
|
||||
id: "4", name: "Hiroshi Ito", handle: "@hiroshi", testimonial: "Incredible attention to natural detail.", imageSrc: "http://img.b2bpic.net/free-photo/young-beautiful-florist-taking-care-flowers_176420-2076.jpg"},
|
||||
{
|
||||
id: "5", name: "Aoi Nakamura", handle: "@aoi", testimonial: "The best decision for our home estate.", imageSrc: "http://img.b2bpic.net/free-photo/green-plants-blackboard-layout_23-2148029164.jpg"},
|
||||
]}
|
||||
title="Client Reflections"
|
||||
description="What our clients share about their experiences."
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<TestimonialAboutCard
|
||||
tag="About Us"
|
||||
title="Company Information"
|
||||
description="紀州童 has spent two decades mastering the delicate balance between nature and design. We are dedicated to quality, sustainability, and the client's peace of mind."
|
||||
subdescription="Based in the heart of the region, we serve clients who appreciate traditional values combined with contemporary service standards."
|
||||
icon={Users}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/bird-s-eye-view-houses_198169-249.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={true}
|
||||
metrics={[
|
||||
{
|
||||
id: "m1", value: "150+", description: "Gardens Transformed"},
|
||||
{
|
||||
id: "m2", value: "20", description: "Years of Tradition"},
|
||||
{
|
||||
id: "m3", value: "100%", description: "Satisfaction Rate"},
|
||||
]}
|
||||
title="Our Impact"
|
||||
description="Reflecting on our history of landscaping excellence."
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCTA
|
||||
useInvertedBackground={true}
|
||||
background={{ variant: "radial-gradient" }}
|
||||
tag="Inquire Now"
|
||||
title="Ready for a Garden Makeover?"
|
||||
description="Use our order system to request a site survey or place a product order. We are just a message away."
|
||||
buttons={[
|
||||
{ text: "Request Site Survey", href: "#contact" },
|
||||
{ text: "Place Order", href: "#contact" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqDouble
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "f1", title: "How long does a design take?", content: "Depending on complexity, designs typically span 2-4 weeks."},
|
||||
{
|
||||
id: "f2", title: "Do you provide maintenance?", content: "Yes, we offer ongoing seasonal landscape management."},
|
||||
{
|
||||
id: "f3", title: "Can you work with stone?", content: "Stone masonry is a core element of our landscaping style."},
|
||||
]}
|
||||
title="Common Inquiries"
|
||||
description="Learn more about our design process."
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCTA
|
||||
useInvertedBackground={true}
|
||||
background={{
|
||||
variant: "radial-gradient"}}
|
||||
tag="Let's Connect"
|
||||
title="Begin Your Landscape Journey"
|
||||
description="Reach out today for a personalized consultation on your garden vision."
|
||||
buttons={[
|
||||
{
|
||||
text: "Contact Us", href: "mailto:hello@kishudo.com"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterCard
|
||||
logoText="紀州童"
|
||||
socialLinks={[
|
||||
{
|
||||
icon: Instagram,
|
||||
href: "https://instagram.com", ariaLabel: "Instagram"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterCard
|
||||
logoText="紀州童"
|
||||
socialLinks={[
|
||||
{ icon: Instagram, href: "https://instagram.com", ariaLabel: "Instagram" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
@@ -10,15 +10,15 @@
|
||||
--accent: #ffffff;
|
||||
--background-accent: #ffffff; */
|
||||
|
||||
--background: #fffefe;
|
||||
--card: #f6f7f4;
|
||||
--foreground: #080908;
|
||||
--primary-cta: #0e3a29;
|
||||
--background: #ffffff;
|
||||
--card: #f9f6f2;
|
||||
--foreground: #1a1a1a;
|
||||
--primary-cta: #8b0000;
|
||||
--primary-cta-text: #fffefe;
|
||||
--secondary-cta: #e7eecd;
|
||||
--secondary-cta: #e6e2da;
|
||||
--secondary-cta-text: #080908;
|
||||
--accent: #35c18b;
|
||||
--background-accent: #ecebe4;
|
||||
--accent: #8b0000;
|
||||
--background-accent: #f9f6f2;
|
||||
|
||||
/* text sizing - set by ThemeProvider */
|
||||
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);
|
||||
|
||||
Reference in New Issue
Block a user