leadstocompany/ATS-HRMS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

home page colour changed

Browse Source
This commit is contained in:
Sandip Chowdhury
2026-02-17 17:26:29 +05:30
parent f9747bcd68
commit 2493a05d53
14 changed files with 793 additions and 738 deletions
Download Patch File Download Diff File Expand all files Collapse all files

60
app/(public)/_homeComponents/About.tsx
View File

@@ -43,7 +43,7 @@ const AboutUs: React.FC = () => {
};
return (
<section className="py-16 md:py-24 bg-white overflow-hidden">
<section className="py-16 md:py-24 bg-gradient-to-b from-[#c3dbe0]/30 to-white overflow-hidden">
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div className="grid lg:grid-cols-2 gap-12 lg:gap-16 items-center">
{/* Left Side - Images */}
@@ -59,12 +59,12 @@ const AboutUs: React.FC = () => {
variants={imageVariants}
className="relative z-10 rounded-2xl overflow-hidden shadow-2xl"
>
<div className="aspect-[4/3] bg-gradient-to-br from-blue-100 via-purple-50 to-pink-100 flex items-center justify-center">
<div className="aspect-[4/3] bg-gradient-to-br from-[#13afdc]/20 to-[#c3dbe0] flex items-center justify-center">
<div className="text-center p-8">
<div className="w-24 h-24 mx-auto mb-4 bg-gradient-to-br from-blue-500 to-purple-600 rounded-2xl flex items-center justify-center">
<div className="w-24 h-24 mx-auto mb-4 bg-gradient-to-br from-[#13afdc] to-[#c3dbe0] rounded-2xl flex items-center justify-center">
<Users className="w-12 h-12 text-white" />
</div>
<p className="text-gray-600 font-medium">
<p className="text-[#7c7a7c] font-medium">
Team Collaboration
</p>
</div>
@@ -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"
>
<div className="w-full h-full rounded-xl overflow-hidden shadow-xl bg-gradient-to-br from-orange-100 to-red-100 flex items-center justify-center border-4 border-white">
<Sparkles className="w-12 h-12 text-orange-500" />
<div className="w-full h-full rounded-xl overflow-hidden shadow-xl bg-gradient-to-br from-[#13afdc]/20 to-[#c3dbe0] flex items-center justify-center border-4 border-white">
<Sparkles className="w-12 h-12 text-[#13afdc]" />
</div>
</motion.div>
@@ -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"
>
<div className="w-full h-full rounded-2xl overflow-hidden shadow-xl bg-gradient-to-br from-green-100 to-teal-100 flex items-center justify-center border-4 border-white">
<Award className="w-14 h-14 text-green-600" />
<div className="w-full h-full rounded-2xl overflow-hidden shadow-xl bg-gradient-to-br from-[#13afdc]/20 to-[#c3dbe0] flex items-center justify-center border-4 border-white">
<Award className="w-14 h-14 text-[#13afdc]" />
</div>
</motion.div>
@@ -97,27 +97,27 @@ const AboutUs: React.FC = () => {
<motion.div
variants={imageVariants}
transition={{ delay: 0.6 }}
className="absolute bottom-4 right-4 z-30 bg-white rounded-xl shadow-2xl p-4 border border-gray-100"
className="absolute bottom-4 right-4 z-30 bg-white rounded-xl shadow-2xl p-4 border border-[#c3dbe0]"
>
<div className="flex items-center gap-3">
<div className="w-12 h-12 bg-gradient-to-br from-blue-500 to-purple-600 rounded-lg flex items-center justify-center">
<div className="w-12 h-12 bg-gradient-to-br from-[#13afdc] to-[#c3dbe0] rounded-lg flex items-center justify-center">
<Target className="w-6 h-6 text-white" />
</div>
<div>
<p className="font-bold text-gray-900">500K+</p>
<p className="text-xs text-gray-500">Successful Hires</p>
<p className="font-bold text-[#0d0d0d]">500K+</p>
<p className="text-xs text-[#7c7a7c]">Successful Hires</p>
</div>
</div>
</motion.div>
{/* Decorative Elements */}
{/* Decorative Blur */}
<motion.div
animate={{
scale: [1, 1.2, 1],
rotate: [0, 90, 0],
}}
transition={{ duration: 20, repeat: Infinity, ease: "linear" }}
className="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-64 h-64 bg-blue-100 rounded-full blur-3xl opacity-30 -z-10"
className="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-64 h-64 bg-[#13afdc]/20 rounded-full blur-3xl opacity-40 -z-10"
/>
</motion.div>
@@ -130,7 +130,7 @@ const AboutUs: React.FC = () => {
className="space-y-6"
>
<motion.div variants={itemVariants}>
<Badge className="mb-4 px-4 py-2 bg-blue-50 text-blue-600 border-blue-200 hover:bg-blue-100">
<Badge className="mb-4 px-4 py-2 bg-[#13afdc]/10 text-[#13afdc] border-[#13afdc]/20">
<Sparkles className="w-4 h-4 mr-2 inline" />
{home.about.badge}
</Badge>
@@ -138,21 +138,21 @@ const AboutUs: React.FC = () => {
<motion.h2
variants={itemVariants}
className="text-3xl sm:text-4xl lg:text-5xl font-bold text-gray-900 leading-tight"
className="text-3xl sm:text-4xl lg:text-5xl font-bold text-[#0d0d0d] leading-tight"
>
{home.about.heading}
</motion.h2>
<motion.h3
variants={itemVariants}
className="text-xl sm:text-2xl font-semibold text-blue-600"
className="text-xl sm:text-2xl font-semibold text-[#13afdc]"
>
{home.about.subheading}
</motion.h3>
<motion.p
variants={itemVariants}
className="text-gray-600 text-lg leading-relaxed"
className="text-[#7c7a7c] text-lg leading-relaxed"
>
{home.about.description}
</motion.p>
@@ -166,13 +166,15 @@ const AboutUs: React.FC = () => {
<motion.div
key={index}
whileHover={{ scale: 1.05 }}
className="text-center p-4 rounded-xl bg-gradient-to-br from-gray-50 to-blue-50 border border-gray-100"
className="text-center p-4 rounded-xl bg-gradient-to-br from-white to-[#c3dbe0]/40 border border-[#c3dbe0]"
>
<stat.icon className="w-8 h-8 mx-auto mb-2 text-blue-600" />
<p className="text-2xl font-bold text-gray-900">
<stat.icon className="w-8 h-8 mx-auto mb-2 text-[#13afdc]" />
<p className="text-2xl font-bold text-[#0d0d0d]">
{stat.value}
</p>
<p className="text-xs text-gray-600 mt-1">{stat.label}</p>
<p className="text-xs text-[#7c7a7c] mt-1">
{stat.label}
</p>
</motion.div>
))}
</motion.div>
@@ -188,10 +190,10 @@ const AboutUs: React.FC = () => {
transition={{ delay: 0.8 + index * 0.1 }}
className="flex items-center gap-3"
>
<div className="flex-shrink-0 w-6 h-6 bg-green-100 rounded-full flex items-center justify-center">
<CheckCircle className="w-4 h-4 text-green-600" />
<div className="flex-shrink-0 w-6 h-6 bg-[#13afdc]/15 rounded-full flex items-center justify-center">
<CheckCircle className="w-4 h-4 text-[#13afdc]" />
</div>
<span className="text-gray-700">{highlight}</span>
<span className="text-[#0d0d0d]">{highlight}</span>
</motion.div>
))}
</motion.div>
@@ -200,7 +202,7 @@ const AboutUs: React.FC = () => {
<motion.div variants={itemVariants} className="pt-4">
<Button
size="lg"
className="bg-gradient-to-r from-purple-600 to-pink-600 hover:from-purple-700 hover:to-pink-700 text-white shadow-lg hover:shadow-xl transition-all duration-300"
className="bg-gradient-to-r from-[#13afdc] to-[#c3dbe0] text-white shadow-lg hover:shadow-xl transition-all duration-300"
>
{home.about.cta}
<ArrowRight className="ml-2 w-5 h-5" />
@@ -210,13 +212,13 @@ const AboutUs: React.FC = () => {
{/* Trust Badge */}
<motion.div
variants={itemVariants}
className="flex items-center gap-2 pt-4 text-sm text-gray-500"
className="flex items-center gap-2 pt-4 text-sm text-[#7c7a7c]"
>
<div className="flex -space-x-2">
{[1, 2, 3, 4].map((i) => (
<div
key={i}
className="w-8 h-8 rounded-full bg-gradient-to-br from-blue-400 to-purple-400 border-2 border-white flex items-center justify-center text-white text-xs font-bold"
className="w-8 h-8 rounded-full bg-gradient-to-br from-[#13afdc] to-[#c3dbe0] border-2 border-white flex items-center justify-center text-white text-xs font-bold"
>
{i}
</div>
@@ -231,4 +233,4 @@ const AboutUs: React.FC = () => {
);
};
export default AboutUs;
export default AboutUs;