Merge version_2 into main #2

Merged
bender merged 3 commits from version_2 into main 2026-04-10 01:51:50 +00:00
3 changed files with 71 additions and 193 deletions

View File

@@ -2,9 +2,9 @@
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactSplit from '@/components/sections/contact/ContactSplit';
import ContactText from '@/components/sections/contact/ContactText';
import FeatureHoverPattern from '@/components/sections/feature/featureHoverPattern/FeatureHoverPattern';
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
import FooterSimple from '@/components/sections/footer/FooterSimple';
import HeroOverlayTestimonial from '@/components/sections/hero/HeroOverlayTestimonial';
import MediaAbout from '@/components/sections/about/MediaAbout';
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
@@ -31,25 +31,15 @@ export default function LandingPage() {
<NavbarStyleFullscreen
navItems={[
{
name: "Home",
id: "hero",
},
name: "Home", id: "hero"},
{
name: "About",
id: "about",
},
name: "About", id: "about"},
{
name: "Collection",
id: "products",
},
name: "Collection", id: "products"},
{
name: "Testimonials",
id: "testimonials",
},
name: "Testimonials", id: "testimonials"},
{
name: "Contact",
id: "contact",
},
name: "Contact", id: "contact"},
]}
brandName="Viora Bracelet"
/>
@@ -61,78 +51,39 @@ export default function LandingPage() {
description="Dibuat dari batok kelapa alami, Viora Bracelet menggabungkan keindahan estetik dengan semangat keberlanjutan."
testimonials={[
{
name: "Siti Aminah",
handle: "@siti_am",
testimonial: "Bagus banget, sesuai request!",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/white-wedding-arrangement-with-copy-space_23-2148243968.jpg?_wi=1",
imageAlt: "minimalist eco friendly jewelry background",
},
name: "Siti Aminah", handle: "@siti_am", testimonial: "Bagus banget, sesuai request!", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/white-wedding-arrangement-with-copy-space_23-2148243968.jpg?_wi=1", imageAlt: "minimalist eco friendly jewelry background"},
{
name: "Budi Santoso",
handle: "@budi_s",
testimonial: "Keren dipakai, pasti beli lagi",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/top-view-soil-plants_23-2148928441.jpg?_wi=1",
imageAlt: "natural coconut shell material macro",
},
name: "Budi Santoso", handle: "@budi_s", testimonial: "Keren dipakai, pasti beli lagi", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/top-view-soil-plants_23-2148928441.jpg?_wi=1", imageAlt: "natural coconut shell material macro"},
{
name: "Dewi Lestari",
handle: "@dewi_l",
testimonial: "Kualitas bahan bagus & awet",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/stylish-woman-summer-dress-vacation-beach-colorful-yellow-sunglasess-smiling-happy_285396-6631.jpg?_wi=1",
imageAlt: "natural coconut shell bracelet",
},
name: "Dewi Lestari", handle: "@dewi_l", testimonial: "Kualitas bahan bagus & awet", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/stylish-woman-summer-dress-vacation-beach-colorful-yellow-sunglasess-smiling-happy_285396-6631.jpg?_wi=1", imageAlt: "natural coconut shell bracelet"},
{
name: "Andi Wijaya",
handle: "@andi_w",
testimonial: "Sangat unik dan ramah lingkungan!",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/top-view-yummy-chocolate-cakes-with-coconut-light-white-surface_140725-115543.jpg?_wi=1",
imageAlt: "sustainable wood bracelet",
},
name: "Andi Wijaya", handle: "@andi_w", testimonial: "Sangat unik dan ramah lingkungan!", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/top-view-yummy-chocolate-cakes-with-coconut-light-white-surface_140725-115543.jpg?_wi=1", imageAlt: "sustainable wood bracelet"},
{
name: "Putri Ayu",
handle: "@putri_a",
testimonial: "Suka banget sama modelnya!",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/close-up-person-s-holding-beads-button-with-tweezers_23-2147899011.jpg?_wi=1",
imageAlt: "eco friendly beaded bracelet",
},
name: "Putri Ayu", handle: "@putri_a", testimonial: "Suka banget sama modelnya!", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/close-up-person-s-holding-beads-button-with-tweezers_23-2147899011.jpg?_wi=1", imageAlt: "eco friendly beaded bracelet"},
]}
buttons={[
{
text: "Beli Sekarang",
href: "#products",
},
text: "Beli Sekarang", href: "#products"},
{
text: "Lihat Koleksi",
href: "#products",
},
text: "Lihat Koleksi", href: "#products"},
]}
imageSrc="http://img.b2bpic.net/free-photo/white-wedding-arrangement-with-copy-space_23-2148243968.jpg?_wi=2"
avatars={[
{
src: "http://img.b2bpic.net/free-photo/make-up-artist-making-client-laugh_23-2148398584.jpg",
alt: "Customer 1",
},
src: "http://img.b2bpic.net/free-photo/make-up-artist-making-client-laugh_23-2148398584.jpg", alt: "Customer 1"},
{
src: "http://img.b2bpic.net/free-photo/pleasant-looking-afro-american-female-with-broad-smile-holds-mug-coffee-tea-enjoys-break-after-hard-working-day_273609-3085.jpg",
alt: "Customer 2",
},
src: "http://img.b2bpic.net/free-photo/pleasant-looking-afro-american-female-with-broad-smile-holds-mug-coffee-tea-enjoys-break-after-hard-working-day_273609-3085.jpg", alt: "Customer 2"},
{
src: "http://img.b2bpic.net/free-photo/people-beauty-ethnicity-facial-expressions-concept-attractive-african-american-female-model-rests-coffee-shop-with-friend-lover_273609-3170.jpg",
alt: "Customer 3",
},
src: "http://img.b2bpic.net/free-photo/people-beauty-ethnicity-facial-expressions-concept-attractive-african-american-female-model-rests-coffee-shop-with-friend-lover_273609-3170.jpg", alt: "Customer 3"},
{
src: "http://img.b2bpic.net/free-photo/portrait-mixed-race-black-woman-park-full-flowers-with-huge-afro-hair-contour-sunlight-watching-aside-cinema-film-colors_633478-451.jpg",
alt: "Customer 4",
},
src: "http://img.b2bpic.net/free-photo/portrait-mixed-race-black-woman-park-full-flowers-with-huge-afro-hair-contour-sunlight-watching-aside-cinema-film-colors_633478-451.jpg", alt: "Customer 4"},
{
src: "http://img.b2bpic.net/free-photo/front-view-eco-friendly-cleaning-products-with-brushes_23-2148818465.jpg",
alt: "Customer 5",
},
src: "http://img.b2bpic.net/free-photo/front-view-eco-friendly-cleaning-products-with-brushes_23-2148818465.jpg", alt: "Customer 5"},
]}
avatarText="Lebih dari 1000+ pelanggan puas dengan produk Viora."
/>
@@ -155,59 +106,23 @@ export default function LandingPage() {
useInvertedBackground={false}
products={[
{
id: "p1",
brand: "Viora",
name: "Coconut Minimalist",
price: "Rp 35.000",
rating: 5,
reviewCount: "24",
imageSrc: "http://img.b2bpic.net/free-photo/stylish-woman-summer-dress-vacation-beach-colorful-yellow-sunglasess-smiling-happy_285396-6631.jpg?_wi=2",
},
id: "p1", brand: "Viora", name: "Coconut Minimalist", price: "Rp 35.000", rating: 5,
reviewCount: "24", imageSrc: "http://img.b2bpic.net/free-photo/stylish-woman-summer-dress-vacation-beach-colorful-yellow-sunglasess-smiling-happy_285396-6631.jpg?_wi=2"},
{
id: "p2",
brand: "Viora",
name: "Eco-Charm Bracelet",
price: "Rp 40.000",
rating: 5,
reviewCount: "18",
imageSrc: "http://img.b2bpic.net/free-photo/top-view-yummy-chocolate-cakes-with-coconut-light-white-surface_140725-115543.jpg?_wi=2",
},
id: "p2", brand: "Viora", name: "Eco-Charm Bracelet", price: "Rp 40.000", rating: 5,
reviewCount: "18", imageSrc: "http://img.b2bpic.net/free-photo/top-view-yummy-chocolate-cakes-with-coconut-light-white-surface_140725-115543.jpg?_wi=2"},
{
id: "p3",
brand: "Viora",
name: "Natural Earth Link",
price: "Rp 38.000",
rating: 4,
reviewCount: "32",
imageSrc: "http://img.b2bpic.net/free-photo/close-up-person-s-holding-beads-button-with-tweezers_23-2147899011.jpg?_wi=2",
},
id: "p3", brand: "Viora", name: "Natural Earth Link", price: "Rp 38.000", rating: 4,
reviewCount: "32", imageSrc: "http://img.b2bpic.net/free-photo/close-up-person-s-holding-beads-button-with-tweezers_23-2147899011.jpg?_wi=2"},
{
id: "p4",
brand: "Viora",
name: "Handmade Shell Cuff",
price: "Rp 45.000",
rating: 5,
reviewCount: "12",
imageSrc: "http://img.b2bpic.net/free-photo/young-stylish-woman-holding-durian-fruit_343596-1645.jpg",
},
id: "p4", brand: "Viora", name: "Handmade Shell Cuff", price: "Rp 45.000", rating: 5,
reviewCount: "12", imageSrc: "http://img.b2bpic.net/free-photo/young-stylish-woman-holding-durian-fruit_343596-1645.jpg"},
{
id: "p5",
brand: "Viora",
name: "Artisan Coconut Cuff",
price: "Rp 50.000",
rating: 5,
reviewCount: "9",
imageSrc: "http://img.b2bpic.net/free-photo/working-with-wood-set-letters-hand-made-things-materials-composition-top-view_1268-17354.jpg",
},
id: "p5", brand: "Viora", name: "Artisan Coconut Cuff", price: "Rp 50.000", rating: 5,
reviewCount: "9", imageSrc: "http://img.b2bpic.net/free-photo/working-with-wood-set-letters-hand-made-things-materials-composition-top-view_1268-17354.jpg"},
{
id: "p6",
brand: "Viora",
name: "Classic Eco Bracelet",
price: "Rp 30.000",
rating: 4,
reviewCount: "45",
imageSrc: "http://img.b2bpic.net/free-photo/stylish-woman-vacation-beachhands-with-colorful-yellow-sunglasess-accessories-jewelry-bag_285396-6637.jpg",
},
id: "p6", brand: "Viora", name: "Classic Eco Bracelet", price: "Rp 30.000", rating: 4,
reviewCount: "45", imageSrc: "http://img.b2bpic.net/free-photo/stylish-woman-vacation-beachhands-with-colorful-yellow-sunglasess-accessories-jewelry-bag_285396-6637.jpg"},
]}
title="Koleksi Kami"
description="Pilihan gelang batok kelapa unik dan handmade untuk tampilan yang natural."
@@ -219,30 +134,15 @@ export default function LandingPage() {
useInvertedBackground={false}
testimonials={[
{
id: "t1",
name: "Siti Aminah",
imageSrc: "http://img.b2bpic.net/free-photo/make-up-artist-making-client-laugh_23-2148398584.jpg",
},
id: "t1", name: "Siti Aminah", imageSrc: "http://img.b2bpic.net/free-photo/make-up-artist-making-client-laugh_23-2148398584.jpg"},
{
id: "t2",
name: "Budi Santoso",
imageSrc: "http://img.b2bpic.net/free-photo/pleasant-looking-afro-american-female-with-broad-smile-holds-mug-coffee-tea-enjoys-break-after-hard-working-day_273609-3085.jpg",
},
id: "t2", name: "Budi Santoso", imageSrc: "http://img.b2bpic.net/free-photo/pleasant-looking-afro-american-female-with-broad-smile-holds-mug-coffee-tea-enjoys-break-after-hard-working-day_273609-3085.jpg"},
{
id: "t3",
name: "Dewi Lestari",
imageSrc: "http://img.b2bpic.net/free-photo/people-beauty-ethnicity-facial-expressions-concept-attractive-african-american-female-model-rests-coffee-shop-with-friend-lover_273609-3170.jpg",
},
id: "t3", name: "Dewi Lestari", imageSrc: "http://img.b2bpic.net/free-photo/people-beauty-ethnicity-facial-expressions-concept-attractive-african-american-female-model-rests-coffee-shop-with-friend-lover_273609-3170.jpg"},
{
id: "t4",
name: "Andi Wijaya",
imageSrc: "http://img.b2bpic.net/free-photo/portrait-mixed-race-black-woman-park-full-flowers-with-huge-afro-hair-contour-sunlight-watching-aside-cinema-film-colors_633478-451.jpg",
},
id: "t4", name: "Andi Wijaya", imageSrc: "http://img.b2bpic.net/free-photo/portrait-mixed-race-black-woman-park-full-flowers-with-huge-afro-hair-contour-sunlight-watching-aside-cinema-film-colors_633478-451.jpg"},
{
id: "t5",
name: "Putri Ayu",
imageSrc: "http://img.b2bpic.net/free-photo/front-view-eco-friendly-cleaning-products-with-brushes_23-2148818465.jpg",
},
id: "t5", name: "Putri Ayu", imageSrc: "http://img.b2bpic.net/free-photo/front-view-eco-friendly-cleaning-products-with-brushes_23-2148818465.jpg"},
]}
cardTitle="Apa Kata Mereka?"
cardTag="Testimoni"
@@ -258,19 +158,13 @@ export default function LandingPage() {
features={[
{
icon: Leaf,
title: "100% Natural",
description: "Dibuat langsung dari bahan batok kelapa alami tanpa bahan kimia.",
},
title: "100% Natural", description: "Dibuat langsung dari bahan batok kelapa alami tanpa bahan kimia."},
{
icon: Heart,
title: "Handmade",
description: "Dikerjakan dengan ketelitian tangan artisan lokal Indonesia.",
},
title: "Handmade", description: "Dikerjakan dengan ketelitian tangan artisan lokal Indonesia."},
{
icon: Diamond,
title: "Desain Unik",
description: "Setiap produk memiliki tekstur batok kelapa yang unik dan asli.",
},
title: "Desain Unik", description: "Setiap produk memiliki tekstur batok kelapa yang unik dan asli."},
]}
title="Mengapa Pilih Viora?"
description="Kualitas yang menyatu dengan nilai keberlanjutan alam."
@@ -278,52 +172,36 @@ export default function LandingPage() {
</div>
<div id="contact" data-section="contact">
<ContactSplit
useInvertedBackground={false}
<ContactText
text="Siap untuk tampil alami dengan Viora? Hubungi kami sekarang!"
background={{
variant: "plain",
variant: "gradient-bars"
}}
tag="Contact Us"
title="Jadi bagian dari perubahan 🌿"
description="Hubungi kami melalui WhatsApp atau Instagram untuk pemesanan khusus atau pertanyaan produk."
imageSrc="http://img.b2bpic.net/free-photo/flat-lay-composition-flowers-with-copyspace_23-2148134775.jpg"
buttonText="Kirim via WhatsApp"
onSubmit={(email) => console.log(email)}
buttons={[
{ text: "Hubungi Kami", href: "https://wa.me/" }
]}
useInvertedBackground={true}
/>
</div>
<div id="footer" data-section="footer">
<FooterBaseCard
logoText="Viora Bracelet"
<FooterSimple
columns={[
{
title: "Produk",
items: [
{
label: "Katalog",
href: "#products",
},
{
label: "Tentang",
href: "#about",
},
],
title: "Produk", items: [
{ label: "Katalog", href: "#products" },
{ label: "Tentang Kami", href: "#about" },
]
},
{
title: "Kontak",
items: [
{
label: "WhatsApp",
href: "https://wa.me/",
},
{
label: "Instagram",
href: "https://instagram.com/viora.bracelet",
},
],
},
title: "Kontak", items: [
{ label: "WhatsApp", href: "https://wa.me/" },
{ label: "Instagram", href: "https://instagram.com/viora.bracelet" },
]
}
]}
copyrightText="© 2026 Viora Bracelet. All rights reserved."
bottomLeftText="Viora Bracelet"
bottomRightText="© 2026"
/>
</div>
</ReactLenis>

View File

@@ -11,7 +11,7 @@ html {
body {
background-color: var(--background);
color: var(--foreground);
font-family: var(--font-dm-sans), sans-serif;
font-family: var(--font-inter), sans-serif;
position: relative;
min-height: 100vh;
overscroll-behavior: none;

View File

@@ -10,15 +10,15 @@
--accent: #ffffff;
--background-accent: #ffffff; */
--background: #fffefe;
--card: #f6f7f4;
--foreground: #080908;
--primary-cta: #0e3a29;
--background: #fbfbfb;
--card: #ffffff;
--foreground: #1a1a1a;
--primary-cta: #15479c;
--primary-cta-text: #fffefe;
--secondary-cta: #e7eecd;
--secondary-cta: #ffffff;
--secondary-cta-text: #080908;
--accent: #35c18b;
--background-accent: #ecebe4;
--accent: #e0e7ff;
--background-accent: #c7d2fe;
/* text sizing - set by ThemeProvider */
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);