Merge version_2 into main

Merge version_2 into main
This commit was merged in pull request #3.
This commit is contained in:
2026-05-26 03:06:27 +00:00
4 changed files with 337 additions and 134 deletions

View File

@@ -2,12 +2,12 @@
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactCenter from '@/components/sections/contact/ContactCenter';
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
import ContactText from '@/components/sections/contact/ContactText';
import FaqBase from '@/components/sections/faq/FaqBase';
export default function LandingPage() {
export default function ContactPage() {
return (
<ThemeProvider
defaultButtonVariant="bounce-effect"
@@ -22,131 +22,79 @@ export default function LandingPage() {
headingFontWeight="semibold"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarStyleApple
navItems={[
{
name: "Home",
id: "/",
},
{
name: "About Us",
id: "/about",
},
{
name: "Services",
id: "/services",
},
{
name: "Contact",
id: "/contact",
},
]}
brandName="ProBiz Solutions"
/>
</div>
<div id="nav" data-section="nav">
<NavbarStyleApple
navItems={[
{ name: "Home", id: "/" },
{ name: "About Us", id: "/about" },
{ name: "Services", id: "/services" },
{ name: "Contact", id: "/contact" }
]}
brandName="ProBiz Solutions"
/>
</div>
<div id="contact-form" data-section="contact-form">
<ContactCenter
useInvertedBackground={false}
background={{
variant: "plain",
}}
tag="Get in Touch"
title="Let's Build Something Great Together"
description="Reach out to discuss your project or any inquiries. We're eager to help you achieve your digital goals."
inputPlaceholder="Enter your email"
buttonText="Send Message"
termsText="By sending a message, you're confirming that you agree with our Terms and Conditions."
/>
</div>
<div id="contact-form-section" data-section="contact-form-section">
<ContactText
background={{ variant: "radial-gradient" }}
text="Reach Out to ProBiz Solutions for Your Digital Needs. Our CRM-integrated contact forms ensure your inquiries are tracked, secured with anti-spam, and efficiently configured for lead capture. Fill out the form below, and we'll be in touch to discuss your project."
buttons={[{ text: "Submit Inquiry", onClick: () => alert('Form functionality to be integrated via CRM system.') }]}
/>
</div>
<div id="faq" data-section="faq">
<FaqSplitText
useInvertedBackground={true}
faqs={[
{
id: "1",
title: "What technologies do you use?",
content: "We primarily utilize modern frontend technologies like Next.js, React, and TypeScript, backed by robust backend solutions such as ASP.NET Core for scalable and maintainable applications.",
},
{
id: "2",
title: "How long does a typical website project take?",
content: "Project timelines vary based on complexity and scope. A standard business website can take anywhere from 4-8 weeks, while more complex platforms may require longer. We provide detailed timelines after our initial consultation.",
},
{
id: "3",
title: "Do you provide ongoing maintenance and support?",
content: "Yes, we offer comprehensive post-launch support and maintenance packages, including security updates, performance monitoring, and content management assistance, to ensure your site remains optimal.",
},
]}
sideTitle="Common Questions"
sideDescription="Find quick answers to frequently asked questions about our services and process."
faqsAnimation="slide-up"
textPosition="left"
/>
</div>
<div id="faq" data-section="faq">
<FaqBase
faqsAnimation="slide-up"
textboxLayout="default"
useInvertedBackground={true}
title="Frequently Asked Questions"
description="Find quick answers to common questions about our services and processes."
faqs={[
{
id: "faq-1", title: "How does the CRM integration work?", content: "Our contact forms are designed to seamlessly integrate with popular CRM platforms, automatically capturing lead information and tracking inquiries. This ensures no lead is missed and your sales team has immediate access to new prospects."
},
{
id: "faq-2", title: "What anti-spam measures are in place?", content: "We implement advanced anti-spam techniques, including reCAPTCHA and honeypot fields, to protect your forms from unwanted submissions and ensure you receive genuine inquiries only."
},
{
id: "faq-3", title: "Can I customize the lead capture fields?", content: "Yes, our forms are highly configurable. You can customize the fields to capture specific information relevant to your business, allowing for tailored lead qualification and improved conversion rates."
},
{
id: "faq-4", title: "How are inquiries tracked?", content: "Every submission is automatically logged and tracked within your CRM, providing a clear history of communication and status updates. This helps in managing leads effectively and optimizing your outreach strategies."
}
]}
/>
</div>
<div id="footer" data-section="footer">
<FooterBaseReveal
logoText="ProBiz Solutions"
columns={[
{
title: "Company",
items: [
{
label: "About Us",
href: "/about",
},
{
label: "Our Team",
href: "/about#team",
},
{
label: "Careers",
href: "#",
},
],
},
{
title: "Services",
items: [
{
label: "Web Development",
href: "/services#service-features",
},
{
label: "SEO Optimization",
href: "/services#service-features",
},
{
label: "Pricing",
href: "/services#pricing",
},
],
},
{
title: "Resources",
items: [
{
label: "Blog",
href: "/services#blog",
},
{
label: "Contact Us",
href: "/contact",
},
{
label: "FAQ",
href: "/contact#faq",
},
],
},
]}
copyrightText="© 2024 ProBiz Solutions. All rights reserved."
/>
</div>
<div id="footer" data-section="footer">
<FooterBaseReveal
logoText="ProBiz Solutions"
columns={[
{
title: "Company", items: [
{ label: "About Us", href: "/about" },
{ label: "Our Team", href: "/about#team" },
{ label: "Careers", href: "#" }
]
},
{
title: "Services", items: [
{ label: "Web Development", href: "/services#service-features" },
{ label: "SEO Optimization", href: "/services#service-features" },
{ label: "Pricing", href: "/services#pricing" }
]
},
{
title: "Resources", items: [
{ label: "Blog", href: "/services#blog" },
{ label: "Contact Us", href: "/contact" },
{ label: "FAQ", href: "/contact#faq" }
]
}
]}
copyrightText="© 2024 ProBiz Solutions. All rights reserved."
/>
</div>
</ReactLenis>
</ThemeProvider>
);

View File

@@ -0,0 +1,125 @@
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import HeroSplitDualMedia from '@/components/sections/hero/HeroSplitDualMedia';
import AboutMetric from '@/components/sections/about/AboutMetric';
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
import { useParams } from 'next/navigation';
import { DollarSign, Home, Ruler, MapPin } from "lucide-react";
export default function PropertyDetailPage() {
const params = useParams();
const propertyId = params.id;
const propertyDetails = {
id: propertyId,
address: "123 Main St, Anytown, USA", price: "$550,000", bedrooms: "3 Beds", bathrooms: "2 Baths", sqft: "1,800 SqFt", description: `Discover this charming property, located in a highly desirable neighborhood. This home boasts spacious interiors, modern amenities, and a beautiful backyard perfect for entertaining. With ${propertyId} as its identifier, this listing is a prime example of value and comfort.`,
images: [
"http://img.b2bpic.net/free-photo/house-front-with-garden_1145-217.jpg", "http://img.b2bpic.net/free-photo/minimalist-interio-design_23-2149363065.jpg", "http://img.b2bpic.net/free-photo/living-room-interior-design_23-2149363067.jpg"
]
};
return (
<ThemeProvider
defaultButtonVariant="bounce-effect"
defaultTextAnimation="reveal-blur"
borderRadius="soft"
contentWidth="compact"
sizing="medium"
background="noiseDiagonalGradient"
cardStyle="outline"
primaryButtonStyle="gradient"
secondaryButtonStyle="solid"
headingFontWeight="semibold"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarStyleApple
navItems={[
{ name: "Home", id: "/" },
{ name: "Properties", id: "/properties" },
{ name: "About Us", id: "/about" },
{ name: "Services", id: "/services" },
{ name: "Contact", id: "/contact" },
]}
brandName="ProBiz Solutions"
/>
</div>
<div id="hero-property-detail" data-section="hero-property-detail">
<HeroSplitDualMedia
background={{ variant: "animated-grid" }}
title={propertyDetails.address}
description={propertyDetails.description}
tag={`Listing ID: ${propertyId}`}
tagAnimation="slide-up"
buttons={[
{ text: "Schedule Tour", href: "/contact" },
{ text: "Contact Agent", href: "/contact" },
]}
buttonAnimation="slide-up"
mediaItems={[
{ imageSrc: propertyDetails.images[0], imageAlt: `Image of ${propertyDetails.address}` },
{ imageSrc: propertyDetails.images[1], imageAlt: `Another image of ${propertyDetails.address}` }
]}
mediaAnimation="slide-up"
rating={5}
ratingText="Excellent Investment Opportunity"
/>
</div>
<div id="property-metrics" data-section="property-metrics">
<AboutMetric
useInvertedBackground={true}
title="Property Highlights"
metrics={[
{ icon: DollarSign, label: "Price", value: propertyDetails.price },
{ icon: Home, label: "Bedrooms", value: propertyDetails.bedrooms },
{ icon: Ruler, label: "Bathrooms", value: propertyDetails.bathrooms },
{ icon: MapPin, label: "Area", value: propertyDetails.sqft },
]}
metricsAnimation="slide-up"
/>
</div>
<div id="footer" data-section="footer">
<FooterBaseReveal
logoText="ProBiz Solutions"
columns={[
{
title: "Company", items: [
{ label: "About Us", href: "/about" },
{ label: "Our Team", href: "/about#team" },
{ label: "Careers", href: "#" },
],
},
{
title: "Properties", items: [
{ label: "Search Properties", href: "/properties" },
{ label: "Map View", href: "/properties#map-view" },
],
},
{
title: "Services", items: [
{ label: "Web Development", href: "/services#service-features" },
{ label: "SEO Optimization", href: "/services#service-features" },
{ label: "Pricing", href: "/services#pricing" },
],
},
{
title: "Resources", items: [
{ label: "Blog", href: "/services#blog" },
{ label: "Contact Us", href: "/contact" },
{ label: "FAQ", href: "/contact#faq" },
],
},
]}
copyrightText="© 2024 ProBiz Solutions. All rights reserved."
/>
</div>
</ReactLenis>
</ThemeProvider>
);
}

130
src/app/properties/page.tsx Normal file
View File

@@ -0,0 +1,130 @@
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import HeroSplitDualMedia from '@/components/sections/hero/HeroSplitDualMedia';
import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
export default function PropertiesPage() {
return (
<ThemeProvider
defaultButtonVariant="bounce-effect"
defaultTextAnimation="reveal-blur"
borderRadius="soft"
contentWidth="compact"
sizing="medium"
background="noiseDiagonalGradient"
cardStyle="outline"
primaryButtonStyle="gradient"
secondaryButtonStyle="solid"
headingFontWeight="semibold"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarStyleApple
navItems={[
{ name: "Home", id: "/" },
{ name: "Properties", id: "/properties" },
{ name: "About Us", id: "/about" },
{ name: "Services", id: "/services" },
{ name: "Contact", id: "/contact" },
]}
brandName="ProBiz Solutions"
/>
</div>
<div id="hero-properties" data-section="hero-properties">
<HeroSplitDualMedia
background={{ variant: "animated-grid" }}
title="Find Your Dream Property"
description="Explore a wide range of properties with our advanced search and interactive map view. Your perfect home is just a click away."
tag="Real Estate Listings"
tagAnimation="slide-up"
buttons={[
{ text: "Start Search", href: "#property-search" },
{ text: "View Map", href: "#map-view" },
]}
buttonAnimation="slide-up"
mediaItems={[
{ imageSrc: "http://img.b2bpic.net/free-photo/exterior-modern-house_1203-5339.jpg", imageAlt: "Modern house exterior" },
{ imageSrc: "http://img.b2bpic.net/free-photo/real-estate-house-concept_23-2150998375.jpg", imageAlt: "House keys on a blueprint" }
]}
mediaAnimation="slide-up"
rating={5}
ratingText="Trusted by thousands of home buyers"
/>
</div>
<div id="property-search" data-section="property-search">
<TextSplitAbout
useInvertedBackground={true}
title="Advanced Property Search"
description={[
"Utilize our powerful search filters to narrow down properties by location, price, type, and more. Find exactly what you're looking for with ease.", "Our integrated IDX feed ensures you have access to the most up-to-date listings available on the market, directly from local real estate boards."
]}
buttons={[
{ text: "Refine Your Search", href: "#" }
]}
/>
</div>
<div id="map-view" data-section="map-view">
<HeroSplitDualMedia
background={{ variant: "radial-gradient" }}
title="Interactive Map View"
description="Visualize properties on an interactive map. See neighborhood amenities, school districts, and transport links at a glance."
tag="Explore Neighborhoods"
mediaItems={[
{ imageSrc: "http://img.b2bpic.net/free-photo/top-view-man-holding-smartphone-navigation_23-2148183187.jpg", imageAlt: "Man holding smartphone with map" },
{ imageSrc: "http://img.b2bpic.net/free-photo/modern-city-map-navigation-interface_53876-11816.jpg", imageAlt: "City map navigation interface" }
]}
mediaAnimation="slide-up"
rating={0}
ratingText=""
buttons={[
{ text: "Open Full Map", href: "#" }
]}
/>
</div>
<div id="footer" data-section="footer">
<FooterBaseReveal
logoText="ProBiz Solutions"
columns={[
{
title: "Company", items: [
{ label: "About Us", href: "/about" },
{ label: "Our Team", href: "/about#team" },
{ label: "Careers", href: "#" },
],
},
{
title: "Properties", items: [
{ label: "Search Properties", href: "/properties" },
{ label: "Map View", href: "/properties#map-view" },
],
},
{
title: "Services", items: [
{ label: "Web Development", href: "/services#service-features" },
{ label: "SEO Optimization", href: "/services#service-features" },
{ label: "Pricing", href: "/services#pricing" },
],
},
{
title: "Resources", items: [
{ label: "Blog", href: "/services#blog" },
{ label: "Contact Us", href: "/contact" },
{ label: "FAQ", href: "/contact#faq" },
],
},
]}
copyrightText="© 2024 ProBiz Solutions. All rights reserved."
/>
</div>
</ReactLenis>
</ThemeProvider>
);
}

View File

@@ -10,15 +10,15 @@
--accent: #ffffff;
--background-accent: #ffffff; */
--background: #f7f6f7;
--background: #f5f4f0;
--card: #ffffff;
--foreground: #0c1325;
--primary-cta: #0b07ff;
--primary-cta-text: #f7f6f7;
--secondary-cta: #ffffff;
--secondary-cta-text: #0c1325;
--accent: #93b7ff;
--background-accent: #a8bae8;
--foreground: #1a1a1a;
--primary-cta: #2c2c2c;
--primary-cta-text: #f5f4f0;
--secondary-cta: #f5f4f0;
--secondary-cta-text: #1a1a1a;
--accent: #8a8a8a;
--background-accent: #e8e6e1;
/* text sizing - set by ThemeProvider */
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);