216 lines
13 KiB
TypeScript
216 lines
13 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import ReactLenis from "lenis/react";
|
|
import ContactCTA from '@/components/sections/contact/ContactCTA';
|
|
import FeatureCardOne from '@/components/sections/feature/FeatureCardOne';
|
|
import FooterCard from '@/components/sections/footer/FooterCard';
|
|
import HeroOverlay from '@/components/sections/hero/HeroOverlay';
|
|
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
|
|
import PricingCardOne from '@/components/sections/pricing/PricingCardOne';
|
|
import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';
|
|
import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="shift-hover"
|
|
defaultTextAnimation="reveal-blur"
|
|
borderRadius="rounded"
|
|
contentWidth="mediumSmall"
|
|
sizing="medium"
|
|
background="blurBottom"
|
|
cardStyle="soft-shadow"
|
|
primaryButtonStyle="flat"
|
|
secondaryButtonStyle="solid"
|
|
headingFontWeight="normal"
|
|
>
|
|
<ReactLenis root>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleCentered
|
|
navItems={[
|
|
{
|
|
name: "Home", id: "#hero"},
|
|
{
|
|
name: "Office Space", id: "#office-space"},
|
|
{
|
|
name: "Meeting Room", id: "#office-space"},
|
|
{
|
|
name: "Virtual Office", id: "#office-space"},
|
|
{
|
|
name: "Locations", id: "#locations"},
|
|
{
|
|
name: "Contact", id: "#contact-section"},
|
|
]}
|
|
brandName="St Albans Office Space"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroOverlay
|
|
title="WORK SOMEWHERE WORTH IT."
|
|
description="Newly refurbished offices, meeting rooms and virtual address services in the heart of historic St Albans. Flexible terms. Inclusive pricing from £75 per week."
|
|
buttons={[
|
|
{
|
|
text: "Enquire about availability", href: "#contact-section"},
|
|
]}
|
|
imageSrc="http://img.b2bpic.net/free-photo/empty-professional-psychotherapy-office-with-modern-couch-furniture_482257-124895.jpg?_wi=1"
|
|
imageAlt="Warm and characterful interior of a coworking office space"
|
|
showDimOverlay={true}
|
|
textPosition="bottom"
|
|
avatars={[
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/portrait-smiling-excited-businesswoman-sitting-with-laptop-makes-crossed-fingers-gesture-make_1258-125410.jpg", alt: "Portrait of smiling and excited businesswoman sitting with laptop makes crossed fingers gesture make"},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/happy-young-asian-woman-winning-laptop-receive-good-news-achieve-goal-work-triumphing_1258-199179.jpg", alt: "Happy young asian woman winning on laptop receive good news achieve goal at work triumphing and"},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/portrait-businesswoman-manager-talking-coworker-office-sitting-with-laptop_1258-194648.jpg", alt: "Portrait of businesswoman manager talking to a coworker in an office sitting with laptop and"},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/young-happy-redhead-businesswoman-holding-headphones-looking-camera-while-sitting-her-desk-office-her-colleagues-are-working-background_637285-36.jpg", alt: "Young happy redhead businesswoman holding headphones and looking at camera while sitting at her desk in the office Her colleagues are working in the background"},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/portrait-smiling-man-sitting-cafe-bar-with-his-laptop-computer_342744-944.jpg", alt: "Portrait of smiling man sitting in a cafe bar with his laptop computer"},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="heritage-detail" data-section="heritage-detail">
|
|
<HeroOverlay
|
|
title="IN THE HEART OF HISTORIC ST. ALBANS "
|
|
description="A modern functional workspace in the centre of the thriving town of St. Albans, just 20 mins by train from Central London"
|
|
imageSrc="http://img.b2bpic.net/free-photo/vertical-shot-inside-dome-inside-barcelona-s-cathedral_181624-4419.jpg"
|
|
imageAlt="Architectural detail of St Albans Office Space with natural light"
|
|
showDimOverlay={false}
|
|
textPosition="bottom"
|
|
avatars={[
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/man-having-short-break-work-home_329181-14567.jpg", alt: "Man having short break during the work at home"},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/young-stylish-smiling-man-co-working-office-startup-freelancer-holding-using-tablet_285396-9048.jpg", alt: "Young stylish smiling man in co-working office, startup freelancer holding using tablet"},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/company-worker-browsing-internet-research-project-using-computer-create-business-report-with-charts-data-analyzing-network-information-web-presentation-handheld-shot_482257-50935.jpg", alt: "Company worker browsing internet to do research project, using computer to create business report with charts data. Analyzing network information for web presentation. Handheld shot."},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/portrait-young-woman-with-long-brown-hair-black-t-shirt-white-jacket_613910-8245.jpg", alt: "Portrait of young woman with long brown hair in black t shirt and white jacket."},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/close-up-portrait-young-natural-pretty-woman-with-curly-hairstyle_285396-4374.jpg", alt: "Close up portrait of young natural pretty woman with curly hairstyle"},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="introduction" data-section="introduction">
|
|
<TextSplitAbout
|
|
useInvertedBackground={true}
|
|
title="INDEPENDENT. FLEXIBLE. PERSONAL."
|
|
description={[
|
|
"We're not a chain. We're private landlords who care about the people in our building. If you need something, we pick up the phone." ]}
|
|
showBorder={false}
|
|
/>
|
|
</div>
|
|
|
|
<div id="office-space" data-section="office-space">
|
|
<FeatureCardOne
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
gridVariant="three-columns-all-equal-width"
|
|
useInvertedBackground={false}
|
|
features={[
|
|
{
|
|
title: "OFFICES TO RENT", description: "Flexible private offices tailored for individuals and small teams. Ready to move in.", imageSrc: "http://img.b2bpic.net/free-photo/young-businesswoman-using-her-phone_23-2147601413.jpg", imageAlt: "Modern private office interior", button: {
|
|
text: "Find out more", href: "#"}},
|
|
{
|
|
title: "MEETING ROOM", description: "Professional, fully equipped meeting space available by the hour or day.", imageSrc: "http://img.b2bpic.net/free-photo/business-executive-applauding-video-conference_1170-1921.jpg", imageAlt: "Stylish meeting room with large screen", button: {
|
|
text: "Find out more", href: "#"}},
|
|
{
|
|
title: "VIRTUAL OFFICE", description: "Establish a credible St Albans presence with our virtual address services.", imageSrc: "http://img.b2bpic.net/free-photo/man-talking-with-cashier-store_482257-79308.jpg", imageAlt: "Professional business mailbox and reception", button: {
|
|
text: "Find out more", href: "#"}},
|
|
]}
|
|
title="THE SPACES"
|
|
description="Discover our range of flexible workspace solutions designed to suit your needs."
|
|
/>
|
|
</div>
|
|
|
|
<div id="pricing" data-section="pricing">
|
|
<PricingCardOne
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
plans={[
|
|
{
|
|
id: "hot-desk", badge: "Flexi-Desk", price: "£75 / week", subtitle: "Great for individuals", features: [
|
|
"Access to shared workspace", "Superfast broadband", "All bills included", "Flexible daily rates"]},
|
|
{
|
|
id: "private-office", badge: "Dedicated Space", price: "From £300 / week", subtitle: "Ideal for growing teams", features: [
|
|
"Private, lockable office", "Superfast broadband", "All bills included", "Furnished workspace", "Flexible monthly terms"]},
|
|
{
|
|
id: "virtual-office-plan", badge: "Business Address", price: "From £35 / month", subtitle: "Professional local presence", features: [
|
|
"Prestigious St Albans address", "Mail handling & forwarding", "Dedicated phone number (optional)", "Professional image"]},
|
|
]}
|
|
title="CLEAR, INCLUSIVE PRICING."
|
|
description="Choose the perfect workspace solution for your business. Our flexible terms mean you only pay for what you need."
|
|
/>
|
|
</div>
|
|
|
|
<div id="locations" data-section="locations">
|
|
<FeatureCardOne
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
gridVariant="two-columns-alternating-heights"
|
|
useInvertedBackground={true}
|
|
features={[
|
|
{
|
|
title: "OUR LOCATION", description: "An embedded map showing our prime location in St Albans city centre.", imageSrc: "http://img.b2bpic.net/free-photo/aerial-view-traditional-terraced-houses-streets-dundee-scotland_1308-189586.jpg", imageAlt: "Map showing St Albans Office Space location"},
|
|
{
|
|
title: "IN THE HEART OF ST ALBANS", description: "St Albans Office Space is ideally situated in the vibrant city centre, just a short walk from St Albans City station with fast connections to London in 20-30 minutes. We're moments from the Maltings shopping centre and have excellent access to major motorways, making your commute and client visits effortless.", imageSrc: "http://img.b2bpic.net/free-photo/empty-professional-psychotherapy-office-with-modern-couch-furniture_482257-124895.jpg?_wi=2", imageAlt: "map of St Albans city centre"},
|
|
]}
|
|
title="OUR CITY CENTRE HOME"
|
|
description="Discover the convenience of working in a historic city with modern amenities."
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardTwelve
|
|
useInvertedBackground={false}
|
|
testimonials={[
|
|
{
|
|
id: "1", name: "Sarah J.", imageSrc: "http://img.b2bpic.net/free-photo/business-young-entrepreneurs-concept-young-woman-video-chats-has-online-meeting-uses-wireless_1258-195293.jpg", imageAlt: "Sarah Johnson, satisfied member"},
|
|
{
|
|
id: "2", name: "Michael C.", imageSrc: "http://img.b2bpic.net/free-photo/successful-leader_1098-14310.jpg", imageAlt: "Michael Chen, happy client"},
|
|
{
|
|
id: "3", name: "Emily R.", imageSrc: "http://img.b2bpic.net/free-photo/happy-young-brunette-woman-dressed-gray-elegant-jacket-posing-with-hands-pockets-while-leaning-table-room-with-loft-interior-looking-camera_613910-18669.jpg", imageAlt: "Emily Rodriguez, praising the space"},
|
|
{
|
|
id: "4", name: "David L.", imageSrc: "http://img.b2bpic.net/free-photo/man-smiling_1187-3402.jpg", imageAlt: "David Lee, enjoying the coworking"},
|
|
{
|
|
id: "5", name: "Jessica A.", imageSrc: "http://img.b2bpic.net/free-photo/people-job-occupation-hobby-creativity-concept-picture-positive-red-haired-young-woman-creative-profession-wearing-apron-striped-top_273609-922.jpg", imageAlt: "Jessica Allen, recommending the office"}
|
|
]}
|
|
cardTitle="GOOD COMPANY."
|
|
cardTag="Hear from our members"
|
|
cardAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact-section" data-section="contact-section">
|
|
<ContactCTA
|
|
useInvertedBackground={true}
|
|
background={{
|
|
variant: "plain"}}
|
|
tag="CONTACT US"
|
|
title="Enquire About Availability"
|
|
description="Ready to discover your new workspace? Get in touch with us today to learn more about our flexible office solutions and community."
|
|
buttons={[
|
|
{
|
|
text: "Call Us", href: "tel:01727400550"},
|
|
{
|
|
text: "Email Us", href: "mailto:info@stalbansofficespace.co.uk"},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterCard
|
|
logoText="St Albans Office Space"
|
|
copyrightText="© 2024 St Albans Office Space. All rights reserved.\n2 Chequer Street, St Albans, Hertfordshire, AL1 3XT.\nT: 01727 400550 | M: 07711 633987 | E: info@stalbansofficespace.co.uk"
|
|
/>
|
|
</div>
|
|
</ReactLenis>
|
|
</ThemeProvider>
|
|
);
|
|
} |