commit e87bdd45a1e46c359119f87345e68ff429639c3d Author: Sandip Chowdhury Date: Tue Dec 2 14:42:40 2025 +0530 first commit diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..5ef6a52 --- /dev/null +++ b/.gitignore @@ -0,0 +1,41 @@ +# See https://help.github.com/articles/ignoring-files/ for more about ignoring files. + +# dependencies +/node_modules +/.pnp +.pnp.* +.yarn/* +!.yarn/patches +!.yarn/plugins +!.yarn/releases +!.yarn/versions + +# testing +/coverage + +# next.js +/.next/ +/out/ + +# production +/build + +# misc +.DS_Store +*.pem + +# debug +npm-debug.log* +yarn-debug.log* +yarn-error.log* +.pnpm-debug.log* + +# env files (can opt-in for committing if needed) +.env* + +# vercel +.vercel + +# typescript +*.tsbuildinfo +next-env.d.ts diff --git a/README.md b/README.md new file mode 100644 index 0000000..e215bc4 --- /dev/null +++ b/README.md @@ -0,0 +1,36 @@ +This is a [Next.js](https://nextjs.org) project bootstrapped with [`create-next-app`](https://nextjs.org/docs/app/api-reference/cli/create-next-app). + +## Getting Started + +First, run the development server: + +```bash +npm run dev +# or +yarn dev +# or +pnpm dev +# or +bun dev +``` + +Open [http://localhost:3000](http://localhost:3000) with your browser to see the result. + +You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file. + +This project uses [`next/font`](https://nextjs.org/docs/app/building-your-application/optimizing/fonts) to automatically optimize and load [Geist](https://vercel.com/font), a new font family for Vercel. + +## Learn More + +To learn more about Next.js, take a look at the following resources: + +- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API. +- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial. + +You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js) - your feedback and contributions are welcome! + +## Deploy on Vercel + +The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js. + +Check out our [Next.js deployment documentation](https://nextjs.org/docs/app/building-your-application/deploying) for more details. diff --git a/app/(public)/_homeComponents/About.tsx b/app/(public)/_homeComponents/About.tsx new file mode 100644 index 0000000..09edf9c --- /dev/null +++ b/app/(public)/_homeComponents/About.tsx @@ -0,0 +1,225 @@ +import React from 'react'; +import { motion, Variants } from 'framer-motion'; +import { Button } from '@/components/ui/button'; +import { Badge } from '@/components/ui/badge'; +import { ArrowRight, CheckCircle, Users, Target, Award, Sparkles } from 'lucide-react'; +import { home } from '@/services/Constants'; + + +const AboutUs: React.FC = () => { + + const containerVariants:Variants = { + hidden: { opacity: 0 }, + visible: { + opacity: 1, + transition: { + staggerChildren: 0.2, + delayChildren: 0.3 + } + } + }; + + const itemVariants:Variants = { + hidden: { opacity: 0, y: 20 }, + visible: { + opacity: 1, + y: 0, + transition: { duration: 0.6, ease: "easeOut" } + } + }; + + const imageVariants:Variants = { + hidden: { opacity: 0, scale: 0.8 }, + visible: { + opacity: 1, + scale: 1, + transition: { duration: 0.8, ease: "easeOut" } + } + }; + + return ( +
+
+
+ {/* Left Side - Images */} + + {/* Main Large Image */} + +
+
+
+ +
+

Team Collaboration

+
+
+ + + {/* Top Right Small Image */} + +
+ +
+ + + {/* Bottom Left Small Image */} + +
+ +
+ + + {/* Bottom Right Floating Card */} + +
+
+ +
+
+

500K+

+

Successful Hires

+
+
+ + + {/* Decorative Elements */} + + + + {/* Right Side - Content */} + + + + + {home.about.badge} + + + + + {home.about.heading} + + + + {home.about.subheading} + + + + {home.about.description} + + + {/* Stats Grid */} + + {home.about.stats.map((stat, index) => ( + + +

{stat.value}

+

{stat.label}

+ + ))} + + + {/* Highlights */} + + {home.about.highlights.map((highlight, index) => ( + +
+ +
+ {highlight} + + ))} + + + {/* CTA Button */} + + + + + {/* Trust Badge */} + +
+ {[1, 2, 3, 4].map((i) => ( +
+ {i} +
+ ))} +
+ Trusted by 15,000+ companies worldwide + + +
+
+
+ ); +}; + +export default AboutUs; \ No newline at end of file diff --git a/app/(public)/_homeComponents/Animated.tsx b/app/(public)/_homeComponents/Animated.tsx new file mode 100644 index 0000000..5189b55 --- /dev/null +++ b/app/(public)/_homeComponents/Animated.tsx @@ -0,0 +1,30 @@ +"use client"; +import React, { } from "react"; +import { motion, useInView } from "framer-motion"; + + +// Animated Section Wrapper +const AnimatedSection = ({ + children, + className = "", +}: { + children: React.ReactNode; + className?: string; +}) => { + const ref = React.useRef(null); + const isInView = useInView(ref, { once: true, margin: "-100px" }); + + return ( + + {children} + + ); +}; + +export default AnimatedSection \ No newline at end of file diff --git a/app/(public)/_homeComponents/Benefits.tsx b/app/(public)/_homeComponents/Benefits.tsx new file mode 100644 index 0000000..390c095 --- /dev/null +++ b/app/(public)/_homeComponents/Benefits.tsx @@ -0,0 +1,52 @@ +"use client"; +import React, { } from "react"; +import { motion } from "framer-motion"; +import AnimatedSection from "./Animated"; +import { home } from "@/services/Constants"; + + + +// Benefits Section +const Benefits = () => { + return ( +
+
+
+
+
+ +
+ +

+ Why Choose TalentFlow? +

+

+ Experience the future of recruitment with our innovative platform +

+ + +
+ {home.benefits.map((benefit, index) => ( + + +
+
{benefit.icon}
+
+

{benefit.title}

+

{benefit.description}

+ + + ))} +
+
+
+ ); +}; + +export default Benefits \ No newline at end of file diff --git a/app/(public)/_homeComponents/CTA.tsx b/app/(public)/_homeComponents/CTA.tsx new file mode 100644 index 0000000..3113b6d --- /dev/null +++ b/app/(public)/_homeComponents/CTA.tsx @@ -0,0 +1,50 @@ +"use client"; +import React, { } from "react"; +import { motion } from "framer-motion"; +import { + ArrowRight, +} from "lucide-react"; +import { Button } from "@/components/ui/button"; + + +// CTA Section +const CTA = () => { + return ( +
+ +
+ + +
+

+ Ready to Transform Your Hiring? +

+

+ Join 10,000+ HR teams using TalentFlow to hire smarter and faster +

+ +
+ + +
+
+
+ ); +}; + +export default CTA \ No newline at end of file diff --git a/app/(public)/_homeComponents/CompanySlider.tsx b/app/(public)/_homeComponents/CompanySlider.tsx new file mode 100644 index 0000000..e4f1a5f --- /dev/null +++ b/app/(public)/_homeComponents/CompanySlider.tsx @@ -0,0 +1,51 @@ +"use client"; +import React, { } from "react"; +import { motion } from "framer-motion"; +import AnimatedSection from "./Animated"; +import { home } from "@/services/Constants"; + + + + +// Company Logos Slider +const CompanySlider = () => { + return ( +
+
+ +

+ TRUSTED BY LEADING COMPANIES WORLDWIDE +

+ + +
+ + {[...home.companies, ...home.companies].map( + (company, index) => ( +
+ {company.logo} + + {company.name} + +
+ ) + )} + +
+
+
+ ); +}; + +export default CompanySlider \ No newline at end of file diff --git a/app/(public)/_homeComponents/FAQ.tsx b/app/(public)/_homeComponents/FAQ.tsx new file mode 100644 index 0000000..cad44fe --- /dev/null +++ b/app/(public)/_homeComponents/FAQ.tsx @@ -0,0 +1,68 @@ +"use client"; +import React, { } from "react"; +import { motion } from "framer-motion"; +import { + Accordion, + AccordionContent, + AccordionItem, + AccordionTrigger, +} from "@/components/ui/accordion"; +import AnimatedSection from "./Animated"; +import { home } from "@/services/Constants"; + + + +// FAQ Section +const FAQ = () => { + return ( +
+
+ + + FAQ + +

+ Frequently Asked{" "} + + Questions + +

+

+ Everything you need to know about TalentFlow +

+ + + + + {home.faq.map((item, index) => ( + + + + {item.question} + + + {item.answer} + + + + ))} + + +
+
+ ); +}; + +export default FAQ \ No newline at end of file diff --git a/app/(public)/_homeComponents/Features.tsx b/app/(public)/_homeComponents/Features.tsx new file mode 100644 index 0000000..4cd31d3 --- /dev/null +++ b/app/(public)/_homeComponents/Features.tsx @@ -0,0 +1,63 @@ +"use client"; +import React, { } from "react"; +import { motion } from "framer-motion"; +import { Card, CardContent } from "@/components/ui/card"; +import AnimatedSection from "./Animated"; +import { home } from "@/services/Constants"; + +// Features Section +const Features = () => { + return ( +
+
+ + + POWERFUL FEATURES + +

+ Everything You Need to{" "} + + Hire Smarter + +

+

+ Our comprehensive ATS platform combines cutting-edge AI with + intuitive design to revolutionize your recruitment process. +

+ + +
+ {home.features.map((feature, index) => ( + + + + +
+
{feature.icon}
+
+

+ {feature.title} +

+

+ {feature.description} +

+ + + + + ))} +
+
+
+ ); +}; + +export default Features \ No newline at end of file diff --git a/app/(public)/_homeComponents/Footer.tsx b/app/(public)/_homeComponents/Footer.tsx new file mode 100644 index 0000000..7d2b4db --- /dev/null +++ b/app/(public)/_homeComponents/Footer.tsx @@ -0,0 +1,91 @@ +"use client"; +import React from "react"; +import { motion } from "framer-motion"; +import { + Twitter, + Linkedin, + Github, + Facebook, + Instagram, + MessageCircle, +} from "lucide-react"; + +const Footer = () => { + return ( + + ); +}; + +export default Footer; \ No newline at end of file diff --git a/app/(public)/_homeComponents/Header.tsx b/app/(public)/_homeComponents/Header.tsx new file mode 100644 index 0000000..3985a6a --- /dev/null +++ b/app/(public)/_homeComponents/Header.tsx @@ -0,0 +1,107 @@ +"use client"; +import React, { useState, useEffect } from "react"; +import { motion } from "framer-motion"; +import Link from "next/link"; +import { Menu, X } from "lucide-react"; +import { Button } from "@/components/ui/button"; +import { home } from "@/services/Constants"; + +const Header = () => { + const [isOpen, setIsOpen] = useState(false); + const [scrolled, setScrolled] = useState(false); + + useEffect(() => { + const handleScroll = () => setScrolled(window.scrollY > 10); + window.addEventListener("scroll", handleScroll); + + return () => window.removeEventListener("scroll", handleScroll); + }, []); + + return ( + +
+
+ + {/* 🔥 Logo */} + + + Company Logo + + + + {/* 🖥️ Desktop Navigation */} + + +
+ + +
+ + {/* 📱 Mobile Menu Icon */} + +
+ + {/* 📱 Mobile Drawer Menu */} + {isOpen && ( + +
+ {home.navigation.map((item) => ( + setIsOpen(false)} + > + {item.name} + + ))} + + +
+ + )} +
+ + ); +}; + +export default Header; \ No newline at end of file diff --git a/app/(public)/_homeComponents/Hero.tsx b/app/(public)/_homeComponents/Hero.tsx new file mode 100644 index 0000000..e2d889a --- /dev/null +++ b/app/(public)/_homeComponents/Hero.tsx @@ -0,0 +1,139 @@ +"use client"; +import React, { } from "react"; +import { motion } from "framer-motion"; +import { + Check, + ArrowRight, + PlayCircle, +} from "lucide-react"; +import { Button } from "@/components/ui/button"; +import { home } from "@/services/Constants"; + +const Hero = () => { + return ( +
+ {/* Animated Background Elements */} +
+ + + +
+ +
+
+ + + ✨ AI-Powered Recruitment Platform + + + + + Hire Top Talent{" "} + + 10x Faster + + + + + The world's most intelligent ATS that automates screening, + scheduling, and hiring. Join 10,000+ companies who trust TalentFlow. + + + + + + + + + + No credit card required + • + + 14-day free trial + +
+ + {/* Stats Section */} + + {home.stats.map((stat, index) => ( + +
+ {stat.value} +
+
{stat.label}
+ + ))} + +
+
+ ); +}; + +export default Hero \ No newline at end of file diff --git a/app/(public)/_homeComponents/Pricing.tsx b/app/(public)/_homeComponents/Pricing.tsx new file mode 100644 index 0000000..6758f7f --- /dev/null +++ b/app/(public)/_homeComponents/Pricing.tsx @@ -0,0 +1,74 @@ +"use client"; +import React, { } from "react"; +import { motion } from "framer-motion"; +import { + Check, +} from "lucide-react"; +import { Button } from "@/components/ui/button"; +import AnimatedSection from "./Animated"; +import { home } from "@/services/Constants"; + + + +// Pricing Section +const Pricing = () => { + return ( +
+
+ +

+ Simple & Transparent{" "} + + Pricing + +

+

+ Choose a plan that fits your hiring scale +

+ + +
+ {home.plans.map((plan, index) => ( + +

{plan.name}

+
{plan.price}
+

{plan.period}

+
    + {plan.features.map((f, i) => ( +
  • + + {f} +
    • + ))} +
+ + + ))} +
+
+
+ ); +}; + +export default Pricing \ No newline at end of file diff --git a/app/(public)/_homeComponents/Testimonials.tsx b/app/(public)/_homeComponents/Testimonials.tsx new file mode 100644 index 0000000..d02489b --- /dev/null +++ b/app/(public)/_homeComponents/Testimonials.tsx @@ -0,0 +1,104 @@ +"use client"; +import React, { useState, useEffect } from "react"; +import { motion } from "framer-motion"; +import { + Star, + Quote, +} from "lucide-react"; +import AnimatedSection from "./Animated"; +import { home } from "@/services/Constants"; + + +// Testimonials Slider +const Testimonials = () => { + const [currentIndex, setCurrentIndex] = useState(0); + + useEffect(() => { + const timer = setInterval(() => { + setCurrentIndex((prev) => (prev + 1) % home.testimonials.length); + }, 5000); + return () => clearInterval(timer); + }, []); + + return ( +
+
+ + + TESTIMONIALS + +

+ Loved by{" "} + + Hiring Teams + +

+

+ See what our customers have to say about their experience +

+ + +
+
+ {home.testimonials.map((testimonial, index) => ( + + +

+ "{testimonial.content}" +

+
+
+ {testimonial.image} +
+
+

+ {testimonial.name} +

+

{testimonial.role}

+

+ {testimonial.company} +

+
+
+ {[...Array(testimonial.rating)].map((_, i) => ( + + ))} +
+
+ + ))} +
+ +
+ {home.testimonials.map((_, index) => ( +
+
+
+
+ ); +}; + +export default Testimonials \ No newline at end of file diff --git a/app/(public)/contact/_components/ContactForm.tsx b/app/(public)/contact/_components/ContactForm.tsx new file mode 100644 index 0000000..62a86ee --- /dev/null +++ b/app/(public)/contact/_components/ContactForm.tsx @@ -0,0 +1,158 @@ +"use client" +import React, { useState } from 'react'; +import { motion } from 'framer-motion'; +import { Button } from '@/components/ui/button'; +import { Card, CardContent } from '@/components/ui/card'; +import { Input } from '@/components/ui/input'; +import { Textarea } from '@/components/ui/textarea'; +import { + Send, + CheckCircle} from 'lucide-react'; + + + +// Contact Form Component +const ContactForm: React.FC = () => { + const [formData, setFormData] = useState({ + name: '', + email: '', + phone: '', + address: '', + message: '' + }); + const [submitted, setSubmitted] = useState(false); + + const handleSubmit = () => { + console.log('Form submitted:', formData); + setSubmitted(true); + setTimeout(() => setSubmitted(false), 3000); + }; + + const handleChange = (e: React.ChangeEvent) => { + setFormData({ + ...formData, + [e.target.name]: e.target.value + }); + }; + + return ( + + + +
+

+ Send us a message +

+

+ Fill out the form below and we'll get back to you within 24 hours +

+
+ + {submitted ? ( + +
+ +
+

Thank you!

+

Your message has been sent successfully.

+ + ) : ( +
+
+
+ + +
+
+ + +
+
+ +
+
+ + +
+
+ + +
+
+ +
+ +