Merge version_3 into main #2
172
src/app/page.tsx
172
src/app/page.tsx
@@ -16,27 +16,23 @@ export default function LandingPage() {
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="hover-bubble"
|
||||
defaultTextAnimation="background-highlight"
|
||||
borderRadius="rounded"
|
||||
contentWidth="small"
|
||||
sizing="large"
|
||||
background="circleGradient"
|
||||
cardStyle="gradient-bordered"
|
||||
primaryButtonStyle="radial-glow"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="medium"
|
||||
borderRadius="pill"
|
||||
contentWidth="medium"
|
||||
sizing="medium"
|
||||
background="noise"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="flat"
|
||||
secondaryButtonStyle="solid"
|
||||
headingFontWeight="semibold"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleCentered
|
||||
navItems={[
|
||||
{
|
||||
name: "Home", id: "#hero"},
|
||||
{
|
||||
name: "Experience", id: "#experience"},
|
||||
{
|
||||
name: "Events", id: "#events"},
|
||||
{
|
||||
name: "Visit", id: "#contact"},
|
||||
{ name: "Home", id: "#hero" },
|
||||
{ name: "Experience", id: "#experience" },
|
||||
{ name: "Products", id: "#events" },
|
||||
{ name: "Visit", id: "#contact" },
|
||||
]}
|
||||
brandName="The Ranch"
|
||||
/>
|
||||
@@ -44,59 +40,41 @@ export default function LandingPage() {
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboard
|
||||
background={{
|
||||
variant: "gradient-bars"}}
|
||||
title="Authentic Ranch Life in Dairy Flat"
|
||||
description="Discover our working ranch, home to happy cows, artisan dairy, and the best rustic hospitality in New Zealand."
|
||||
buttons={[
|
||||
{
|
||||
text: "Plan Your Visit", href: "#contact"},
|
||||
{
|
||||
text: "See What’s On", href: "#events"},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/cow-grass-pasture_23-2148154675.jpg"
|
||||
imageAlt="Happy cows grazing at The Ranch in Dairy Flat"
|
||||
mediaAnimation="blur-reveal"
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text", text: "Artisan Dairy"},
|
||||
{
|
||||
type: "text", text: "Pasture-Raised"},
|
||||
{
|
||||
type: "text", text: "Dairy Flat Origin"},
|
||||
{
|
||||
type: "text", text: "Rustic Elegance"},
|
||||
]}
|
||||
background={{ variant: "plain" }}
|
||||
title="Freshness from Dairy Flat"
|
||||
description="Experience the tranquil beauty of The Ranch, where our happy cows and premium dairy products create a taste of pure New Zealand countryside."
|
||||
buttons={[{ text: "Discover Our Farm", href: "#experience" }]}
|
||||
imageSrc="https://img.b2bpic.net/free-photo/cows-grazing-green-field_23-2148154675.jpg"
|
||||
imageAlt="Happy cows at The Ranch"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="experience" data-section="experience">
|
||||
<FeatureCardOne
|
||||
animationType="slide-up"
|
||||
animationType="blur-reveal"
|
||||
textboxLayout="split"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
title="The Farm Experience"
|
||||
description="A modern take on traditional farming. Connect with nature and see how we craft our fresh daily products."
|
||||
features={[
|
||||
{
|
||||
title: "Artisan Dairy Lab", description: "Experience how our fresh, pasture-raised milk is transformed into gourmet local dairy products.", imageSrc: "http://img.b2bpic.net/free-photo/fresh-milk-glass-bottles-wooden-table_144627-14220.jpg", imageAlt: "Artisan dairy products"},
|
||||
title: "Happy Herd", description: "Our cows roam free in lush green pastures.", imageSrc: "https://img.b2bpic.net/free-photo/cow-grazing-meadow_1150-17865.jpg"
|
||||
},
|
||||
{
|
||||
title: "Meet the Herd", description: "Walk the paddocks and meet the friendly cows behind our signature dairy collection.", imageSrc: "http://img.b2bpic.net/free-photo/cows-field_1150-17865.jpg", imageAlt: "Cows in pasture"},
|
||||
title: "Artisan Dairy", description: "Fresh, high-quality products made daily on-site.", imageSrc: "https://img.b2bpic.net/free-photo/fresh-milk-bottles_144627-14220.jpg"
|
||||
},
|
||||
{
|
||||
title: "Farm-to-Table Dining", description: "Enjoy breakfast and lunch crafted with the freshest dairy sourced right from our farm.", imageSrc: "http://img.b2bpic.net/free-photo/healthy-breakfast-table-setting_144627-24838.jpg", imageAlt: "Fresh dairy farm-to-table breakfast"},
|
||||
title: "Rural Connection", description: "Learn about sustainable farming practices in Dairy Flat.", imageSrc: "https://img.b2bpic.net/free-photo/farm-landscape-green_1150-17866.jpg"
|
||||
}
|
||||
]}
|
||||
title="Where Nature Meets Craft"
|
||||
description="Discover the rhythm of the countryside, where passion for dairy meets true rural hospitality."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="host" data-section="host">
|
||||
<TextAbout
|
||||
useInvertedBackground={false}
|
||||
title="Come as a guest, leave feeling like you belong at our ranch."
|
||||
buttons={[
|
||||
{
|
||||
text: "Meet the Team", href: "#"},
|
||||
]}
|
||||
useInvertedBackground={true}
|
||||
title="Dedicated to creating fresh, airy, and premium dairy experiences for all our visitors."
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -104,20 +82,15 @@ export default function LandingPage() {
|
||||
<ProductCardFour
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
gridVariant="one-large-left-three-stacked-right"
|
||||
useInvertedBackground={false}
|
||||
title="Fresh From The Ranch"
|
||||
description="Browse our collection of premium dairy delights."
|
||||
products={[
|
||||
{
|
||||
id: "1", name: "Dairy Farm Tour", price: "Daily", variant: "Experience", imageSrc: "http://img.b2bpic.net/free-photo/farmer-working-farm_1150-17863.jpg"},
|
||||
{
|
||||
id: "2", name: "Cheese Tasting", price: "Friday", variant: "Gathering", imageSrc: "http://img.b2bpic.net/free-photo/cheese-platter-wooden-board_1150-17864.jpg"},
|
||||
{
|
||||
id: "3", name: "Morning Milking", price: "Saturday", variant: "Education", imageSrc: "http://img.b2bpic.net/free-photo/cow-close-up-field_1150-17866.jpg"},
|
||||
{
|
||||
id: "4", name: "Sunset Meadow Dinner", price: "Nightly", variant: "Dining", imageSrc: "http://img.b2bpic.net/free-photo/sunset-pasture-landscape_1150-17867.jpg"},
|
||||
{ id: "1", name: "Creamy Milk", price: "$5", variant: "Original", imageSrc: "https://img.b2bpic.net/free-photo/glass-milk_144627-24838.jpg" },
|
||||
{ id: "2", name: "Farm Butter", price: "$8", variant: "Salted", imageSrc: "https://img.b2bpic.net/free-photo/butter-block_1150-17864.jpg" },
|
||||
{ id: "3", name: "Fresh Yogurt", price: "$6", variant: "Natural", imageSrc: "https://img.b2bpic.net/free-photo/yogurt-jar_1150-17867.jpg" },
|
||||
]}
|
||||
title="Always Something Happening."
|
||||
description="From educational tours to sunset dinners, every event at the ranch highlights our love for dairy and land."
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -125,85 +98,40 @@ export default function LandingPage() {
|
||||
<TestimonialCardThirteen
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1", name: "Sarah J.", handle: "@dairylover", testimonial: "The freshest milk I have ever tasted!", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/smiling-woman-farm_1150-17868.jpg"},
|
||||
{
|
||||
id: "2", name: "Mike D.", handle: "@ranchvisitor", testimonial: "A truly authentic dairy farm experience.", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-field_1150-17869.jpg"},
|
||||
]}
|
||||
useInvertedBackground={true}
|
||||
showRating={true}
|
||||
title="What Guests Are Saying"
|
||||
description="Hear from our community about why The Ranch is their favorite countryside escape."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="gallery" data-section="gallery">
|
||||
<FeatureCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="inline-image"
|
||||
gridVariant="four-items-2x2-equal-grid"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "Grass-Fed Cows", description: "Our herd roaming freely.", imageSrc: "http://img.b2bpic.net/free-photo/cows-grazing_1150-17870.jpg"},
|
||||
{
|
||||
title: "Artisan Dairy", description: "Handcrafted with passion.", imageSrc: "http://img.b2bpic.net/free-photo/dairy-products-display_1150-17871.jpg"},
|
||||
{
|
||||
title: "Rural Scenery", description: "Dairy Flat beauty.", imageSrc: "http://img.b2bpic.net/free-photo/ranch-landscape_1150-17872.jpg"},
|
||||
{
|
||||
title: "Farm Living", description: "A taste of the ranch.", imageSrc: "http://img.b2bpic.net/free-photo/farmer-feeding-cows_1150-17873.jpg"},
|
||||
title="Community Love"
|
||||
description="What our visitors say about their time at The Ranch."
|
||||
testimonials={[
|
||||
{ id: "1", name: "Emma W.", handle: "@dairyflat_local", testimonial: "The freshest milk and such a beautiful, relaxing farm!", rating: 5, imageSrc: "https://img.b2bpic.net/free-photo/woman-in-meadow_1150-17868.jpg" },
|
||||
]}
|
||||
title="Moments at The Ranch"
|
||||
description="A glimpse of dairy life in Dairy Flat."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="location" data-section="location">
|
||||
<TextAbout
|
||||
useInvertedBackground={false}
|
||||
title="Hidden in Dairy Flat, New Zealand"
|
||||
buttons={[
|
||||
{
|
||||
text: "Get Directions", href: "#"},
|
||||
]}
|
||||
title="Visit us in the heart of Dairy Flat, New Zealand."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCenter
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "radial-gradient"}}
|
||||
tag="Escape"
|
||||
title="Ready for Your Next Dairy Flat Escape?"
|
||||
description="Plan your visit and join us for a genuine ranch experience."
|
||||
tag="Contact Us"
|
||||
title="Start your ranch journey today."
|
||||
description="Send us an inquiry or sign up for updates on our seasonal events."
|
||||
background={{ variant: "plain" }}
|
||||
useInvertedBackground={true}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterSimple
|
||||
columns={[
|
||||
{
|
||||
title: "The Ranch", items: [
|
||||
{
|
||||
label: "About Us", href: "#about"},
|
||||
{
|
||||
label: "Events", href: "#events"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Support", items: [
|
||||
{
|
||||
label: "Directions", href: "#location"},
|
||||
{
|
||||
label: "Contact", href: "#contact"},
|
||||
],
|
||||
},
|
||||
{ title: "The Ranch", items: [{ label: "Home" }, { label: "Events" }] },
|
||||
{ title: "Connect", items: [{ label: "Contact" }] },
|
||||
]}
|
||||
bottomLeftText="The Ranch — Authentic Dairy Flat Living."
|
||||
bottomLeftText="The Ranch, Dairy Flat."
|
||||
bottomRightText="© 2024 The Ranch NZ"
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -10,15 +10,15 @@
|
||||
--accent: #ffffff;
|
||||
--background-accent: #ffffff; */
|
||||
|
||||
--background: #fbfbf8;
|
||||
--card: #f0ede8;
|
||||
--foreground: #3d352a;
|
||||
--primary-cta: #7a5c3d;
|
||||
--background: #ffffff;
|
||||
--card: #f8faf9;
|
||||
--foreground: #2d3436;
|
||||
--primary-cta: #4b7f52;
|
||||
--primary-cta-text: #0a0a0a;
|
||||
--secondary-cta: #f0ede8;
|
||||
--secondary-cta: #d1e8d4;
|
||||
--secondary-cta-text: #fdfbf7;
|
||||
--accent: #dccfc2;
|
||||
--background-accent: #e8e0d5;
|
||||
--accent: #a1c9e8;
|
||||
--background-accent: #f0f4f0;
|
||||
|
||||
/* text sizing - set by ThemeProvider */
|
||||
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);
|
||||
|
||||
Reference in New Issue
Block a user