95 lines
4.5 KiB
TypeScript
95 lines
4.5 KiB
TypeScript
"use client";
|
|
|
|
import Link from "next/link";
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import NavbarStyleApple from "@/components/navbar/NavbarStyleApple/NavbarStyleApple";
|
|
import TextAbout from "@/components/sections/about/TextAbout";
|
|
import TestimonialCardTwo from "@/components/sections/testimonial/TestimonialCardTwo";
|
|
import ContactCTA from "@/components/sections/contact/ContactCTA";
|
|
import FooterLogoReveal from "@/components/sections/footer/FooterLogoReveal";
|
|
import { Rocket } from "lucide-react";
|
|
|
|
const AboutPage = () => {
|
|
const navItems = [
|
|
{ name: "Features", id: "features" },
|
|
{ name: "Pricing", id: "pricing" },
|
|
{ name: "About", id: "about" },
|
|
{ name: "FAQ", id: "faq" },
|
|
{ name: "Contact", id: "contact" },
|
|
];
|
|
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="directional-hover"
|
|
defaultTextAnimation="background-highlight"
|
|
borderRadius="soft"
|
|
contentWidth="smallMedium"
|
|
sizing="largeSmallSizeLargeTitles"
|
|
background="noiseDiagonalGradient"
|
|
cardStyle="soft-shadow"
|
|
primaryButtonStyle="double-inset"
|
|
secondaryButtonStyle="radial-glow"
|
|
headingFontWeight="normal"
|
|
>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleApple brandName="Klyvor" navItems={navItems} />
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<TextAbout
|
|
tag="Our Mission"
|
|
title="Bringing back the magic of in-person collaboration for remote teams everywhere"
|
|
useInvertedBackground={false}
|
|
buttons={[{ text: "Explore Features", href: "/features" }]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardTwo
|
|
title="Why Teams Love Klyvor"
|
|
description="Hear from leaders and team members who've experienced the transformation"
|
|
tag="Impact Stories"
|
|
testimonials={[
|
|
{
|
|
id: "1", name: "Sarah Chen", role: "VP of People Operations", testimonial:
|
|
"Klyvor transformed how our distributed team connects. The proximity-based chat feels so natural—it's like having the office vibe without anyone having to commute.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APB5UalHMSIeHJRmgN2Si9gvpB/professional-pixelart-avatar-portrait-of-1772484222510-4ab8e0ab.png?_wi=2", imageAlt: "Sarah Chen"},
|
|
{
|
|
id: "2", name: "Marcus Rodriguez", role: "CEO & Founder", testimonial:
|
|
"We cut our video call fatigue in half. Employees actually enjoy logging into Klyvor now instead of dreading another Zoom meeting.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APB5UalHMSIeHJRmgN2Si9gvpB/professional-pixelart-avatar-portrait-of-1772484222544-1c50356f.png?_wi=2", imageAlt: "Marcus Rodriguez"},
|
|
{
|
|
id: "3", name: "Elena Petrov", role: "Engineering Manager", testimonial:
|
|
"The instant rooms feature alone saves our team 10+ hours per week. No more hunting for meeting links or dealing with calendar conflicts.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APB5UalHMSIeHJRmgN2Si9gvpB/professional-pixelart-avatar-portrait-of-1772484222432-45e74f1a.png?_wi=2", imageAlt: "Elena Petrov"},
|
|
]}
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactCTA
|
|
tag="Join Us"
|
|
tagIcon={Rocket}
|
|
title="Be part of the remote work revolution"
|
|
description="Experience how Klyvor is reshaping what it means to work remotely and building stronger teams across distances."
|
|
buttons={[
|
|
{ text: "Start Free Trial", href: "https://klyvor.com/signup" },
|
|
{ text: "Learn More", href: "/features" },
|
|
]}
|
|
background={{ variant: "radial-gradient" }}
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterLogoReveal
|
|
logoText="Klyvor"
|
|
leftLink={{ text: "Privacy Policy", href: "#" }}
|
|
rightLink={{ text: "Terms of Service", href: "#" }}
|
|
/>
|
|
</div>
|
|
</ThemeProvider>
|
|
);
|
|
};
|
|
|
|
export default AboutPage; |