2026-04-19 23:53:22 +00:00
4 changed files with 88 additions and 19 deletions
--- a/src/app/about/page.tsx
+++ b/src/app/about/page.tsx
@@ -0,0 +1,27 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
+import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
+import FooterSimple from '@/components/sections/footer/FooterSimple';
+import { Award, Rocket, Smile } from "lucide-react";
+
+export default function AboutPage() {
+  return (
+    <ThemeProvider>
+      <ReactLenis root>
+        <NavbarStyleFullscreen navItems={[{ name: "Home", id: "/" }, { name: "About", id: "/about" }, { name: "Services", id: "/services" }, { name: "Pricing", id: "/#pricing" }, { name: "Contact", id: "/#contact" }]} brandName="Proof Digital" />
+        <MetricSplitMediaAbout 
+          title="Our Mission at Proof Digital" 
+          description="We exist to bridge the gap for small and medium-sized businesses (SMBs) that lack a strong online presence. We believe that every business deserves a professional web presence to compete in today's digital landscape, and we make that happen."
+          metrics={[{ value: "150+", title: "Projects Completed" }, { value: "98%", title: "Happy Clients" }, { value: "10+", title: "Years Experience" }]}
+          useInvertedBackground={false}
+          mediaAnimation="slide-up"
+          metricsAnimation="slide-up"
+        />
+        <FooterSimple columns={[{ title: "Proof Digital", items: [{ label: "About Us", href: "/about" }, { label: "Services", href: "/services" }] }, { title: "Legal", items: [{ label: "Privacy Policy", href: "#" }, { label: "Terms of Service", href: "#" }] }]} bottomLeftText="© 2024 Proof Digital. All rights reserved." bottomRightText="Built by Proof Digital" />
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -58,7 +58,7 @@ export default function LandingPage() {
        { imageSrc: "http://img.b2bpic.net/free-photo/3d-colourful-low-poly-plexus-design-with-shallow-depth-field_1048-12757.jpg", imageAlt: "digital agency office modern" },
        { imageSrc: "http://img.b2bpic.net/free-photo/empty-modern-workspace-with-advanced-technology-enhance-efficiency_482257-125614.jpg", imageAlt: "digital agency office modern" },
        { imageSrc: "http://img.b2bpic.net/free-photo/top-view-career-guidance-items-designers_23-2149443520.jpg", imageAlt: "digital agency office modern" },
-        { imageSrc: "http://img.b2bpic.net/free-photo/close-up-laptop-keyboard-colorful-neon-illumination-backlit-keyboard_169016-29668.jpg", imageAlt: "digital agency office modern" },
+        { imageSrc: "http://img.b2bpic.net/close-up-laptop-keyboard-colorful-neon-illumination-backlit-keyboard_169016-29668.jpg", imageAlt: "digital agency office modern" },
      ]}
      buttons={[{ text: "Get Started", href: "#contact" }]}
      avatars={[
@@ -70,10 +70,10 @@ export default function LandingPage() {
      ]}
      marqueeItems={[
        { type: "image", src: "http://img.b2bpic.net/free-photo/3d-render-abstract-low-poly-background-network-communications_1048-15475.jpg", alt: "Abstract low poly" },
-        { type: "image", src: "http://img.b2bpic.net/free-photo/neon-purple-lights-with-bokeh-effect_1017-2671.jpg", alt: "Neon purple lights" },
-        { type: "image", src: "http://img.b2bpic.net/free-photo/composition-balloons-with-light-dark_23-2148987128.jpg", alt: "Balloons composition" },
-        { type: "image", src: "http://img.b2bpic.net/free-photo/innovation-technology-be-creative-futuristic-concept_53876-133718.jpg", alt: "Innovation technology" },
-        { type: "image", src: "http://img.b2bpic.net/free-photo/3d-render-modern-background-with-low-poly-plexus-design_1048-13423.jpg", alt: "Modern plexus design" },
+        { type: "image", src: "http://img.b2bpic.net/neon-purple-lights-with-bokeh-effect_1017-2671.jpg", alt: "Neon purple lights" },
+        { type: "image", src: "http://img.b2bpic.net/composition-balloons-with-light-dark_23-2148987128.jpg", alt: "Balloons composition" },
+        { type: "image", src: "http://img.b2bpic.net/innovation-technology-be-creative-futuristic-concept_53876-133718.jpg", alt: "Innovation technology" },
+        { type: "image", src: "http://img.b2bpic.net/3d-render-modern-background-with-low-poly-plexus-design_1048-13423.jpg", alt: "Modern plexus design" },
      ]}
    />
  </div>
@@ -167,14 +167,17 @@ export default function LandingPage() {
  <div id="contact" data-section="contact">
      <ContactSplitForm
      useInvertedBackground={false}
-      title="Ready to Start?"
-      description="Get in touch today and let's bring your business online."
+      title="Get in Touch"
+      description="We're here to help you build your digital presence. Reach out via the form below or email us directly at hello@proofdigital.com."
      inputs={[
-        { name: "name", type: "text", placeholder: "Your Name", required: true },
-        { name: "email", type: "email", placeholder: "Your Email", required: true },
+        { name: "name", type: "text", placeholder: "Full Name", required: true },
+        { name: "email", type: "email", placeholder: "Email Address", required: true },
+        { name: "subject", type: "text", placeholder: "Subject" },
      ]}
+      textarea={{ name: "message", placeholder: "How can we help?", rows: 4, required: true }}
      imageSrc="http://img.b2bpic.net/free-photo/green-screen-device-smiling-colleagues-doing-brainstorming_482257-123555.jpg"
      imageAlt="digital business consultant meeting"
+      buttonText="Send Message"
    />
  </div>

@@ -182,9 +185,17 @@ export default function LandingPage() {
      <FooterSimple
      columns={[
        {
-          title: "Proof Digital",          items: [
+          title: "Company",          items: [
            { label: "About Us", href: "#about" },
            { label: "Services", href: "#features" },
+            { label: "Careers", href: "#" },
+          ],
+        },
+        {
+          title: "Resources",          items: [
+            { label: "Help Center", href: "#" },
+            { label: "Blog", href: "#" },
+            { label: "Contact Support", href: "#contact" },
          ],
        },
        {
@@ -195,10 +206,10 @@ export default function LandingPage() {
        },
      ]}
      bottomLeftText="© 2024 Proof Digital. All rights reserved."
-      bottomRightText="Built by Proof Digital"
+      bottomRightText="Professional Web Solutions"
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
-}
+}
--- a/src/app/services/page.tsx
+++ b/src/app/services/page.tsx
@@ -0,0 +1,31 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
+import FeatureCardThree from '@/components/sections/feature/featureCardThree/FeatureCardThree';
+import FooterSimple from '@/components/sections/footer/FooterSimple';
+
+export default function ServicesPage() {
+  return (
+    <ThemeProvider>
+      <ReactLenis root>
+        <NavbarStyleFullscreen navItems={[{ name: "Home", id: "/" }, { name: "About", id: "/about" }, { name: "Services", id: "/services" }, { name: "Pricing", id: "/#pricing" }, { name: "Contact", id: "/#contact" }]} brandName="Proof Digital" />
+        <FeatureCardThree 
+          title="Our Specialized Services"
+          description="We deliver comprehensive digital solutions to help your business reach new customers. From stunning design to full responsiveness, we cover it all."
+          gridVariant="bento-grid"
+          animationType="slide-up"
+          textboxLayout="split"
+          features={[
+            { title: "Professional Web Design", description: "High-quality, branded designs tailored to your company's identity.", imageSrc: "" },
+            { title: "Mobile-Friendly Features", description: "Optimized layouts that look perfect on all devices, from phones to tablets.", imageSrc: "" },
+            { title: "Digital Presence Setup", description: "Get your business discovered online with robust site architecture.", imageSrc: "" },
+            { title: "SEO & Performance", description: "Fast loading speeds and optimized content to rank better on search engines.", imageSrc: "" }
+          ]}
+        />
+        <FooterSimple columns={[{ title: "Proof Digital", items: [{ label: "About Us", href: "/about" }, { label: "Services", href: "/services" }] }, { title: "Legal", items: [{ label: "Privacy Policy", href: "#" }, { label: "Terms of Service", href: "#" }] }]} bottomLeftText="© 2024 Proof Digital. All rights reserved." bottomRightText="Built by Proof Digital" />
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}
--- a/src/app/styles/variables.css
+++ b/src/app/styles/variables.css
@@ -10,15 +10,15 @@
  --accent: #ffffff;
  --background-accent: #ffffff; */

-  --background: #f5f4ef;
-  --card: #dad6cd;
-  --foreground: #2a2928;
-  --primary-cta: #2a2928;
+  --background: #010912;
+  --card: #152840;
+  --foreground: #e6f0ff;
+  --primary-cta: #cee7ff;
  --primary-cta-text: #f5f4ef;
-  --secondary-cta: #ecebea;
+  --secondary-cta: #0e1a29;
  --secondary-cta-text: #2a2928;
-  --accent: #ffffff;
-  --background-accent: #c6b180;
+  --accent: #3f5c79;
+  --background-accent: #004a93;

  /* text sizing - set by ThemeProvider */
  /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);