Snigdha-OS/Snigdha-OS.github.io
2
0
Fork 0
mirror of https://github.com/Snigdha-OS/Snigdha-OS.github.io.git synced 2025-09-05 20:26:43 +02:00
Code Issues Actions Packages Projects Releases Wiki Activity

✨ style: some minor changes in ui

Browse Source
This commit is contained in:
eshanized
2025-01-03 11:59:09 +05:30
parent a006adab52
commit 3d9b9a8fb5
1 changed files with 25 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
src/pages/Developers.tsx
View File

@@ -33,26 +33,31 @@ export default function Developers() {
if (isError) { if (isError) {
return ( return (
<div className="min-h-[50vh] flex items-center justify-center"> <div className="min-h-[50vh] flex items-center justify-center">
<p className="text-red-500">Failed to load data</p> <p className="text-red-500 text-lg font-semibold">
Oops! Something went wrong. Please try again later.
</p>
</div> </div>
); );
} }
return ( return (
<div className="py-12 bg-gray-50"> <div className="py-16 bg-gradient-to-b from-gray-50 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">
<motion.div <motion.div
initial={{ opacity: 0, y: 20 }} initial={{ opacity: 0, y: 20 }}
animate={{ opacity: 1, y: 0 }} animate={{ opacity: 1, y: 0 }}
transition={{ duration: 0.8 }}
className="text-center mb-16" className="text-center mb-16"
> >
<h1 className="text-4xl font-extrabold text-gray-900">Meet Our Team</h1> <h1 className="text-4xl md:text-5xl font-extrabold text-gray-900">
<p className="mt-4 text-lg text-gray-600"> Meet Our Team
The amazing developers behind Snigdha OS </h1>
<p className="mt-4 text-lg md:text-xl text-gray-600">
The talented developers behind <span className="text-cornflower-blue font-semibold">Snigdha OS</span>
</p> </p>
</motion.div> </motion.div>
<div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-8 mb-16 justify-center items-center"> <div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-10">
{queries.map((query, index) => ( {queries.map((query, index) => (
query.data && ( query.data && (
<motion.div <motion.div
@@ -60,7 +65,7 @@ export default function Developers() {
initial={{ opacity: 0, scale: 0.95 }} initial={{ opacity: 0, scale: 0.95 }}
animate={{ opacity: 1, scale: 1 }} animate={{ opacity: 1, scale: 1 }}
transition={{ delay: index * 0.2 }} transition={{ delay: index * 0.2 }}
className="flex justify-center items-center" className="bg-white rounded-lg shadow-lg hover:shadow-xl transform hover:-translate-y-1 hover:scale-105 transition-all duration-300"
> >
<TeamMemberCard <TeamMemberCard
user={query.data} user={query.data}
@@ -72,17 +77,23 @@ export default function Developers() {
))} ))}
</div> </div>
<motion.div <motion.div
initial={{ opacity: 0, y: 20 }} initial={{ opacity: 0, y: 20 }}
animate={{ opacity: 1, y: 0 }} animate={{ opacity: 1, y: 0 }}
transition={{ delay: 0.2 }} transition={{ delay: 0.4 }}
className="mt-16 text-center" className="mt-20 text-center"
> >
<h2 className="text-3xl font-semibold text-gray-900 mb-8">Our Repositories</h2> <h2 className="text-3xl md:text-4xl font-semibold text-gray-900 mb-8">
<div className="grid grid-cols-1 md:grid-cols-2 gap-8"> Our Repositories
</h2>
<div className="grid grid-cols-1 md:grid-cols-2 gap-10">
{repos?.map((repo) => ( {repos?.map((repo) => (
<RepoCard key={repo.id} repo={repo} /> <motion.div
key={repo.id}
className="bg-white rounded-lg shadow-lg hover:shadow-xl transform hover:-translate-y-1 hover:scale-105 transition-all duration-300"
>
<RepoCard repo={repo} />
</motion.div>
))} ))}
</div> </div>
</motion.div> </motion.div>