From 2493a05d53a179a9ae981d6c6f464baf69912096 Mon Sep 17 00:00:00 2001 From: Sandip Chowdhury Date: Tue, 17 Feb 2026 17:26:29 +0530 Subject: [PATCH] home page colour changed --- app/(public)/_homeComponents/About.tsx | 60 +- app/(public)/_homeComponents/Benefits.tsx | 30 +- app/(public)/_homeComponents/CTA.tsx | 23 +- .../_homeComponents/CompanySlider.tsx | 65 +- app/(public)/_homeComponents/FAQ.tsx | 24 +- app/(public)/_homeComponents/Features.tsx | 33 +- app/(public)/_homeComponents/Header.tsx | 40 +- app/(public)/_homeComponents/Hero.tsx | 447 +++++++++---- app/(public)/_homeComponents/HowItWorks.tsx | 47 +- app/(public)/_homeComponents/Modules.tsx | 106 +-- app/(public)/_homeComponents/Pricing.tsx | 614 ++++++------------ app/(public)/_homeComponents/Testimonials.tsx | 30 +- package-lock.json | 11 + package.json | 1 + 14 files changed, 793 insertions(+), 738 deletions(-) diff --git a/app/(public)/_homeComponents/About.tsx b/app/(public)/_homeComponents/About.tsx index d242e67..c710df7 100644 --- a/app/(public)/_homeComponents/About.tsx +++ b/app/(public)/_homeComponents/About.tsx @@ -43,7 +43,7 @@ const AboutUs: React.FC = () => { }; return ( -
+
{/* Left Side - Images */} @@ -59,12 +59,12 @@ const AboutUs: React.FC = () => { variants={imageVariants} className="relative z-10 rounded-2xl overflow-hidden shadow-2xl" > -
+
-
+
-

+

Team Collaboration

@@ -77,8 +77,8 @@ const AboutUs: React.FC = () => { transition={{ delay: 0.2 }} className="absolute -top-6 -right-6 w-32 h-32 md:w-40 md:h-40 z-20" > -
- +
+
@@ -88,8 +88,8 @@ const AboutUs: React.FC = () => { transition={{ delay: 0.4 }} className="absolute -bottom-8 -left-8 w-36 h-36 md:w-44 md:h-44 z-20" > -
- +
+
@@ -97,27 +97,27 @@ const AboutUs: React.FC = () => {
-
+
-

500K+

-

Successful Hires

+

500K+

+

Successful Hires

- {/* Decorative Elements */} + {/* Decorative Blur */} @@ -130,7 +130,7 @@ const AboutUs: React.FC = () => { className="space-y-6" > - + {home.about.badge} @@ -138,21 +138,21 @@ const AboutUs: React.FC = () => { {home.about.heading} {home.about.subheading} {home.about.description} @@ -166,13 +166,15 @@ const AboutUs: React.FC = () => { - -

+ +

{stat.value}

-

{stat.label}

+

+ {stat.label} +

))} @@ -188,10 +190,10 @@ const AboutUs: React.FC = () => { transition={{ delay: 0.8 + index * 0.1 }} className="flex items-center gap-3" > -
- +
+
- {highlight} + {highlight} ))} @@ -200,7 +202,7 @@ const AboutUs: React.FC = () => { {" "} + Start Free Trial + +
-

+

No credit card required · Quick setup · Cancel anytime

@@ -56,4 +55,4 @@ const CTA = () => { ); }; -export default CTA; +export default CTA; \ No newline at end of file diff --git a/app/(public)/_homeComponents/CompanySlider.tsx b/app/(public)/_homeComponents/CompanySlider.tsx index e4f1a5f..c702a66 100644 --- a/app/(public)/_homeComponents/CompanySlider.tsx +++ b/app/(public)/_homeComponents/CompanySlider.tsx @@ -48,4 +48,67 @@ const CompanySlider = () => { ); }; -export default CompanySlider \ No newline at end of file +export default CompanySlider + + +/*"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 index cad44fe..4e8f5e2 100644 --- a/app/(public)/_homeComponents/FAQ.tsx +++ b/app/(public)/_homeComponents/FAQ.tsx @@ -1,5 +1,5 @@ "use client"; -import React, { } from "react"; +import React from "react"; import { motion } from "framer-motion"; import { Accordion, @@ -10,28 +10,26 @@ import { 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 +

+ Everything you need to know about Winixco

@@ -47,12 +45,12 @@ const FAQ = () => { > - + {item.question} - + {item.answer} @@ -65,4 +63,4 @@ const FAQ = () => { ); }; -export default FAQ \ No newline at end of file +export default FAQ; \ No newline at end of file diff --git a/app/(public)/_homeComponents/Features.tsx b/app/(public)/_homeComponents/Features.tsx index 760f576..3c996d1 100644 --- a/app/(public)/_homeComponents/Features.tsx +++ b/app/(public)/_homeComponents/Features.tsx @@ -10,20 +10,22 @@ const Features = () => { return (
- + POWERFUL FEATURES -

+ +

All-in-One ATS, HRMS & CRP{" "} - + Solutions

-

+ +

Explore features across all our products designed to scale your hiring success.

@@ -36,17 +38,28 @@ const Features = () => { whileHover={{ y: -8, scale: 1.02 }} className="h-full" > - +
-
{feature.icon}
+
+ {feature.icon} +
-

+ +

{feature.title}

-

+ +

{feature.description}

diff --git a/app/(public)/_homeComponents/Header.tsx b/app/(public)/_homeComponents/Header.tsx index 3985a6a..5aaf99f 100644 --- a/app/(public)/_homeComponents/Header.tsx +++ b/app/(public)/_homeComponents/Header.tsx @@ -13,10 +13,14 @@ const Header = () => { useEffect(() => { const handleScroll = () => setScrolled(window.scrollY > 10); window.addEventListener("scroll", handleScroll); - return () => window.removeEventListener("scroll", handleScroll); }, []); + // Remove Blogs and Careers + const navigation = home.navigation.filter( + (item) => item.name !== "Blogs" && item.name !== "Careers" + ); + return ( {
- {/* 🔥 Logo */} + {/* Logo */} { - {/* 🖥️ Desktop Navigation */} + {/* Desktop Navigation */}
- {/* 📱 Mobile Menu Icon */} + {/* Mobile Menu Icon */}
- {/* 📱 Mobile Drawer Menu */} + {/* Mobile Drawer Menu */} {isOpen && ( { className="md:hidden pb-6" >
- {home.navigation.map((item) => ( + {navigation.map((item) => ( setIsOpen(false)} > {item.name} @@ -93,7 +103,13 @@ const Header = () => { -
@@ -104,4 +120,4 @@ const Header = () => { ); }; -export default Header; \ No newline at end of file +export default Header; diff --git a/app/(public)/_homeComponents/Hero.tsx b/app/(public)/_homeComponents/Hero.tsx index 46110e4..daa1db5 100644 --- a/app/(public)/_homeComponents/Hero.tsx +++ b/app/(public)/_homeComponents/Hero.tsx @@ -1,150 +1,347 @@ "use client"; -import React from "react"; + import { motion } from "framer-motion"; -import { Check, ArrowRight, PlayCircle, Users, UserCog, Briefcase } from "lucide-react"; +import { + ArrowRight, + PlayCircle, + Users, + UserCog, + Briefcase, + Check, +} from "lucide-react"; import { Button } from "@/components/ui/button"; import { home } from "@/services/Constants"; const Hero = () => { return ( -
- {/* Background Animation */} -
- + {/* Background grid + Java/Botticelli glow */} +
+
+ + {/* Top glow */} + + {/* Bottom glow */}
-
- {/* Badge */} - - 🚀 All-In-One Talent & Workforce Platform - - - {/* Title */} - - Build Powerful{" "} - - ATS, HRMS & CRM - {" "} - Solutions - - - {/* Subtext */} - - Winixco helps organizations simplify hiring, manage employees, - and enhance client relationships — all in one platform. - - - {/* CTA Buttons */} - - - - - - {/* Trust checklist */} - - No credit card required - • - 14-day free trial - - - {/* Product Highlight Cards */} - - {[ - { icon: Users, title: "ATS", desc: "Automate hiring, AI screening & smoother interviews." }, - { icon: UserCog, title: "HRMS", desc: "Employee onboarding, payroll & performance." }, - { icon: Briefcase, title: "CRM", desc: "Manage clients & strengthen candidate relationships." }, - ].map((item, i) => ( +
+
+ {/* Left: copy */} +
+ {/* Badge */} - -

{item.title}

-

{item.desc}

+ + All-in-one ATS • HRMS • CRM for modern teams - ))} - - {/* Stats Section */} - - {home.stats.map((stat, index) => ( - -
- {stat.value} + Hire faster with a{" "} + + clean ATS workflow + + + + {/* Subtext */} + + Winixco streamlines pipelines, interview scheduling, and employee + operations—so your team can focus on decisions, not admin work. + + + {/* CTAs */} + + + + + + + {/* Trust line */} + + + + No credit card required + + • + + + 14-day free trial + + + + {/* Feature chips */} +
+ {[ + { icon: Users, title: "ATS", desc: "Pipeline + sourcing" }, + { icon: UserCog, title: "HRMS", desc: "Onboarding + reviews" }, + { icon: Briefcase, title: "CRM", desc: "Clients + pools" }, + ].map((f, i) => ( +
+
+ +
+
+
+ {f.title} +
+
{f.desc}
+
+
+ ))} +
+
+ + {/* Right preview stays same, only accent changed */} + +
+ {/* Fake topbar */}{" "} +
+ {" "} +
+ {" "} +
+ {" "} + {" "} + {" "} + {" "} +
{" "} +
+ Winixco ATS +
{" "} +
{" "} +
Today
{" "} +
{" "} + {/* Fake content */}{" "} +
+ {" "} +
+ {" "} +
+ {" "} +
+ Pipeline +
{" "} +
+ {" "} + {["Applied", "Screening", "Interview", "Offer"].map( + (t) => ( +
+ {" "} + + {t} + {" "} + + +12 + {" "} +
+ ), + )}{" "} +
{" "} +
{" "} +
+ {" "} +
+ Upcoming interviews +
{" "} +
+ {" "} + {[ + { + name: "A. Roy", + role: "Frontend Dev", + time: "11:00 AM", + }, + { + name: "S. Das", + role: "Sales Lead", + time: "02:30 PM", + }, + { name: "K. Singh", role: "HR Ops", time: "05:00 PM" }, + ].map((x) => ( +
+ {" "} +
+ {" "} +
+ {x.name} +
{" "} +
+ {x.role} +
{" "} +
{" "} +
+ {" "} + {x.time}{" "} +
{" "} +
+ ))}{" "} +
{" "} +
{" "} +
{" "} + {/* Stats row from your constants */}{" "} +
+ {" "} + {home.stats.slice(0, 2).map((s, idx) => ( +
+ {" "} +
+ {s.label} +
{" "} +
+ {s.value} +
{" "} +
+ {" "} +
{" "} +
{" "} +
+ ))}{" "} +
{" "}
-
{stat.label}
- - ))} - +
+ + {/* Accent glow */} +
+ +
); }; -export default Hero; \ No newline at end of file +export default Hero; diff --git a/app/(public)/_homeComponents/HowItWorks.tsx b/app/(public)/_homeComponents/HowItWorks.tsx index 6f1bc85..005c25e 100644 --- a/app/(public)/_homeComponents/HowItWorks.tsx +++ b/app/(public)/_homeComponents/HowItWorks.tsx @@ -1,7 +1,14 @@ "use client"; import React from "react"; import { motion } from "framer-motion"; -import { Briefcase, Users, ClipboardCheck, UserPlus, DollarSign, Handshake } from "lucide-react"; +import { + Briefcase, + Users, + ClipboardCheck, + UserPlus, + DollarSign, + Handshake, +} from "lucide-react"; const steps = [ { @@ -38,27 +45,32 @@ const steps = [ const HowItWorks = () => { return ( -
+
+ {/* Soft animated background blobs */}
+ {/* Heading */} - How It Works + How It{" "} + + Works + { whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true }} transition={{ duration: 0.6, delay: 0.2 }} - className="max-w-3xl mx-auto text-lg md:text-xl text-purple-200 mb-16" + className="max-w-3xl mx-auto text-lg md:text-xl text-[#7c7a7c] mb-16" > - Winixco connects your hiring, HR and CRM workflows into one powerful operating system — from job posting to payroll & business growth. + Winixco connects your hiring, HR and CRM workflows into one powerful + operating system — from job posting to payroll & business growth. {/* Steps */} @@ -80,13 +93,15 @@ const HowItWorks = () => { whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true }} transition={{ delay: i * 0.15 }} - className="bg-white/10 backdrop-blur-xl p-6 rounded-2xl shadow-lg hover:scale-105 transition transform" + className="bg-white p-8 rounded-2xl shadow-lg hover:shadow-xl hover:-translate-y-1 transition" > -
+
{step.icon}
-

{step.title}

-

{step.desc}

+

+ {step.title} +

+

{step.desc}

))}
@@ -95,9 +110,9 @@ const HowItWorks = () => { whileInView={{ opacity: 1 }} initial={{ opacity: 0 }} transition={{ delay: 0.9 }} - className="mt-12 text-sm text-purple-200" + className="mt-12 text-sm text-[#7c7a7c]" > - Complete the loop. Grow endlessly. 💼✨ + Complete the loop. Grow endlessly.
diff --git a/app/(public)/_homeComponents/Modules.tsx b/app/(public)/_homeComponents/Modules.tsx index 5382342..a96414d 100644 --- a/app/(public)/_homeComponents/Modules.tsx +++ b/app/(public)/_homeComponents/Modules.tsx @@ -1,4 +1,3 @@ -"use client" import React, { useState } from "react"; import { motion } from "framer-motion"; import { Button } from "@/components/ui/button"; @@ -13,8 +12,6 @@ import { } from "@/services/Constants"; import { useRouter } from "next/navigation"; - - const ModuleCard: React.FC = ({ module, index }) => { const [isHovered, setIsHovered] = useState(false); const router = useRouter(); @@ -33,7 +30,7 @@ const ModuleCard: React.FC = ({ module, index }) => { onMouseLeave={() => setIsHovered(false)} > @@ -45,20 +42,14 @@ const ModuleCard: React.FC = ({ module, index }) => { rotate: isHovered ? 5 : 0, }} transition={{ duration: 0.3 }} - className={`w-20 h-20 bg-gradient-to-br ${module.color} rounded-2xl flex items-center justify-center shadow-lg`} + className="w-20 h-20 bg-gradient-to-br from-[#13afdc] to-[#c3dbe0] rounded-2xl flex items-center justify-center shadow-lg" > - - - New - - + + New +
{/* Image */} @@ -75,26 +66,19 @@ const ModuleCard: React.FC = ({ module, index }) => { alt={module.title} className="w-full h-full object-cover" /> -
+
{/* Title */} -

+

{module.title}

{/* Description */} -

+

{module.description}

-

+

{module.subDescription}

@@ -107,10 +91,10 @@ const ModuleCard: React.FC = ({ module, index }) => { whileInView={{ opacity: 1, x: 0 }} viewport={{ once: true }} transition={{ delay: index * 0.2 + idx * 0.1 }} - className="flex items-center gap-2 bg-white/60 backdrop-blur-sm rounded-lg p-3" + className="flex items-center gap-2 bg-[#c3dbe0]/30 rounded-lg p-3" > - - + + {feature.label} @@ -120,34 +104,28 @@ const ModuleCard: React.FC = ({ module, index }) => { {/* CTA Button */} - {/* Checkmark for Completeness */} - + {/* Checkmark */} +
- +
- {/* Decorative Elements */} + {/* Decorative Blur */} @@ -156,24 +134,13 @@ const ModuleCard: React.FC = ({ module, index }) => { const ModulesSection: React.FC = () => { return ( -
- {/* Background Decorative Elements */} +
+ {/* Decorative background */}
-
@@ -185,19 +152,19 @@ const ModulesSection: React.FC = () => { viewport={{ once: true }} className="text-center mb-16" > - + {home.module.badge} -

+

{home.module.title}{" "} - + Offers - {" "} +

-

+

{home.module.subtitle}

@@ -209,7 +176,7 @@ const ModulesSection: React.FC = () => { ))}
- {/* Bottom CTA Section */} + {/* Bottom CTA */} { transition={{ delay: 0.6 }} className="mt-16 text-center" > - +

Ready to Transform Your Business?

-

- Get started with all three modules and experience seamless - integration +

+ Get started with all modules and experience seamless integration

-
- ); -}; +/* ------------------ PRICING CARD ------------------ */ -// Main Pricing Card -const MainPricingCard: React.FC = () => { - const [billingCycle, setBillingCycle] = useState<"monthly" | "yearly">( - "monthly" - ); +const MainPricingCard = () => { + const [billingCycle, setBillingCycle] = + useState<"monthly" | "yearly">("monthly"); return (
-
- - - {/* Popular Badge */} -
- - MOST POPULAR +
+ + + + ALL-IN-ONE PLAN + + +

+ Winixco ATS +

+ + {/* Toggle */} +
+ +
- - {/* Header */} -
- - ALL‑IN‑ONE PLAN • HRMS & CRM FREE - - -

- Winixco ATS – One Plan -

- - {/* Billing Toggle */} -
- - + {/* Price */} + {billingCycle === "monthly" ? ( + <> +
+ ₹1,499
+

per user / month

+ + ) : ( + <> +
+ ₹14,999 +
+

per user / year

+ + )} - {/* Pricing Display */} - {billingCycle === "monthly" ? ( -
-
- ₹1,499 -
-

per user / month

-

- - Just ₹50/day per recruiter -

-
- ) : ( -
-
- ₹14,999 -
-

per user / year

-

- Save ₹3,000 — Get 2 months FREE! 🎉 -

-
- )} -
- - {/* CTA Button */} - - -

- No credit card required • Cancel anytime • Full access during - trial -

- - {/* Features Grid */} -
- {features.map((item: Feature, index: number) => ( - - - - {item.text} - - - ))} -
- - - -
-
- ); -}; - -// Benefits Section -const BenefitsSection: React.FC = () => { - return ( -
-
- - Why Choose Winixco? - - -
- {benefitCards.map((card: BenefitCard, index: number) => ( - - - -
- {card.icon} -
-

- {card.title} -

-

- {card.description} -

- - - - ))} -
-
-
- ); -}; - -// Comparison Table -const ComparisonTable: React.FC = () => { - return ( -
-
- -

- Compare with Others -

-

- See why Winixco offers the best value for your investment -

- -
- - - - - - - - - - - - {comparisonData.map((row: ComparisonRow, index: number) => ( - - - - - - - - ))} - -
Feature - Winixco - - Zoho Recruit - - Freshteam - - Darwinbox -
- {row.feature} - - - {row.winixco} - - - - {row.zoho} - - - - {row.freshteam} - - - - {row.darwinbox} - -
-
- -
-
- ); -}; - -// CTA Section -const CtaSection: React.FC = () => { - const router = useRouter(); - return ( -
-
- -

- Need Bulk Pricing or a Demo? -

-

- Talk to our sales team for custom enterprise plans and volume - discounts -

-
- - -
- + + {/* Features */} +
+ {features.map((f, i) => ( +
+ + {f.text} +
+ ))} +
+ +
); }; -// Main Component +/* ------------------ COMPARISON ------------------ */ + +const ComparisonTable = () => ( +
+
+

+ Compare with Others +

+ +
+ + + + + + + + + + + + {comparisonData.map((row, i) => ( + + + + + + + + ))} + +
FeatureWinixcoZohoFreshteamDarwinbox
+ {row.feature} + + {row.winixco} + + {row.zoho} + + {row.freshteam} + + {row.darwinbox} +
+
+
+
+); + +/* ------------------ CTA ------------------ */ + +const CtaSection = () => { + const router = useRouter(); + + return ( +
+
+

+ Need Bulk Pricing or a Demo? +

+

+ Talk to our sales team for custom enterprise plans +

+ + +
+
+ ); +}; + +/* ------------------ MAIN ------------------ */ + export default function PricingSection() { return (
-
); -} \ No newline at end of file +} diff --git a/app/(public)/_homeComponents/Testimonials.tsx b/app/(public)/_homeComponents/Testimonials.tsx index 1f85f45..cfe1bff 100644 --- a/app/(public)/_homeComponents/Testimonials.tsx +++ b/app/(public)/_homeComponents/Testimonials.tsx @@ -20,16 +20,16 @@ const Testimonials = () => {
- + TESTIMONIALS -

+

Loved by{" "} - + Our Clients

-

+

See what our customers have to say about their experience

@@ -42,25 +42,25 @@ const Testimonials = () => { animate={{ opacity: 1, x: 0 }} exit={{ opacity: 0, x: -60 }} transition={{ duration: 0.5, ease: "easeInOut" }} - className="bg-gradient-to-br from-purple-50 to-pink-50 rounded-3xl p-12 shadow-xl" + className="bg-gradient-to-br from-[#c3dbe0] to-white rounded-3xl p-12 shadow-xl" > - + -

+

"{testimonial.content}"

-
+
{testimonial.image}
-

+

{testimonial.name}

-

{testimonial.role}

-

+

{testimonial.role}

+

{testimonial.company}

@@ -69,7 +69,7 @@ const Testimonials = () => { {[...Array(testimonial.rating)].map((_, i) => ( ))}
@@ -85,8 +85,8 @@ const Testimonials = () => { onClick={() => setCurrentIndex(index)} className={`h-3 rounded-full transition-all duration-300 ${ index === currentIndex - ? "bg-purple-600 w-8" - : "bg-gray-300 w-3 hover:bg-gray-400" + ? "bg-[#13afdc] w-8" + : "bg-gray-300 w-3 hover:bg-[#c3dbe0]" }`} /> ))} @@ -96,5 +96,5 @@ const Testimonials = () => {
); }; -export default Testimonials; +export default Testimonials; \ No newline at end of file diff --git a/package-lock.json b/package-lock.json index 0d42026..503576f 100644 --- a/package-lock.json +++ b/package-lock.json @@ -47,6 +47,7 @@ "@types/node": "^20", "@types/react": "^19", "@types/react-dom": "^19", + "baseline-browser-mapping": "^2.9.19", "tailwindcss": "^4", "tw-animate-css": "^1.3.8", "typescript": "^5" @@ -2777,6 +2778,16 @@ "npm": ">=6.4.1" } }, + "node_modules/baseline-browser-mapping": { + "version": "2.9.19", + "resolved": "https://registry.npmjs.org/baseline-browser-mapping/-/baseline-browser-mapping-2.9.19.tgz", + "integrity": "sha512-ipDqC8FrAl/76p2SSWKSI+H9tFwm7vYqXQrItCuiVPt26Km0jS+NzSsBWAaBusvSbQcfJG+JitdMm+wZAgTYqg==", + "dev": true, + "license": "Apache-2.0", + "bin": { + "baseline-browser-mapping": "dist/cli.js" + } + }, "node_modules/caniuse-lite": { "version": "1.0.30001741", "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001741.tgz", diff --git a/package.json b/package.json index d7891dd..dd67e3f 100644 --- a/package.json +++ b/package.json @@ -47,6 +47,7 @@ "@types/node": "^20", "@types/react": "^19", "@types/react-dom": "^19", + "baseline-browser-mapping": "^2.9.19", "tailwindcss": "^4", "tw-animate-css": "^1.3.8", "typescript": "^5"