Snigdha-OS/Snigdha-OS.github.io
2
0
Fork 0
mirror of https://github.com/Snigdha-OS/Snigdha-OS.github.io.git synced 2025-12-07 07:03:51 +01:00
Code Issues Actions Packages Projects Releases Wiki Activity

🐛 fix: directory and broken ui

Browse Source
This commit is contained in:
RiO
2024-12-25 06:56:31 +05:30
parent 4a187e747c
commit e34efcc59d
1 changed files with 26 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

34
src/pages/Developers.tsx
View File

@@ -1,10 +1,10 @@
import { useQueries, useQuery } from '@tanstack/react-query'; import { useQueries, useQuery } from '@tanstack/react-query';
import { motion } from 'framer-motion'; import { motion } from 'framer-motion';
import { Loader2 } from 'lucide-react'; import { Loader2 } from 'lucide-react';
import { TeamMemberCard } from '@/components/developers/TeamMemberCard'; import { TeamMemberCard } from '../components/developers/TeamMemberCard';
import { RepoCard } from '@/components/developers/RepoCard'; import { RepoCard } from '../components/developers/RepoCard';
import { fetchGithubUser, fetchOrgRepos } from '@/lib/github'; import { fetchGithubUser, fetchOrgRepos } from '../lib/github';
import { teamMembers } from '@/data/team'; import { teamMembers } from '../data/team';
export default function Developers() { export default function Developers() {
const queries = useQueries({ const queries = useQueries({
@@ -39,40 +39,48 @@ export default function Developers() {
} }
return ( return (
<div className="py-12"> <div className="py-12 bg-gray-50">
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<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" className="text-center mb-16"
> >
<h1 className="text-4xl font-bold text-gray-900">Our Team</h1> <h1 className="text-4xl font-extrabold text-gray-900">Meet Our Team</h1>
<p className="mt-4 text-lg text-gray-600"> <p className="mt-4 text-lg text-gray-600">
Meet the dedicated team behind Snigdha OS The amazing developers behind Snigdha OS
</p> </p>
</motion.div> </motion.div>
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6 mb-16"> <div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-8 mb-16 justify-center items-center">
{queries.map((query, index) => ( {queries.map((query, index) => (
query.data && ( query.data && (
<TeamMemberCard <motion.div
key={query.data.login} key={query.data.login}
initial={{ opacity: 0, scale: 0.95 }}
animate={{ opacity: 1, scale: 1 }}
transition={{ delay: index * 0.2 }}
className="flex justify-center items-center"
>
<TeamMemberCard
user={query.data} user={query.data}
role={teamMembers[index].role} role={teamMembers[index].role}
description={teamMembers[index].description} description={teamMembers[index].description}
/> />
</motion.div>
) )
))} ))}
</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.2 }}
className="mt-16" className="mt-16 text-center"
> >
<h2 className="text-3xl font-bold text-gray-900 mb-8">Our Repositories</h2> <h2 className="text-3xl font-semibold text-gray-900 mb-8">Our Repositories</h2>
<div className="grid grid-cols-1 md:grid-cols-2 gap-6"> <div className="grid grid-cols-1 md:grid-cols-2 gap-8">
{repos?.map((repo) => ( {repos?.map((repo) => (
<RepoCard key={repo.id} repo={repo} /> <RepoCard key={repo.id} repo={repo} />
))} ))}