Skip to content

Commit

Permalink
src/pages/Team.js: Add LinkedIn and website links for members and adv…
Browse files Browse the repository at this point in the history 
…isors
  • Loading branch information
@cbrxyz
cbrxyz committed Oct 28, 2024
1 parent 044a566 commit bd6a3a2
Show file tree
Hide file tree
Showing 4 changed files with 215 additions and 16 deletions.
88 changes: 88 additions & 0 deletions package-lock.json
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

4 changes: 4 additions & 0 deletions package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,10 @@
"author": "",
"license": "ISC",
"dependencies": {
"@fortawesome/fontawesome-svg-core": "^6.6.0",
"@fortawesome/free-brands-svg-icons": "^6.6.0",
"@fortawesome/free-solid-svg-icons": "^6.6.0",
"@fortawesome/react-fontawesome": "^0.2.2",
"react": "^18.3.1",
"react-dom": "^18.3.1"
},
Expand Down
17 changes: 16 additions & 1 deletion src/components/MemberCard.js
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,9 @@
import React from 'react';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { faLinkedin } from '@fortawesome/free-brands-svg-icons';
import { faGlobe } from '@fortawesome/free-solid-svg-icons';

function MemberCard({ name, role, image, degree, graduationYear }) {
function MemberCard({ name, role, image, degree, graduationYear, linkedIn, website }) {
return (
<div className="bg-white rounded-lg shadow-lg p-3">
<div className="w-full h-48 overflow-hidden rounded-lg relative">
Expand All @@ -11,6 +14,18 @@ function MemberCard({ name, role, image, degree, graduationYear }) {
<p className="text-gray-600">{role}</p>
<p className="text-gray-500 text-sm mt-1">{degree}</p>
<p className="text-gray-500 text-sm mt-1">{graduationYear}</p>
<div className="flex justify-center mt-2 space-x-4">
{linkedIn && (
<a href={`https://linkedin.com/in/${linkedIn}`} target="_blank" rel="noopener noreferrer" aria-label="LinkedIn">
<FontAwesomeIcon icon={faLinkedin} className="text-blue-600 hover:text-blue-800 text-2xl" />
</a>
)}
{website && (
<a href={website} target="_blank" rel="noopener noreferrer" aria-label="Website">
<FontAwesomeIcon icon={faGlobe} className="text-gray-600 hover:text-gray-800 text-2xl" />
</a>
)}
</div>
</div>
</div>
);
Expand Down
122 changes: 107 additions & 15 deletions src/pages/Team.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,16 +8,83 @@ import advisorImages from "../assets/advisors";

const Leadership = () => {
const members = [
{ image: memberImages["cameron.jpeg"], name: 'Cameron Brown', role: 'Team Lead', degree: 'BS, Computer Science', graduationYear: 'Spring 2025'},
{ image: memberImages["lorant.png"], name: 'Lorant Domokos', role: 'Mechanical Lead', degree: 'BS, Mechanical Engineering', graduationYear: 'Spring 2025'},
{ image: memberImages["daniel.jpeg"], name: 'Daniel Parra', role: 'Software Lead', degree: 'BS, Computer Science', graduationYear: 'Spring 2026'},
{ image: memberImages["adrian.png"], name: 'Adrian Fernandez', role: 'Electrical Lead', degree: 'BS, Electrical Engineering', graduationYear: 'Fall 2024'},
{ image: memberImages["adam_h.png"], name: 'Adam Hamdan', role: 'Mechanical Lead, Operations', degree: 'BS, Mechanical Engineering', graduationYear: 'Spring 2026'},
{ image: memberImages["keith.jpeg"], name: 'Keith Khadar', role: 'Software Lead', degree: 'BS, Computer Engineering', graduationYear: 'Spring 2025' },
{ image: memberImages["kayleigh.jpg"], name: 'Kayleigh Beron', role: 'Electrical Lead, Operations', degree: 'BS, Computer Engineering', graduationYear: 'Fall 2024'},
{ image: memberImages["adam_m.jpeg"], name: 'Adam McAleer', role: 'Mechanical Lead, Mechanisms', degree: 'BS, Mechanical Engineering', graduationYear: 'Fall 2024'},
{ image: memberImages["andrew.png"], name: 'Andrew Knee', role: 'Software Lead', degree: 'MS, Computer Science', graduationYear: 'Fall 2024'},
{ image: memberImages["lester.jpg"], name: 'Lester Bonilla', role: 'Drone Lead', degree: 'BS, Computer Engineering', graduationYear: 'Spring 2025'},
{
image: memberImages["cameron.jpeg"],
name: "Cameron Brown",
role: "Team Lead",
degree: "BS, Computer Science",
graduationYear: "Spring 2025",
linkedIn: "cameron-brown37",
website: "https://cbrxyz.com",
},
{
image: memberImages["lorant.png"],
name: "Lorant Domokos",
role: "Mechanical Lead",
degree: "BS, Mechanical Engineering",
graduationYear: "Spring 2025",
linkedIn: "lorant-domokos-849094244",
},
{ image: memberImages["daniel.jpeg"], name: "Daniel Parra",
role: "Software Lead",
degree: "BS, Computer Science",
graduationYear: "Spring 2026",
linkedIn: "daniparr",
},
{
image: memberImages["adrian.png"],
name: "Adrian Fernandez",
role: "Electrical Lead",
degree: "BS, Electrical Engineering",
graduationYear: "Fall 2024",
linkedIn: "adrianfernandez23",
},
{
image: memberImages["adam_h.png"],
name: "Adam Hamdan",
role: "Mechanical Lead, Operations",
degree: "BS, Mechanical Engineering",
graduationYear: "Spring 2026",
},
{
image: memberImages["keith.jpeg"],
name: "Keith Khadar",
role: "Software Lead",
degree: "BS, Computer Engineering",
graduationYear: "Spring 2025",
linkedIn: "keith-khadar"
},
{
image: memberImages["kayleigh.jpg"],
name: "Kayleigh Beron",
role: "Electrical Lead, Operations",
degree: "BS, Computer Engineering",
graduationYear: "Fall 2024",
linkedIn: "kayleigh-beron"
},
{
image: memberImages["adam_m.jpeg"],
name: "Adam McAleer",
role: "Mechanical Lead, Mechanisms",
degree: "BS, Mechanical Engineering",
graduationYear: "Fall 2024",
linkedIn: "adam-mcaleer",
},
{
image: memberImages["andrew.png"],
name: "Andrew Knee",
role: "Software Lead",
degree: "MS, Computer Science",
graduationYear: "Fall 2024",
linkedIn: "andrew-knee-j",
},
{
image: memberImages["lester.jpg"],
name: "Lester Bonilla",
role: "Drone Lead",
degree: "BS, Computer Engineering",
graduationYear: "Spring 2025",
},
];

return (
Expand All @@ -34,6 +101,8 @@ const Leadership = () => {
role={member.role}
degree={member.degree}
graduationYear={member.graduationYear}
linkedIn={member.linkedIn}
website={member.website}
/>
))}
</div>
Expand All @@ -43,9 +112,25 @@ const Leadership = () => {

const Advisors = () => {
const advisors = [
{ image: advisorImages["schwartz.jpg"], name: 'Dr. Eric Schwartz', role: 'MIL Director' },
{ image: advisorImages["crane.jpg"], name: 'Dr. Carl Crane', role: 'Professor, MAE' },
{ image: advisorImages["andres.png"], name: 'Andres Pulido', role: 'PhD Candidate, MAE' },
{
image: advisorImages["schwartz.jpg"],
name: "Dr. Eric Schwartz",
role: "MIL Director",
linkedIn: "eric-schwartz-4231924",
},
{
image: advisorImages["crane.jpg"],
name: "Dr. Carl Crane",
role: "Professor, MAE",
linkedIn: "carl-crane-47839574"
},
{
image: advisorImages["andres.png"],
name: "Andres Pulido",
role: "PhD Candidate, MAE",
linkedIn: "andres-a-pulido",
website: "https://andrespulido8.github.io"
},
];

return (
Expand All @@ -55,7 +140,14 @@ const Advisors = () => {
</div>
<div className="grid grid-cols-1 sm:grid-cols-3 lg:grid-cols-5 gap-6">
{advisors.map((member, index) => (
<MemberCard key={index} image={member.image} name={member.name} role={member.role} />
<MemberCard
key={index}
image={member.image}
name={member.name}
role={member.role}
linkedIn={member.linkedIn}
website={member.website}
/>
))}
</div>
</section>
Expand All @@ -66,7 +158,7 @@ const TeamPage = () => {
return (
<div className="bg-gray-300" style={{ fontFamily: "Inter, sans-serif" }}>
<div className="relative">
<Header title="Meet the Team" subTitle="2024 Season"/>
<Header title="Meet the Team" subTitle="2024 Season" />
</div>
<Leadership />
<Advisors />
Expand Down

0 comments on commit bd6a3a2

Please sign in to comment.