Skip to content
Closed
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
21 changes: 11 additions & 10 deletions src/components/Team.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,6 @@ const TeamSlider = () => {
const [visibleCount, setVisibleCount] = useState(1);

const getVisibleCount = () => {
if (window.innerWidth < 640) return 1;
if (window.innerWidth < 768) return 1;
if (window.innerWidth < 1024) return 2;
if (window.innerWidth < 1280) return 3;
Expand Down Expand Up @@ -45,7 +44,7 @@ const TeamSlider = () => {
<div className="mb-10">
<h2 className="text-3xl font-bold mb-2 ml-3">Our team</h2>
<p className="text-xl text-gray-300 ml-3">
Lorem ipsum dolor sit amet, consectetur adipiscing elit.

</p>
<button className="mt-4 border border-white text-white py-2 px-4 ml-3 rounded hover:bg-white hover:text-[#00163A] transition cursor-pointer">
View all team members
Expand Down Expand Up @@ -76,20 +75,22 @@ const TeamSlider = () => {
transform: `translateX(-${currentIndex * (100 / visibleCount)}%)`,
}}
>
{teamMembers.map((member, index) => (
<div
key={index}
className="flex-shrink-0 px-2 box-border w-full sm:w-3/4 md:w-1/2 lg:w-1/3 xl:w-1/4"
>
{Array.from(new Map(teamMembers.map((m) => [m.name, m])).values()).map((member, index) => (
<div
key={index}
className="flex-shrink-0 px-2 box-border"
style={{ width: `${100 / visibleCount}%` }}>

<div className="bg-[#00163A] rounded-lg">
<img
src={member.img}
alt={member.name}
className="w-full h-68 object-cover rounded-lg"
className="w-full aspect-[5/6] object-top object-cover rounded-lg"
/>
<div className="mt-3 px-2">
<p className="font-semibold text-white">{member.name}</p>
<p className="text-sm text-gray-300">{member.title}</p>
<p className="font-semibold text-white mb-1 text-lg">{member.name}</p>
<p className="text-base text-gray-300 mb-1">{member.title}</p>
<p className="text-base text-gray-300">{member.team}</p>
<p className="text-sm text-gray-400 mt-2">
{member.description}
</p>
Expand Down
208 changes: 140 additions & 68 deletions src/config/teammate.js
Original file line number Diff line number Diff line change
@@ -1,95 +1,167 @@
// config/team.js
import Frame from "../assets/Frame 136.png";

const teamMembers = [
{
name: "Krish Agarwal1",
title: "Frontend Developer",
img: Frame,
description: "Eat good live long",

linkedin: "https://linkedin.com/in/krishagarwal",
name: "Soumya Mohanty",
title: "President",
team: "Executive Body",
img: "https://res.cloudinary.com/dm406z4pf/image/upload/v1754119368/Photo_from_Soumya_Mohanty_yv6fsd.jpg",
description: "",
linkedin: "https://www.linkedin.com/in/soumya-mohanty-me0409",
twitter: "https://x.com/home"
},
{
name: "Krish Agarwal2",
title: "Frontend Developer",
img: Frame,
description: "Eat good live long",

linkedin: "https://linkedin.com/in/krishagarwal",
name: "Pratyush Prateek Dash",
title: "Vice President",
img: "https://res.cloudinary.com/dm406z4pf/image/upload/v1754122254/pratyush__d0cpcx.jpg",
description: "",
team: "Executive Body",
linkedin: "https://www.linkedin.com/in/pratyush-prateek-dash-b8298128a/",
twitter: "https://x.com/home"
},
{
name: "Krish Agarwal3",
title: "Frontend Developer",
img: Frame,
description: "Eat good live long",

linkedin: "https://linkedin.com/in/krishagarwal",
name: "Sahil Singh",
title: "General Secretary",
img: "https://res.cloudinary.com/dm406z4pf/image/upload/v1754119373/sahil_ixmnve.jpg",
description: "",
team: "Executive Body",
linkedin: "https://linkedin.com/in/",
twitter: "https://x.com/home"
},
{
name: "Gurudutta Sutar",
title: "Treasurer",
img: "https://res.cloudinary.com/dm406z4pf/image/upload/v1754119361/Gurudutta_taaaxv.jpg",
description: "",
team: "Executive Body",
linkedin: "https://linkedin.com/in/",
twitter: "https://x.com/home"
},
{
name: "Samidha Behera",
title: "Sponsorship Head",
img: "https://res.cloudinary.com/dm406z4pf/image/upload/v1754119375/samidha_kxwkkb.jpg",
description: "",
team: "Executive Body",
linkedin: "https://www.linkedin.com/in/samidha-behera-09297828a/",
twitter: "https://x.com/home"
},
{
name: "Nikhil Kumar Dalai",
title: "PR Head",
img: "https://res.cloudinary.com/dm406z4pf/image/upload/v1754122159/nikhil_co92yf.jpg",
description: "",
team: "Executive Body",
linkedin: "https://www.linkedin.com/in/nikhil-dalai/",
twitter: "https://x.com/home"
},
{
name: "Krish Agarwal4",
title: "Frontend Developer",
img: Frame,
description: "Eat good live long",

linkedin: "https://linkedin.com/in/krishagarwal",
name: "Aaditya Sahu",
title: "Captain",
img: "https://res.cloudinary.com/dm406z4pf/image/upload/v1754117969/aaditya_kwvlki.jpg",
team: "Team Bluestreak",
description: "",
linkedin: "https://www.linkedin.com/in/aaditya-sahoo-9605a4279/",
twitter: "https://x.com/home"
},
{
name: "Krish Agarwal5",
title: "Frontend Developer",
img: Frame,
description: "Eat good live long6",

linkedin: "https://linkedin.com/in/krishagarwal",
name: "Komal Hitesh",
title: "Vice Captain",
img: "https://res.cloudinary.com/dm406z4pf/image/upload/v1754122332/komal_aucker.jpg",
description: "",
team: "Team Bluestreak",
linkedin: "https://www.linkedin.com/in/komal-hitesh-gude-a1402830a/",
twitter: "https://x.com/home"
},
{
name: "Krish Agarwal7",
title: "Frontend Developer",
img: Frame,
description: "Eat good live long",
name: "Somanchi Shanmukh",
title: "Chassis Lead",
img: "https://res.cloudinary.com/dm406z4pf/image/upload/v1754119380/shanmukh_abvqy1.jpg",
description: "",
team: "Team Bluestreak",
linkedin: "https://www.linkedin.com/in/shanmukhsomanchi/",

linkedin: "https://linkedin.com/in/krishagarwal",
},
{
name: "Krish Agarwal8",
title: "Frontend Developer",
img: Frame,
description: "Eat good live long",

linkedin: "https://linkedin.com/in/krishagarwal",
name: "Aryan Dongare",
title: "Drivetrain Lead",
img: "https://res.cloudinary.com/dm406z4pf/image/upload/v1754119212/aryan_exaoug.jpg",
description: "",
team: "Team Bluestreak",
linkedin: "https://www.linkedin.com/in/aryan-dongare-82aa40325/",
twitter: "https://x.com/home"
},
{
name: "Krish Agarwal8",
title: "Frontend Developer",
img: Frame,
description: "Eat good live long",

linkedin: "https://linkedin.com/in/krishagarwal",
name: "Mayukh Thakuria",
title: "Aero Lead",
img: "https://res.cloudinary.com/dm406z4pf/image/upload/v1754119366/mayukh_m0mqw1.jpg",
description: "",
team: "Team Bluestreak",
linkedin: "https://www.linkedin.com/in/mayukh-thakuria-509ab8306/",
twitter: "https://x.com/home"
},
{
name: "Krish Agarwal8",
title: "Frontend Developer",
img: Frame,
description: "Eat good live long",

linkedin: "https://linkedin.com/in/krishagarwal",
name: "Smruti Satabdi Prusty",
title: "Vehicle Dynamics Lead",
img: "https://res.cloudinary.com/dm406z4pf/image/upload/v1754119380/smruti_xxnpss.jpg",
description: "",
team: "Team Bluestreak",
linkedin: "https://www.linkedin.com/in/smruti-satabdi-prusty-a35a3a2a2/",
twitter: "https://x.com/home"
},
{
name: "Krish Agarwal8",
title: "Frontend Developer",
img: Frame,
description: "Eat good live long",

linkedin: "https://linkedin.com/in/krishagarwal",
name: "Chittaranjan Behera",
title: "Captain",
img: "https://res.cloudinary.com/dm406z4pf/image/upload/v1754119322/Chittaranjan_pccfs6.jpg",
description: "",
team: "Team Blueprint",
linkedin: "https://www.linkedin.com/in/chittaranjan-behera-012b64292/",
twitter: "https://x.com/home"
},
{
name: "Krish Agarwal8",
title: "Frontend Developer",
img: Frame,
description: "Eat good live long",

linkedin: "https://linkedin.com/in/krishagarwal",
name: "Dharitri",
title: "Aero Lead",
img: "https://res.cloudinary.com/dm406z4pf/image/upload/v1754119358/dharitri__sf7nbd.jpg",
description: "",
team: "Team Blueprint",
linkedin: "https://www.linkedin.com/in/dharitri-pradhan-a92b98269/",
twitter: "https://x.com/home"
},
{
name: "Nikhil Raj Kiran Sahoo",
title: "Vice Captain & Electonics Lead",
img: "https://res.cloudinary.com/dm406z4pf/image/upload/v1754122413/raju_lp7qbe.jpg",
description: "",
team: "Team Blueprint",
linkedin: "https://www.linkedin.com/in/nikhil-rajkiran-sahoo-515397277/",
twitter: "https://x.com/home"
},
{
name: "Soaham Tripathy",
title: "CAD Lead",
img: "https://res.cloudinary.com/dm406z4pf/image/upload/v1754119383/soaham__g318im.jpg",
description: "",
team: "Team Blueprint",
linkedin: "https://www.linkedin.com/in/soaham-tripathy-223582336/",
twitter: "https://x.com/home"
},
{
name: "Soaham Tripathy",
title: "Captain",
img: "https://res.cloudinary.com/dm406z4pf/image/upload/v1754119383/soaham__g318im.jpg",
description: "",
team: "Team Bluebird",
linkedin: "https://www.linkedin.com/in/soaham-tripathy-223582336/",
twitter: "https://x.com/home"
},
{
name: "Dev Soni",
title: "Code Lead",
img: "https://res.cloudinary.com/dm406z4pf/image/upload/v1754119356/dev_soni_zsexxk.jpg",
description: "",
team: "Team Bluebird",
linkedin: "https://www.linkedin.com/in/dev-soni-80020228a/",
twitter: "https://x.com/home"
},

];

export default teamMembers;
58 changes: 46 additions & 12 deletions src/pages/team/TeamPage.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -4,22 +4,25 @@ import teamMembers from "../../config/teammate";

const TeamPage = () => {
const [activeTeam, setActiveTeam] = useState("All");

const teams = ["All", "Team 1", "Team 2", "Team 3", "Team 4"];
const teams = ["All", "Executive Body","Team Bluebird", "Team Bluestreak", "Team Blueprint"];

const filteredMembers =
activeTeam === "All"
? teamMembers
: teamMembers.filter((member) => member.team === activeTeam);

activeTeam === "All"
? Array.from(
new Map(
teamMembers.map((m) => [m.name, m])
).values()
)
: teamMembers.filter((member) => member.team === activeTeam);
return (
<section className="bg-white text-black">
<div className="text-center px-4 max-w-4xl mx-auto scroll-mt-24 pt-20 lg:pt-8">
<h2 className="text-3xl sm:text-4xl font-bold text-[#021640] mb-4">
Meet Our Team
</h2>
<p className="text-gray-700 pb-6 text-lg">
Lorem ipsum dolor sit amet, consectetur adipiscing elit...

</p>
</div>

Expand All @@ -28,7 +31,7 @@ const TeamPage = () => {
<button
key={team}
onClick={() => setActiveTeam(team)}
className={`px-4 py-2 rounded-full border text-lg font-medium transition ${
className={`px-4 py-2 rounded-full border text-lg font-medium transition cursor-pointer hover:bg-blue-400 ${
activeTeam === team
? "bg-[#021640] text-white"
: "bg-white text-[#021640] border-gray-300"
Expand All @@ -38,8 +41,36 @@ const TeamPage = () => {
</button>
))}
</div>

<div className="max-w-4xl mx-auto text-lg font-bold mb-6">
{activeTeam === "Team Bluestreak" && (
<p className="text-center text-gray-600 ">
Bluestreak, a team within ASME at NIT Rourkela, is a dedicated team focused on research,
analysis, and innovation. They specialize in designing human-powered vehicles from scratch,
incorporating indigenous elements. Bluestreak actively participates in the eHPV competition at ASME Efest,
showcasing their commitment to pushing the boundaries of human-powered vehicle design and contributing to the advancement
of sustainable transportation solutions.
</p>
)}
{activeTeam === "Team Bluebird" && (
<p className="text-center text-gray-600 ">
Bluebird, a team from ASME NIT Rourkela, specializes in CAD modeling and coding for virtual competitions.
Their expertise extends to designing vehicles for diverse challenges, including autonomous vehicle competitions,
lunar lander simulations, and ocean cleanup missions. Through innovation and technical prowess, Team
Bluebird consistently participates in and excels at a variety of virtual events, showcasing their commitment
to engineering excellence and problem-solving in the digital realm.
</p>
)}
{activeTeam === "Team Blueprint" && (
<p className="text-center text-gray-600 ">
Team Blueprint, a team of ASME NIT Rourkela, engages in research, innovation, and design. They utilize
CAD software to create diverse models, subsequently manufacturing them through 3D printing technology
. The team actively participates in the IAM3D competition as part of ASME Efest, showcasing their skills
and expertise in engineering and design within the ASME community
</p>
)}
</div>
<div className="max-w-6xl mx-auto px-4 sm:px-6 lg:px-8 pb-16 grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-8">

{filteredMembers.map((member, index) => (
<div key={index} className="flex flex-col items-center text-center">
<div className="w-full max-w-xs border rounded-md overflow-hidden shadow">
Expand All @@ -53,9 +84,12 @@ const TeamPage = () => {
</div>

<div className="mt-4">
<h3 className="font-bold">{member.name || "Full name"}</h3>
<p className="text-sm text-gray-600">
{member.title || "Job title"}
<h3 className="font-bold text-xl">{member.name || "Full name"}</h3>
<p className="text-lg text-gray-600">
{member.title || ""}
</p>
<p className="text-lg text-gray-600">
{member.team || ""}
</p>
<div className="flex justify-center space-x-3 mt-2">
<a
Expand Down
Loading