Compare commits
56 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| a34779b1e4 | |||
| 86a6580f98 | |||
| b28d95a0c8 | |||
| abf6b77e2b | |||
| 32ef242dad | |||
| 6f895dde7e | |||
| ed6bdc86c3 | |||
| 0a260f7ab6 | |||
| 2c91ccdbbb | |||
| 912cd30097 | |||
| f388c96554 | |||
| b8fac0dabd | |||
| 87eb233c1a | |||
| 061eb5388b | |||
| dd5450fcc4 | |||
| 006ae4c0cb | |||
| ec4bd4997f | |||
| 4b23d62f73 | |||
| d1002474f3 | |||
| 4f15a25670 | |||
| 8c3aab3959 | |||
| 4ef1da74af | |||
| 721b46cde2 | |||
| 85e76d0978 | |||
| b9ffc9d6a5 | |||
| 7aa5cd0464 | |||
| 68be6c90ca | |||
| 424fc1bda0 | |||
| e7bdac001f | |||
| 0275050a84 | |||
| d7b094f699 | |||
| 5c0e39ddb5 | |||
| 7be8de2298 | |||
| b0e8fa1bcf | |||
| 4640a6ff8a | |||
| 7f44a844b7 | |||
| a8c68f6bdc | |||
| 93dbd56af2 | |||
| c2f5202634 | |||
| f2d3be292c | |||
| 9a568791ce | |||
| 793e5a416f | |||
| b527dc297e | |||
| b0b6837332 | |||
| 9223dd8d40 | |||
| 46be4d6603 | |||
| c60f83ccc0 | |||
| 07da201a60 | |||
| 31959fdcd7 | |||
| 2f4a27613d | |||
| 54521600b1 | |||
| 683abeb434 | |||
| bda3e0e7b9 | |||
| bf446d26ef | |||
| 705942a165 | |||
| 54f72f90ed |
110
src/app/blog/page.tsx
Normal file
110
src/app/blog/page.tsx
Normal file
@@ -0,0 +1,110 @@
|
|||||||
|
"use client";
|
||||||
|
|
||||||
|
import ReactLenis from "lenis/react";
|
||||||
|
import BlogCardOne from "@/components/sections/blog/BlogCardOne";
|
||||||
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||||
|
import { useBlogPosts } from "@/hooks/useBlogPosts";
|
||||||
|
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
|
||||||
|
import FooterMedia from '@/components/sections/footer/FooterMedia';
|
||||||
|
|
||||||
|
const bookingUrl = "/contact";
|
||||||
|
const franchisePagePath = "/franchise-doc-barnet-grooming-salon";
|
||||||
|
|
||||||
|
export default function BlogPage() {
|
||||||
|
const { posts, isLoading } = useBlogPosts();
|
||||||
|
|
||||||
|
return (
|
||||||
|
<ThemeProvider defaultButtonVariant="text-shift"
|
||||||
|
defaultTextAnimation="entrance-slide"
|
||||||
|
borderRadius="rounded"
|
||||||
|
contentWidth="mediumLarge"
|
||||||
|
sizing="largeSmallSizeLargeTitles"
|
||||||
|
background="none"
|
||||||
|
cardStyle="outline"
|
||||||
|
primaryButtonStyle="radial-glow"
|
||||||
|
secondaryButtonStyle="glass"
|
||||||
|
headingFontWeight="extrabold">
|
||||||
|
<ReactLenis root>
|
||||||
|
<div id="nav" data-section="nav">
|
||||||
|
|
||||||
|
<NavbarLayoutFloatingOverlay navItems={[
|
||||||
|
{
|
||||||
|
name: "Home", id: "/"},
|
||||||
|
{
|
||||||
|
name: "Services", id: "/#services"},
|
||||||
|
{
|
||||||
|
name: "Prices", id: "/#pricing"},
|
||||||
|
{
|
||||||
|
name: "Contact", id: "/#contact"},
|
||||||
|
|
||||||
|
{
|
||||||
|
name: "Blog", id: "/blog"},
|
||||||
|
{
|
||||||
|
name: "Franchise", id: franchisePagePath},
|
||||||
|
]}
|
||||||
|
brandName="Doc Barnet Grooming Salon"
|
||||||
|
button={{
|
||||||
|
text: "BOOK NOW", href: bookingUrl}} />
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{isLoading ? (
|
||||||
|
<div className="w-content-width mx-auto py-20 text-center">
|
||||||
|
<p className="text-foreground">Loading posts...</p>
|
||||||
|
</div>
|
||||||
|
) : (
|
||||||
|
<div id="blog" data-section="blog">
|
||||||
|
<BlogCardOne
|
||||||
|
blogs={posts}
|
||||||
|
title="Latest Articles"
|
||||||
|
description="Stay updated with our latest insights"
|
||||||
|
textboxLayout="default"
|
||||||
|
useInvertedBackground={false}
|
||||||
|
carouselMode="buttons"
|
||||||
|
animationType="slide-up"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
|
||||||
|
<div id="footer" data-section="footer">
|
||||||
|
|
||||||
|
<FooterMedia imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DMGxfgFdRWLXzYqe2HfYt6JE4x/uploaded-1778094604107-kwe3q62f.jpg"
|
||||||
|
logoText="DOC BARNET"
|
||||||
|
columns={[
|
||||||
|
{
|
||||||
|
title: "Services", items: [
|
||||||
|
{
|
||||||
|
label: "Gents Hair", href: "/#services"},
|
||||||
|
{
|
||||||
|
label: "Ladies Cut", href: "/#services"},
|
||||||
|
{
|
||||||
|
label: "Beard Grooming", href: "/#services"},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "Company", items: [
|
||||||
|
{
|
||||||
|
label: "About Us", href: "/#about"},
|
||||||
|
{
|
||||||
|
label: "Contact", href: "/#contact"},
|
||||||
|
{
|
||||||
|
label: "Book Now", href: bookingUrl},
|
||||||
|
{
|
||||||
|
label: "Franchise", href: franchisePagePath},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "Social", items: [
|
||||||
|
{
|
||||||
|
label: "Instagram", href: "https://www.instagram.com/docbarnet?igsh=MWMwdHBnamFibXc3Yw%3D%3D&utm_source=qr"},
|
||||||
|
{
|
||||||
|
label: "Facebook", href: "#"},
|
||||||
|
{
|
||||||
|
label: "Privacy Policy", href: "#"},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
]} />
|
||||||
|
</div>
|
||||||
|
</ReactLenis>
|
||||||
|
</ThemeProvider>
|
||||||
|
);
|
||||||
|
}
|
||||||
Binary file not shown.
|
Before Width: | Height: | Size: 25 KiB After Width: | Height: | Size: 87 KiB |
109
src/app/franchise/page.tsx
Normal file
109
src/app/franchise/page.tsx
Normal file
@@ -0,0 +1,109 @@
|
|||||||
|
"use client";
|
||||||
|
|
||||||
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||||
|
import ReactLenis from "lenis/react";
|
||||||
|
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
|
||||||
|
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
|
||||||
|
import FooterMedia from '@/components/sections/footer/FooterMedia';
|
||||||
|
|
||||||
|
export default function FranchisePage() {
|
||||||
|
const bookingUrl = "https://tinyurl.com/2kr8jy37";
|
||||||
|
|
||||||
|
return (
|
||||||
|
<ThemeProvider
|
||||||
|
defaultButtonVariant="text-shift"
|
||||||
|
defaultTextAnimation="entrance-slide"
|
||||||
|
borderRadius="rounded"
|
||||||
|
contentWidth="mediumLarge"
|
||||||
|
sizing="largeSmallSizeLargeTitles"
|
||||||
|
background="none"
|
||||||
|
cardStyle="outline"
|
||||||
|
primaryButtonStyle="radial-glow"
|
||||||
|
secondaryButtonStyle="glass"
|
||||||
|
headingFontWeight="extrabold"
|
||||||
|
>
|
||||||
|
<ReactLenis root>
|
||||||
|
<div id="nav" data-section="nav">
|
||||||
|
<NavbarLayoutFloatingOverlay
|
||||||
|
navItems={[
|
||||||
|
{
|
||||||
|
name: "Home", id: "hero"},
|
||||||
|
{
|
||||||
|
name: "Services", id: "services"},
|
||||||
|
{
|
||||||
|
name: "Prices", id: "pricing"},
|
||||||
|
{
|
||||||
|
name: "Franchise", id: "/franchise"},
|
||||||
|
{
|
||||||
|
name: "Contact", id: "contact"},
|
||||||
|
|
||||||
|
{ name: "Blog", id: "/blog" },
|
||||||
|
]}
|
||||||
|
brandName="Doc Barnet Grooming Salon"
|
||||||
|
button={{
|
||||||
|
text: "BOOK NOW", href: bookingUrl}}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="franchise-contact" data-section="franchise-contact">
|
||||||
|
<ContactSplitForm
|
||||||
|
useInvertedBackground={false}
|
||||||
|
title="Franchise Opportunities"
|
||||||
|
description="Interested in joining the Doc Barnet family? We are expanding and seeking passionate individuals to join our brand. Contact us today to learn more about our franchise model and how you can become a part of our success story.\n\nDoc Barnet Management:\n📞 07867777688\n📧 operations@docbarnet.uk"
|
||||||
|
inputs={[
|
||||||
|
{ name: "name", type: "text", placeholder: "Your Name", required: true },
|
||||||
|
{ name: "email", type: "email", placeholder: "Your Email", required: true },
|
||||||
|
{ name: "phone", type: "tel", placeholder: "Your Phone Number" },
|
||||||
|
{ name: "company", type: "text", placeholder: "Your Company (Optional)" }
|
||||||
|
]}
|
||||||
|
textarea={{
|
||||||
|
name: "message", placeholder: "Your Message", rows: 5
|
||||||
|
}}
|
||||||
|
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DMGxfgFdRWLXzYqe2HfYt6JE4x/uploaded-1779820625891-kmygfm29.jpg"
|
||||||
|
mediaAnimation="slide-up"
|
||||||
|
buttonText="Send Enquiry"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="footer" data-section="footer">
|
||||||
|
<FooterMedia
|
||||||
|
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DMGxfgFdRWLXzYqe2HfYt6JE4x/uploaded-1778094604107-kwe3q62f.jpg"
|
||||||
|
logoText="DOC BARNET"
|
||||||
|
columns={[
|
||||||
|
{
|
||||||
|
title: "Services", items: [
|
||||||
|
{
|
||||||
|
label: "Gents Hair", href: "#services"},
|
||||||
|
{
|
||||||
|
label: "Ladies Cut", href: "#services"},
|
||||||
|
{
|
||||||
|
label: "Beard Grooming", href: "#services"},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "Company", items: [
|
||||||
|
{
|
||||||
|
label: "About Us", href: "#about"},
|
||||||
|
{
|
||||||
|
label: "Contact", href: "#contact"},
|
||||||
|
{
|
||||||
|
label: "Book Now", href: bookingUrl},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "Social", items: [
|
||||||
|
{
|
||||||
|
label: "Instagram", href: "https://www.instagram.com/docbarnet?igsh=MWMwdHBnamFibXc3Yw%3D%3D&utm_source=qr"},
|
||||||
|
{
|
||||||
|
label: "Facebook", href: "#"},
|
||||||
|
{
|
||||||
|
label: "Privacy Policy", href: "#"},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</ReactLenis>
|
||||||
|
</ThemeProvider>
|
||||||
|
);
|
||||||
|
}
|
||||||
@@ -4,15 +4,15 @@ import { Inter } from "next/font/google";
|
|||||||
import "./globals.css";
|
import "./globals.css";
|
||||||
import "@/lib/gsap-setup";
|
import "@/lib/gsap-setup";
|
||||||
import { ServiceWrapper } from "@/components/ServiceWrapper";
|
import { ServiceWrapper } from "@/components/ServiceWrapper";
|
||||||
import Tag from "@/tag/Tag";
|
|
||||||
import { getVisualEditScript } from "@/utils/visual-edit-script";
|
import { getVisualEditScript } from "@/utils/visual-edit-script";
|
||||||
import { Public_Sans } from "next/font/google";
|
import { Public_Sans } from "next/font/google";
|
||||||
|
import { Roboto } from "next/font/google";
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
export const metadata: Metadata = {
|
export const metadata: Metadata = {
|
||||||
title: 'Doc Barnet | Premium Grooming Salon Gloucester',
|
title: "Doc Barnet Grooming Salon | Premium Barber & Hair Salon Gloucester Quays",
|
||||||
description: 'Experience premium barbering, ladies hair, and grooming at Doc Barnet Gloucester Quays. Now open.',
|
description: "Luxury barbering, ladies hair, skin fades, beard grooming, and modern hair styling at Doc Barnet Grooming Salon in Gloucester Quays. EST. 2007. Book online today.",
|
||||||
openGraph: {
|
openGraph: {
|
||||||
"title": "Doc Barnet Grooming Salon",
|
"title": "Doc Barnet Grooming Salon",
|
||||||
"siteName": "Doc Barnet",
|
"siteName": "Doc Barnet",
|
||||||
@@ -20,13 +20,13 @@ export const metadata: Metadata = {
|
|||||||
},
|
},
|
||||||
};
|
};
|
||||||
|
|
||||||
const publicSans = Public_Sans({
|
|
||||||
variable: "--font-public-sans",
|
|
||||||
subsets: ["latin"],
|
|
||||||
});
|
const roboto = Roboto({
|
||||||
const inter = Inter({
|
variable: "--font-roboto",
|
||||||
variable: "--font-inter",
|
|
||||||
subsets: ["latin"],
|
subsets: ["latin"],
|
||||||
|
weight: ["100", "300", "400", "500", "700", "900"],
|
||||||
});
|
});
|
||||||
|
|
||||||
export default function RootLayout({
|
export default function RootLayout({
|
||||||
@@ -37,8 +37,8 @@ export default function RootLayout({
|
|||||||
return (
|
return (
|
||||||
<html lang="en" suppressHydrationWarning>
|
<html lang="en" suppressHydrationWarning>
|
||||||
<ServiceWrapper>
|
<ServiceWrapper>
|
||||||
<body className={`${publicSans.variable} ${inter.variable} antialiased`}>
|
<body className={`${roboto.variable} antialiased`}>
|
||||||
<Tag />
|
|
||||||
{children}
|
{children}
|
||||||
<script
|
<script
|
||||||
dangerouslySetInnerHTML={{
|
dangerouslySetInnerHTML={{
|
||||||
|
|||||||
269
src/app/page.tsx
269
src/app/page.tsx
@@ -12,9 +12,10 @@ import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatin
|
|||||||
import PricingCardTwo from '@/components/sections/pricing/PricingCardTwo';
|
import PricingCardTwo from '@/components/sections/pricing/PricingCardTwo';
|
||||||
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
|
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
|
||||||
import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';
|
import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';
|
||||||
import ContactText from '@/components/sections/contact/ContactText';
|
|
||||||
|
|
||||||
export default function LandingPage() {
|
export default function LandingPage() {
|
||||||
|
const bookingUrl = "https://tinyurl.com/2kr8jy37";
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<ThemeProvider
|
<ThemeProvider
|
||||||
defaultButtonVariant="text-shift"
|
defaultButtonVariant="text-shift"
|
||||||
@@ -32,46 +33,97 @@ export default function LandingPage() {
|
|||||||
<div id="nav" data-section="nav">
|
<div id="nav" data-section="nav">
|
||||||
<NavbarLayoutFloatingOverlay
|
<NavbarLayoutFloatingOverlay
|
||||||
navItems={[
|
navItems={[
|
||||||
{ name: "Home", id: "hero" },
|
{
|
||||||
{ name: "Services", id: "services" },
|
name: "Home", id: "hero"},
|
||||||
{ name: "Prices", id: "pricing" },
|
{
|
||||||
{ name: "Book", id: "booking" },
|
name: "Services", id: "services"},
|
||||||
{ name: "Contact", id: "contact" },
|
{
|
||||||
|
name: "Prices", id: "pricing"},
|
||||||
|
{
|
||||||
|
name: "Franchise", id: "/franchise"},
|
||||||
|
{
|
||||||
|
name: "Contact", id: "contact"},
|
||||||
|
|
||||||
|
{ name: "Blog", id: "/blog" },
|
||||||
]}
|
]}
|
||||||
brandName="DOC BARNET"
|
brandName="Doc Barnet Grooming Salon"
|
||||||
button={{ text: "BOOK NOW", href: "#booking" }}
|
button={{
|
||||||
|
text: "BOOK NOW", href: bookingUrl}}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="hero" data-section="hero">
|
<div id="hero" data-section="hero">
|
||||||
<HeroBillboardTestimonial
|
<HeroBillboardTestimonial
|
||||||
useInvertedBackground={false}
|
useInvertedBackground={false}
|
||||||
background={{ variant: "gradient-bars" }}
|
background={{
|
||||||
|
variant: "gradient-bars"}}
|
||||||
title="NOW OPEN AT GLOUCESTER QUAYS"
|
title="NOW OPEN AT GLOUCESTER QUAYS"
|
||||||
description="Premium Grooming. Expert Styling. Experience the pinnacle of grooming excellence."
|
description="Premium Grooming. Expert Styling. Experience the pinnacle of grooming excellence."
|
||||||
testimonials={[
|
testimonials={[
|
||||||
{ name: "James R.", handle: "@jamesr", testimonial: "Best haircut I've had in years.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/portriat-beautiful-business-woman-standing_23-2148317282.jpg" },
|
{
|
||||||
{ name: "Sophie M.", handle: "@sophiem", testimonial: "Amazing Balayage treatment.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/attractive-woman-dark-wall_329181-7280.jpg" }
|
name: "James R.", handle: "@jamesr", testimonial: "Best haircut I've had in years. Professional and high quality.", rating: 5,
|
||||||
|
imageSrc: "http://img.b2bpic.net/free-photo/portriat-beautiful-business-woman-standing_23-2148317282.jpg"},
|
||||||
|
{
|
||||||
|
name: "Sophie M.", handle: "@sophiem", testimonial: "Amazing Balayage treatment, truly premium experience.", rating: 5,
|
||||||
|
imageSrc: "http://img.b2bpic.net/free-photo/attractive-woman-dark-wall_329181-7280.jpg"},
|
||||||
|
{
|
||||||
|
name: "Mark D.", handle: "@markd", testimonial: "The attention to detail on the fade was spot on. 5 stars.", rating: 5,
|
||||||
|
imageSrc: "http://img.b2bpic.net/free-photo/handsome-bearded-man-barbershop-barber-work_627829-7351.jpg"},
|
||||||
|
{
|
||||||
|
name: "Elena P.", handle: "@elenap", testimonial: "Professional, welcoming, and perfectly styled. Highly recommend.", rating: 5,
|
||||||
|
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-woman-with-dandruff-looking-mirror_23-2149311387.jpg"},
|
||||||
|
{
|
||||||
|
name: "Chris W.", handle: "@chrisw", testimonial: "Classic barbering with a modern, luxury edge. Exceptional.", rating: 5,
|
||||||
|
imageSrc: "http://img.b2bpic.net/free-photo/stylish-room-with-blurred-effect_1203-554.jpg"},
|
||||||
|
]}
|
||||||
|
buttons={[
|
||||||
|
{
|
||||||
|
text: "BOOK NOW", href: bookingUrl},
|
||||||
|
{
|
||||||
|
text: "VIEW PRICES", href: "#pricing"},
|
||||||
|
]}
|
||||||
|
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DMGxfgFdRWLXzYqe2HfYt6JE4x/uploaded-1778093237434-05qgab2c.jpg"
|
||||||
|
imageAlt="Doc Barnet Luxury Salon"
|
||||||
|
avatars={[
|
||||||
|
{
|
||||||
|
src: "https://img.b2bpic.net/free-photo/high-fashion-portrait-young-elegant-blonde-woman-black-wool-hat-wearing-oversize-white-fringe-poncho-with-long-grey-dress_273443-3799.jpg?id=11195909", alt: "Shaving process"},
|
||||||
|
{
|
||||||
|
src: "https://img.b2bpic.net/free-photo/fashion-studio-image-two-young-women-stylish-casual-spring-outfit-having-fun-show-tongue-bright-trendy-colors-stylish-hairstyle-with-buns-cool-sunglasses-friends-portrait_273443-1142.jpg?id=9331369", alt: "Haircut process"},
|
||||||
|
{
|
||||||
|
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DMGxfgFdRWLXzYqe2HfYt6JE4x/uploaded-1779125338765-fdbqo198.jpg", alt: "Creative content"},
|
||||||
|
{
|
||||||
|
src: "https://img.b2bpic.net/free-photo/three-young-beautiful-smiling-girls-trendy-summer-casual-jeans-clothes-sexy-carefree-women-posing-positive-models-sunglasses_158538-4730.jpg?id=6601657", alt: "Washing process"},
|
||||||
|
{
|
||||||
|
src: "http://img.b2bpic.net/free-photo/handsome-afro-american-traveler-brown-jacket-hat-with-backpack-stands-studio-isolated-dark-background_613910-6586.jpg", alt: "Stylish traveler"},
|
||||||
|
]}
|
||||||
|
marqueeItems={[
|
||||||
|
{
|
||||||
|
type: "text", text: "PRECISION CUTS"},
|
||||||
|
{
|
||||||
|
type: "text", text: "LUXURY COLOR"},
|
||||||
|
{
|
||||||
|
type: "text", text: "EXPERT STYLING"},
|
||||||
|
{
|
||||||
|
type: "text", text: "PREMIUM BEARD"},
|
||||||
|
{
|
||||||
|
type: "text", text: "MODERN SALON"},
|
||||||
]}
|
]}
|
||||||
buttons={[{ text: "BOOK NOW", href: "#booking" }, { text: "VIEW PRICES", href: "#pricing" }]}
|
|
||||||
imageSrc="http://img.b2bpic.net/free-photo/close-up-details-hairdresser-salon_23-2149205856.jpg"
|
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="about" data-section="about">
|
<div id="about" data-section="about">
|
||||||
<InlineImageSplitTextAbout
|
<InlineImageSplitTextAbout
|
||||||
useInvertedBackground={false}
|
useInvertedBackground={false}
|
||||||
heading={[{ type: "text", content: "THE DOC BARNET EXPERIENCE" }, { type: "image", src: "http://img.b2bpic.net/free-photo/barber-applying-cream-clients-beard_107420-94778.jpg" }]}
|
heading={[
|
||||||
buttons={[{ text: "DISCOVER MORE", href: "#services" }]}
|
{
|
||||||
/>
|
type: "text", content: "THE DOC BARNET EXPERIENCE"},
|
||||||
</div>
|
{
|
||||||
|
type: "image", src: "http://img.b2bpic.net/free-photo/barber-applying-cream-clients-beard_107420-94778.jpg", alt: "Barber at work"},
|
||||||
<div id="booking" data-section="booking">
|
]}
|
||||||
<ContactText
|
buttons={[
|
||||||
text="Ready to look your best? Book your appointment online with Fresha."
|
{
|
||||||
buttons={[{ text: "Book with Fresha", href: "https://www.fresha.com" }]}
|
text: "DISCOVER MORE", href: "#services"},
|
||||||
background={{ variant: "gradient-bars" }}
|
]}
|
||||||
useInvertedBackground={false}
|
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@@ -82,11 +134,15 @@ export default function LandingPage() {
|
|||||||
gridVariant="two-columns-alternating-heights"
|
gridVariant="two-columns-alternating-heights"
|
||||||
useInvertedBackground={false}
|
useInvertedBackground={false}
|
||||||
features={[
|
features={[
|
||||||
{ title: "Gents Haircuts", description: "Precision styling.", imageSrc: "http://img.b2bpic.net/free-photo/studio-portrait-fashionable-modern-male-grey-t-shirt_613910-532.jpg" },
|
{
|
||||||
{ title: "Ladies Styling", description: "Wash, cut, and blow dry.", imageSrc: "http://img.b2bpic.net/free-photo/woman-with-hairdryer-hairbrush_1385-2900.jpg" }
|
title: "Gents Haircuts", description: "Precision styling tailored to your unique look.", imageSrc: "http://img.b2bpic.net/free-photo/studio-portrait-fashionable-modern-male-grey-t-shirt_613910-532.jpg", imageAlt: "Gents Haircut"},
|
||||||
|
{
|
||||||
|
title: "Ladies Styling", description: "Wash, cut, and blow dry services for sophisticated style.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DMGxfgFdRWLXzYqe2HfYt6JE4x/tmp/hairstyle-holding-hair-drayer-1779125588683-ef4b646b.png", imageAlt: "Ladies Styling"},
|
||||||
|
{
|
||||||
|
title: "Beard & Facial", description: "Expert beard shaping, hot towel shaves, and facial treatments.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DMGxfgFdRWLXzYqe2HfYt6JE4x/uploaded-1779127917991-ff4pbcfh.jpg", imageAlt: "Facial treatment"},
|
||||||
]}
|
]}
|
||||||
title="PREMIUM SERVICES"
|
title="PREMIUM SERVICES"
|
||||||
description="Comprehensive grooming solutions."
|
description="Comprehensive grooming and hair solutions for gentlemen and ladies."
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@@ -96,18 +152,169 @@ export default function LandingPage() {
|
|||||||
textboxLayout="default"
|
textboxLayout="default"
|
||||||
useInvertedBackground={false}
|
useInvertedBackground={false}
|
||||||
plans={[
|
plans={[
|
||||||
{ id: "p1", badge: "Most Popular", price: "£35", subtitle: "Premium Haircut", buttons: [{ text: "Book", href: "#booking" }], features: ["Consultation", "Precision Cut"] }
|
{
|
||||||
|
id: "p1", badge: "Most Popular", price: "£19.99", subtitle: "Premium Haircut & Styling", buttons: [
|
||||||
|
{
|
||||||
|
text: "Book Now", href: bookingUrl},
|
||||||
|
],
|
||||||
|
features: [
|
||||||
|
"Consultation", "Precision Cut", "Style Advice", "Finish"],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "p2", badge: "Essential", price: "£45", subtitle: "Cut, Wash & Blow Dry", buttons: [
|
||||||
|
{
|
||||||
|
text: "Book Now", href: bookingUrl},
|
||||||
|
],
|
||||||
|
features: [
|
||||||
|
"Head Massage", "Professional Cut", "Styling"],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "p3", badge: "Luxury", price: "£85", subtitle: "Balayage & Treatment", buttons: [
|
||||||
|
{
|
||||||
|
text: "Book Now", href: bookingUrl},
|
||||||
|
],
|
||||||
|
features: [
|
||||||
|
"Consultation", "Expert Colour", "Treatment", "Finish"],
|
||||||
|
},
|
||||||
]}
|
]}
|
||||||
title="PRICE LIST"
|
title="PRICE LIST"
|
||||||
description="Transparent pricing."
|
description="Transparent pricing for world-class grooming."
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="gallery" data-section="gallery">
|
||||||
|
<ProductCardTwo
|
||||||
|
animationType="slide-up"
|
||||||
|
textboxLayout="default"
|
||||||
|
gridVariant="four-items-2x2-equal-grid"
|
||||||
|
useInvertedBackground={false}
|
||||||
|
products={[
|
||||||
|
{
|
||||||
|
id: "g1", name: "Classic Fade", brand: "Styling", price: "Transformation", rating: 5,
|
||||||
|
reviewCount: "2024", imageSrc: "http://img.b2bpic.net/free-photo/portrait-stylish-male-who-himself-shaving-while-sitting-barber-chair-hairdressing-salon_613910-18649.jpg"},
|
||||||
|
{
|
||||||
|
id: "g2", name: "Balayage", brand: "Colour", price: "Transformation", rating: 5,
|
||||||
|
reviewCount: "2024", imageSrc: "http://img.b2bpic.net/free-photo/woman-wears-grey-hair-wig_633478-1316.jpg"},
|
||||||
|
{
|
||||||
|
id: "g3", name: "Salon Interior", brand: "Style", price: "Luxury Space", rating: 5,
|
||||||
|
reviewCount: "2024", imageSrc: "http://img.b2bpic.net/free-photo/professional-hairdresser-sitting-barber-chair-waiting-customer_613910-3902.jpg"},
|
||||||
|
{
|
||||||
|
id: "g4", name: "Lighting Design", brand: "Design", price: "Atmosphere", rating: 5,
|
||||||
|
reviewCount: "2024", imageSrc: "http://img.b2bpic.net/free-photo/high-angle-barber-s-instruments-shop_23-2149186524.jpg"},
|
||||||
|
{
|
||||||
|
id: "g5", name: "Tools", brand: "Precision", price: "Detail", rating: 5,
|
||||||
|
reviewCount: "2024", imageSrc: "http://img.b2bpic.net/free-photo/model-career-kit-still-life-top-view_23-2150217977.jpg"},
|
||||||
|
{
|
||||||
|
id: "g6", name: "Blow Dry", brand: "Styling", price: "Treatment", rating: 5,
|
||||||
|
reviewCount: "2024", imageSrc: "http://img.b2bpic.net/free-photo/woman-drying-hair-hairsalon_1157-27184.jpg"},
|
||||||
|
]}
|
||||||
|
title="OUR WORK"
|
||||||
|
description="Visual highlights from our salon floor."
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="reviews" data-section="reviews">
|
||||||
|
<TestimonialCardSixteen
|
||||||
|
animationType="slide-up"
|
||||||
|
textboxLayout="default"
|
||||||
|
useInvertedBackground={false}
|
||||||
|
testimonials={[
|
||||||
|
{
|
||||||
|
id: "1", name: "Sarah H.", role: "Client", company: "Local Resident", rating: 5,
|
||||||
|
imageSrc: "http://img.b2bpic.net/free-photo/portrait-sexy-handsome-fashion-male-model-man-dressed-elegant-suit-black-studio-lights-background_158538-9659.jpg"},
|
||||||
|
{
|
||||||
|
id: "2", name: "David L.", role: "Client", company: "Businessman", rating: 5,
|
||||||
|
imageSrc: "http://img.b2bpic.net/free-photo/portrait-stylish-woman-posing-fashionable-outfit_23-2149021828.jpg"},
|
||||||
|
{
|
||||||
|
id: "3", name: "Emily B.", role: "Client", company: "Frequent Visitor", rating: 5,
|
||||||
|
imageSrc: "http://img.b2bpic.net/free-photo/professional-barber-working-with-client-hairdressing-salon-styling-beard-with-trimmer_613910-18291.jpg"},
|
||||||
|
{
|
||||||
|
id: "4", name: "John D.", role: "Client", company: "Styling Enthusiast", rating: 5,
|
||||||
|
imageSrc: "http://img.b2bpic.net/free-photo/portrait-man-barbershop-with-classic-styling_618663-34.jpg"},
|
||||||
|
{
|
||||||
|
id: "5", name: "Clara R.", role: "Client", company: "New Guest", rating: 5,
|
||||||
|
imageSrc: "http://img.b2bpic.net/free-photo/two-businessman-discussing-their-chart-coffee-shop_1150-6422.jpg"},
|
||||||
|
]}
|
||||||
|
kpiItems={[
|
||||||
|
{
|
||||||
|
value: "17+", label: "Years Experience"},
|
||||||
|
{
|
||||||
|
value: "5000+", label: "Happy Clients"},
|
||||||
|
{
|
||||||
|
value: "100%", label: "Satisfaction Rate"},
|
||||||
|
]}
|
||||||
|
title="WHAT OUR CLIENTS SAY"
|
||||||
|
description="We pride ourselves on the highest standards of service and style."
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="offer" data-section="offer">
|
||||||
|
<ContactCenter
|
||||||
|
useInvertedBackground={false}
|
||||||
|
background={{
|
||||||
|
variant: "gradient-bars"}}
|
||||||
|
tag="LIMITED OFFER"
|
||||||
|
title="20% OFF YOUR FIRST VISIT"
|
||||||
|
description="TUSDAY ONLY CODE: DOCBARNET20 "
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="contact" data-section="contact">
|
||||||
|
<FaqSplitMedia
|
||||||
|
textboxLayout="default"
|
||||||
|
useInvertedBackground={false}
|
||||||
|
faqs={[
|
||||||
|
{
|
||||||
|
id: "f1", title: "Opening Hours", content: "Mon-Sat: 9am - 7pm | Sun: 10am - 4pm"},
|
||||||
|
{
|
||||||
|
id: "f2", title: "Appointments", content: "01452 224220 / 07495 044457"},
|
||||||
|
{
|
||||||
|
id: "f3", title: "Location", content: "Gloucester Quays Designer Outlet"},
|
||||||
|
]}
|
||||||
|
imageSrc="http://img.b2bpic.net/free-photo/hairdressing-equipment-white-background_23-2147711627.jpg"
|
||||||
|
mediaAnimation="slide-up"
|
||||||
|
title="VISIT US"
|
||||||
|
description="Unit 67, Gloucester Quays Designer Outlet, Gloucester GL1 5SH"
|
||||||
|
faqsAnimation="slide-up"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="footer" data-section="footer">
|
<div id="footer" data-section="footer">
|
||||||
<FooterMedia
|
<FooterMedia
|
||||||
imageSrc="http://img.b2bpic.net/free-photo/minimalist-background_23-2151967093.jpg"
|
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DMGxfgFdRWLXzYqe2HfYt6JE4x/uploaded-1778094604107-kwe3q62f.jpg"
|
||||||
logoText="DOC BARNET"
|
logoText="DOC BARNET"
|
||||||
columns={[{ title: "Services", items: [{ label: "Book Now", href: "#booking" }] }]}
|
columns={[
|
||||||
|
{
|
||||||
|
title: "Services", items: [
|
||||||
|
{
|
||||||
|
label: "Gents Hair", href: "#services"},
|
||||||
|
{
|
||||||
|
label: "Ladies Cut", href: "#services"},
|
||||||
|
{
|
||||||
|
label: "Beard Grooming", href: "#services"},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "Company", items: [
|
||||||
|
{
|
||||||
|
label: "About Us", href: "#about"},
|
||||||
|
{
|
||||||
|
label: "Contact", href: "#contact"},
|
||||||
|
{
|
||||||
|
label: "Book Now", href: bookingUrl},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "Social", items: [
|
||||||
|
{
|
||||||
|
label: "Instagram", href: "https://www.instagram.com/docbarnet?igsh=MWMwdHBnamFibXc3Yw%3D%3D&utm_source=qr"},
|
||||||
|
{
|
||||||
|
label: "Facebook", href: "#"},
|
||||||
|
{
|
||||||
|
label: "Privacy Policy", href: "#"},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
]}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</ReactLenis>
|
</ReactLenis>
|
||||||
|
|||||||
@@ -24,5 +24,5 @@ h3,
|
|||||||
h4,
|
h4,
|
||||||
h5,
|
h5,
|
||||||
h6 {
|
h6 {
|
||||||
font-family: var(--font-public-sans), sans-serif;
|
font-family: var(--font-libre-baskerville), serif;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -10,15 +10,15 @@
|
|||||||
--accent: #ffffff;
|
--accent: #ffffff;
|
||||||
--background-accent: #ffffff; */
|
--background-accent: #ffffff; */
|
||||||
|
|
||||||
--background: #0a0a0a;
|
--background: #1a1a1a;
|
||||||
--card: #171717;
|
--card: #2e2e2e;
|
||||||
--foreground: #f5f5f5;
|
--foreground: #f0e6d2;
|
||||||
--primary-cta: #C5A059;
|
--primary-cta: #d4af37;
|
||||||
--primary-cta-text: #000000;
|
--primary-cta-text: #000000;
|
||||||
--secondary-cta: #171717;
|
--secondary-cta: #a67c00;
|
||||||
--secondary-cta-text: #f5f5f5;
|
--secondary-cta-text: #f5f5f5;
|
||||||
--accent: #6B4F3C;
|
--accent: #ffd700;
|
||||||
--background-accent: #262626;
|
--background-accent: #0d0d0d;
|
||||||
|
|
||||||
/* text sizing - set by ThemeProvider */
|
/* text sizing - set by ThemeProvider */
|
||||||
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);
|
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);
|
||||||
|
|||||||
Reference in New Issue
Block a user