mirror of
https://github.com/Snigdha-OS/Snigdha-OS.github.io.git
synced 2025-09-05 20:26:43 +02:00
✨ style: minor changes in ui
This commit is contained in:
@@ -5,35 +5,51 @@ import { MissionSection } from '../components/about/MissionSection';
|
|||||||
|
|
||||||
export default function About() {
|
export default function About() {
|
||||||
return (
|
return (
|
||||||
<div className="py-12">
|
<div className="py-16 bg-gradient-to-b from-gray-50 via-white to-gray-100">
|
||||||
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
<div className="max-w-7xl mx-auto px-6 sm:px-8 lg:px-12">
|
||||||
|
{/* Hero Section */}
|
||||||
<motion.div
|
<motion.div
|
||||||
initial={{ opacity: 0, y: 20 }}
|
initial={{ opacity: 0, y: 20 }}
|
||||||
animate={{ opacity: 1, y: 0 }}
|
animate={{ opacity: 1, y: 0 }}
|
||||||
className="text-center mb-12"
|
transition={{ duration: 0.8 }}
|
||||||
|
className="text-center mb-16"
|
||||||
>
|
>
|
||||||
<h1 className="text-4xl font-bold text-gray-900">About Snigdha OS</h1>
|
<h1 className="text-5xl font-extrabold text-gray-900">
|
||||||
<p className="mt-4 text-lg text-gray-600">
|
About Snigdha OS
|
||||||
|
</h1>
|
||||||
|
<p className="mt-4 text-xl text-gray-600 max-w-2xl mx-auto">
|
||||||
The most advanced penetration testing distribution, made for security professionals.
|
The most advanced penetration testing distribution, made for security professionals.
|
||||||
</p>
|
</p>
|
||||||
</motion.div>
|
</motion.div>
|
||||||
|
|
||||||
<div className="space-y-16">
|
{/* Content Sections */}
|
||||||
<section>
|
<div className="space-y-20">
|
||||||
|
{/* Mission Section */}
|
||||||
|
<section className="bg-cornflower-blue/5 rounded-2xl p-8 shadow-lg">
|
||||||
<MissionSection />
|
<MissionSection />
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
|
{/* Team Section */}
|
||||||
<section>
|
<section>
|
||||||
<h2 className="text-2xl font-bold text-gray-900 mb-8">Our Team Structure</h2>
|
<h2 className="text-3xl font-bold text-gray-900 text-center mb-12">
|
||||||
<TeamSection />
|
Our Team Structure
|
||||||
|
</h2>
|
||||||
|
<div className="overflow-hidden rounded-xl shadow-md bg-white p-6">
|
||||||
|
<TeamSection />
|
||||||
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
|
{/* Timeline Section */}
|
||||||
<section>
|
<section>
|
||||||
<h2 className="text-2xl font-bold text-gray-900 mb-8">Release Timeline</h2>
|
<h2 className="text-3xl font-bold text-gray-900 text-center mb-12">
|
||||||
<Timeline />
|
Release Timeline
|
||||||
|
</h2>
|
||||||
|
<div className="bg-gray-50 p-6 rounded-lg shadow-lg">
|
||||||
|
<Timeline />
|
||||||
|
</div>
|
||||||
</section>
|
</section>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
Reference in New Issue
Block a user