Merge version_2 into main #2
138
src/app/page.tsx
138
src/app/page.tsx
@@ -5,7 +5,7 @@ import ReactLenis from "lenis/react";
|
||||
import ContactSplit from '@/components/sections/contact/ContactSplit';
|
||||
import FaqDouble from '@/components/sections/faq/FaqDouble';
|
||||
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
|
||||
import HeroSplitDualMedia from '@/components/sections/hero/HeroSplitDualMedia';
|
||||
import HeroBillboard from '@/components/sections/hero/HeroBillboard';
|
||||
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
|
||||
import ProductCardThree from '@/components/sections/product/ProductCardThree';
|
||||
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
|
||||
@@ -20,56 +20,41 @@ export default function LandingPage() {
|
||||
borderRadius="rounded"
|
||||
contentWidth="compact"
|
||||
sizing="largeSmallSizeMediumTitles"
|
||||
background="floatingGradient"
|
||||
cardStyle="layered-gradient"
|
||||
primaryButtonStyle="radial-glow"
|
||||
secondaryButtonStyle="layered"
|
||||
headingFontWeight="semibold"
|
||||
background="noise"
|
||||
cardStyle="glass-depth"
|
||||
primaryButtonStyle="diagonal-gradient"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="bold"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "Home", id: "hero"},
|
||||
{
|
||||
name: "Work", id: "portfolio"},
|
||||
{
|
||||
name: "Book", id: "contact"},
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "Work", id: "portfolio" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="CRUZ TATTOO"
|
||||
button={{
|
||||
text: "Book Now", href: "#contact"}}
|
||||
button={{ text: "Book Now", href: "#contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitDualMedia
|
||||
background={{
|
||||
variant: "radial-gradient"}}
|
||||
title="Ink Your Story with Precision"
|
||||
description="Custom Tattoos | Professional Artists | Hygienic Studio. Where Art Meets Skin."
|
||||
<HeroBillboard
|
||||
background={{ variant: "radial-gradient" }}
|
||||
title="Legacy Ink. Bold Artistry."
|
||||
description="Professional tattoo artistry in a premium, hygienic environment. Where vision meets skin."
|
||||
tag="PREMIUM TATTOO STUDIO"
|
||||
buttons={[
|
||||
{
|
||||
text: "Book Appointment", href: "#contact"},
|
||||
]}
|
||||
mediaItems={[
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-woman-developing-photos_23-2149893950.jpg", imageAlt: "Tattoo Artwork"},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/process-creating-new-tattoo-young-woman-by-expirienced-tattoo-artist-studio_613910-17260.jpg", imageAlt: "Studio Interior"}
|
||||
]}
|
||||
mediaAnimation="slide-up"
|
||||
rating={5}
|
||||
ratingText="Rated 5/5 by over 500+ satisfied clients"
|
||||
buttons={[{ text: "View Portfolio", href: "#portfolio" }, { text: "Book Session", href: "#contact" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/process-creating-new-tattoo-young-woman-by-expirienced-tattoo-artist-studio_613910-17260.jpg"
|
||||
imageAlt="Professional tattoo process"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<TextAbout
|
||||
useInvertedBackground={true}
|
||||
title="Crafted Ink. Timeless Identity."
|
||||
title="Redefining the Tattoo Experience. Committed to Quality, Artistry, and You."
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -77,24 +62,16 @@ export default function LandingPage() {
|
||||
<ProductCardThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
gridVariant="asymmetric-60-wide-40-narrow"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "1", name: "Black & Grey", price: "Featured", imageSrc: "http://img.b2bpic.net/free-photo/tattoo-salon-process-tattoo-girl-stuffed-tattoo-process-stuffing-tattoo-body-hands-close-up_1321-3001.jpg"},
|
||||
{
|
||||
id: "2", name: "Custom Color", price: "Featured", imageSrc: "http://img.b2bpic.net/free-photo/watercolor-seahorse-animal_23-2151528966.jpg"},
|
||||
{
|
||||
id: "3", name: "Minimalist Art", price: "Featured", imageSrc: "http://img.b2bpic.net/free-photo/close-up-woman-s-chest-with-mehndi-tattoo-ramadan-day_23-2148083026.jpg"},
|
||||
{
|
||||
id: "4", name: "Traditional", price: "Featured", imageSrc: "http://img.b2bpic.net/free-photo/high-angle-hands-touching-ouija-board-cup_23-2149413267.jpg"},
|
||||
{
|
||||
id: "5", name: "Portraiture", price: "Featured", imageSrc: "http://img.b2bpic.net/free-photo/psychedelic-girl-illustration_23-2151508431.jpg"},
|
||||
{
|
||||
id: "6", name: "Geometry", price: "Featured", imageSrc: "http://img.b2bpic.net/free-vector/happy-diwali-text-design-abstract-vector-illustration_460848-18562.jpg"},
|
||||
{ id: "1", name: "Black & Grey", price: "Custom", imageSrc: "http://img.b2bpic.net/free-photo/tattoo-salon-process-tattoo-girl-stuffed-tattoo-process-stuffing-tattoo-body-hands-close-up_1321-3001.jpg" },
|
||||
{ id: "2", name: "Custom Color", price: "Custom", imageSrc: "http://img.b2bpic.net/free-photo/watercolor-seahorse-animal_23-2151528966.jpg" },
|
||||
{ id: "3", name: "Minimalist Art", price: "Custom", imageSrc: "http://img.b2bpic.net/free-photo/close-up-woman-s-chest-with-mehndi-tattoo-ramadan-day_23-2148083026.jpg" },
|
||||
{ id: "4", name: "Portraiture", price: "Custom", imageSrc: "http://img.b2bpic.net/free-photo/psychedelic-girl-illustration_23-2151508431.jpg" },
|
||||
]}
|
||||
title="Recent Work"
|
||||
description="A curated collection of our finest ink work, showcasing precision, artistry, and unique design."
|
||||
title="Featured Gallery"
|
||||
description="Our latest work blending tradition with innovation."
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -104,32 +81,16 @@ export default function LandingPage() {
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1", name: "Sarah Miller", role: "Collector", company: "Artist", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/bearded-stylish-man-sitting-cafe_273609-4483.jpg"},
|
||||
{
|
||||
id: "2", name: "Mark D.", role: "Client", company: "Local", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/closeup-shot-goodlooking-stylish-relaxed-blond-woman-with-tattoos-arms-holding-hands_1258-229793.jpg"},
|
||||
{
|
||||
id: "3", name: "Alex R.", role: "Collector", company: "Design", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/fashion-woman-casual-hipster-summer-clothes_158538-2095.jpg"},
|
||||
{
|
||||
id: "4", name: "Emily S.", role: "Client", company: "Creative", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/side-view-happy-people-love_52683-92756.jpg"},
|
||||
{
|
||||
id: "5", name: "James L.", role: "Collector", company: "Art", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-with-colorful-tattoos-resting-white-sheet-garden_1321-972.jpg"},
|
||||
{ id: "1", name: "Sarah M.", role: "Collector", company: "Art Enthusiast", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/bearded-stylish-man-sitting-cafe_273609-4483.jpg" },
|
||||
{ id: "2", name: "Mark D.", role: "Collector", company: "Local Client", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/closeup-shot-goodlooking-stylish-relaxed-blond-woman-with-tattoos-arms-holding-hands_1258-229793.jpg" },
|
||||
]}
|
||||
kpiItems={[
|
||||
{
|
||||
value: "10+", label: "Years Experience"},
|
||||
{
|
||||
value: "5000+", label: "Tattoos Done"},
|
||||
{
|
||||
value: "100%", label: "Sterilization"},
|
||||
{ value: "12+", label: "Years of Art" },
|
||||
{ value: "6000+", label: "Tattoos Applied" },
|
||||
{ value: "100%", label: "Sterility Guaranteed" },
|
||||
]}
|
||||
title="What Our Clients Say"
|
||||
description="Excellence in every stroke."
|
||||
title="What Clients Say"
|
||||
description="Experience the pinnacle of tattoo artistry."
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -138,15 +99,12 @@ export default function LandingPage() {
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "1", title: "How do I book?", content: "Visit our contact section and fill the form."},
|
||||
{
|
||||
id: "2", title: "Is it hygienic?", content: "We maintain 100% medical-grade sterilization."},
|
||||
{
|
||||
id: "3", title: "Custom designs?", content: "Our artists specialize in original, custom work."},
|
||||
{ id: "1", title: "How do I start?", content: "Fill out our booking form and we'll reach out to discuss your design." },
|
||||
{ id: "2", title: "Sterilization?", content: "We follow strict medical-grade sanitation protocols for every session." },
|
||||
{ id: "3", title: "Do you do cover-ups?", content: "Yes, our artists are experts in restorative and cover-up tattoos." },
|
||||
]}
|
||||
title="Frequently Asked"
|
||||
description="Common questions about your session."
|
||||
title="Frequently Asked Questions"
|
||||
description="Everything you need to know about your next ink session."
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
@@ -155,21 +113,19 @@ export default function LandingPage() {
|
||||
<SocialProofOne
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
names={[
|
||||
"@cruz.tattoostudio", "@cruz.tattoostudio", "@cruz.tattoostudio", "@cruz.tattoostudio", "@cruz.tattoostudio"]}
|
||||
title="Follow Our Work"
|
||||
description="Daily inspiration from our artists."
|
||||
names={["@cruz.tattoostudio", "@cruz.tattoostudio", "@cruz.tattoostudio", "@cruz.tattoostudio"]}
|
||||
title="Follow Our Daily Art"
|
||||
description="Stay updated with our latest tattoo projects."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplit
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "plain"}}
|
||||
tag="GET IN TOUCH"
|
||||
title="Book Your Appointment"
|
||||
description="Ready to get inked? Fill in your details below and we will contact you."
|
||||
background={{ variant: "plain" }}
|
||||
tag="RESERVE YOUR SPOT"
|
||||
title="Start Your Journey"
|
||||
description="Professional consultation is the first step to your perfect tattoo."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/craft-beer-concept-with-hipster-couple_23-2148110939.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
@@ -178,10 +134,8 @@ export default function LandingPage() {
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoReveal
|
||||
logoText="CRUZ TATTOO"
|
||||
leftLink={{
|
||||
text: "Privacy Policy", href: "#"}}
|
||||
rightLink={{
|
||||
text: "Instagram", href: "https://www.instagram.com/cruz.tattoostudio/"}}
|
||||
leftLink={{ text: "Privacy Policy", href: "#" }}
|
||||
rightLink={{ text: "Instagram", href: "https://www.instagram.com/cruz.tattoostudio/" }}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
|
||||
Reference in New Issue
Block a user