Skip to content

Commit 3a31a9c

Browse files
austinchan3678austinchan3678
committed
card click website
1 parent f5a7f1a commit 3a31a9c

3 files changed

Lines changed: 60 additions & 39 deletions

File tree

‎public/team/lead-images/26/alyssa-story-26.jpg‎

-29 Bytes
Loading

‎src/app/team/page.tsx‎

Lines changed: 31 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -85,42 +85,49 @@ export default function TeamPage() {
8585
title="President"
8686
titleColor="text-gr-pink"
8787
image="team/lead-images/26/alex-fu-26.jpg"
88+
website="https://www.linkedin.com/in/alexanderjfu1/"
8889
/>
8990
<TeamCard
9091
name="Manas Bhargavan"
9192
title="Internal VP"
9293
titleColor="text-gr-pink"
9394
image="team/lead-images/26/manas-bhargavan-26.jpg"
95+
website="https://www.linkedin.com/in/manasija-bhargavan-9b7798292/"
9496
/>
9597
<TeamCard
9698
name="Jackson Tiengtum"
9799
title="External VP"
98100
titleColor="text-gr-pink"
99101
image="team/lead-images/26/jackson-tiengtum-26.jpg"
102+
website="https://www.linkedin.com/in/jtiengtum/"
100103
/>
101104
<TeamCard
102105
name="Jeremy Sevilla"
103106
title="Secretary"
104107
titleColor="text-gr-pink"
105108
image="team/lead-images/26/jeremy-sevilla-26.jpg"
109+
website="https://www.linkedin.com/in/jeremy-sevilla/"
106110
/>
107111
<TeamCard
108112
name="Zachary Rogers"
109113
title="Treasurer"
110114
titleColor="text-gr-pink"
111115
image="team/lead-images/26/zachary-rogers-26.jpg"
116+
website="https://www.linkedin.com/in/zachary-rogers-ucsb/"
112117
/>
113118
<TeamCard
114119
name="Colin Kwok"
115120
title="Mechanical TD"
116121
titleColor="text-gr-pink"
117122
image="team/lead-images/26/colin_kwok.jpg"
123+
website="https://www.linkedin.com/in/colin-kwok-b8419a240/"
118124
/>
119125
<TeamCard
120126
name="Ryan Nguyen"
121127
title="Electrical TD"
122128
titleColor="text-gr-pink"
123129
image="team/lead-images/26/ryan_nguyen.jpg"
130+
website="https://www.linkedin.com/in/ryan-nguyen-289994254/"
124131
/>
125132
</div>
126133
</div>
@@ -136,102 +143,119 @@ export default function TeamPage() {
136143
title="Drivetrain Lead"
137144
titleColor="text-gr-purple"
138145
image="team/lead-images/26/satvik-subbaraman-26.jpg"
146+
website="https://www.linkedin.com/in/satvik-subbaraman/"
139147
/>
140148
<TeamCard
141149
name="Brian Tham"
142150
title="Drivetrain Lead"
143151
titleColor="text-gr-purple"
144152
image="team/lead-images/26/brian-tham-26.jpg"
153+
website="https://www.linkedin.com/in/brianrtham/"
145154
/>
146155
<TeamCard
147156
name="Koa Shen"
148157
title="Chassis Lead"
149158
titleColor="text-gr-purple"
150159
image="team/lead-images/26/koa-shen-26.jpg"
160+
website="https://www.linkedin.com/in/koa-shen/"
151161
/>
152162
<TeamCard
153163
name="Ava Tran"
154164
title="Chassis Lead"
155165
titleColor="text-gr-purple"
156166
image="team/lead-images/26/ava-tran-26.jpg"
167+
website="https://www.linkedin.com/in/avatran/"
157168
/>
158169
<TeamCard
159170
name="Thomas Yu"
160171
title="Systems Lead"
161172
titleColor="text-gr-purple"
162173
image="team/lead-images/26/thomas-yu-26.jpg"
174+
website="https://www.linkedin.com/m/in/thomasyu3/"
163175
/>
164176
<TeamCard
165177
name="Diego Vasquez"
166178
title="Fabrication Lead"
167179
titleColor="text-gr-purple"
168180
image="team/lead-images/26/diego-vasquez-26.jpg"
181+
website="https://oropeza.materials.ucsb.edu/people/diego-vasquez"
169182
/>
170183
<TeamCard
171184
name="Curtis Butsko"
172185
title="Suspension Lead"
173186
titleColor="text-gr-purple"
174187
image="team/lead-images/26/curtis-butsko-26.jpg"
188+
website="https://www.linkedin.com/in/curtisbutsko/"
175189
/>
176190
<TeamCard
177191
name="Forrest Drury"
178192
title="Aerodynamics Lead"
179193
titleColor="text-gr-purple"
180194
image="team/lead-images/26/forrest-drury-26.jpg"
195+
website="https://www.linkedin.com/in/forrest-drury-734218335/"
181196
/>
182197
<TeamCard
183198
name="Kelvin Quach"
184199
title="Aerodynamics Lead"
185200
titleColor="text-gr-purple"
186201
image="team/lead-images/26/kelvin-quach-26.jpg"
202+
website="https://www.linkedin.com/in/kelvin-quach-095764291/"
187203
/>
188204
<TeamCard
189205
name="Owen Liu"
190206
title="High Voltage Lead"
191207
titleColor="text-gr-purple"
192208
image="team/lead-images/26/owen-liu-26.jpg"
209+
website="https://www.linkedin.com/in/yandong-liu-050032255/"
193210
/>
194211
<TeamCard
195212
name="Vamsi Vempati"
196213
title="High Voltage Lead"
197214
titleColor="text-gr-purple"
198215
image="team/lead-images/26/vamsi-vempati-26.jpg"
216+
website="https://www.linkedin.com/in/vamsivempati79/"
199217
/>
200218
<TeamCard
201219
name="Vin Shin"
202220
title="Low Voltage Lead"
203221
titleColor="text-gr-purple"
204222
image="team/lead-images/26/vin-shin-26.jpg"
223+
website="https://www.linkedin.com/in/vinshin623/"
205224
/>
206225
<TeamCard
207226
name="Andrey Otvagin"
208227
title="Low Voltage Lead"
209228
titleColor="text-gr-purple"
210229
image="team/lead-images/26/andrey-otvagin-26.jpg"
230+
website="https://www.linkedin.com/in/anotv/"
211231
/>
212232
<TeamCard
213233
name="Daniel Hansen"
214234
title="Firmware Lead"
215235
titleColor="text-gr-purple"
216236
image="team/lead-images/26/daniel-hansen-26.jpg"
237+
website="https://www.linkedin.com/in/daniel-hansen-cs/"
217238
/>
218239
<TeamCard
219240
name="Jacob Jurek"
220241
title="Data Lead"
221242
titleColor="text-gr-purple"
222243
image="team/lead-images/26/jacob-jurek-26.jpg"
244+
website="https://www.linkedin.com/in/jacob-jurek/"
223245
/>
224246
<TeamCard
225247
name="Austin Chan"
226248
title="DevOps Lead"
227249
titleColor="text-gr-purple"
228250
image="team/lead-images/26/austin-chan-26.jpg"
251+
website="https://www.linkedin.com/in/austinchan2/"
229252
/>
230253
<TeamCard
231254
name="Alyssa Story"
232255
title="Business Lead"
233256
titleColor="text-gr-purple"
234257
image="team/lead-images/26/alyssa-story-26.jpg"
258+
website="https://www.linkedin.com/in/alyssa-story-76353a373/"
235259
/>
236260
</div>
237261
</div>
@@ -241,24 +265,13 @@ export default function TeamPage() {
241265
<h1 className="mb-16 mt-16 text-center lg:ml-64 lg:mr-64">
242266
FACULTY ADVISORS
243267
</h1>
244-
<div className="flex flex-wrap items-stretch justify-center lg:ml-16 lg:mr-16">
245-
<div
246-
onClick={() =>
247-
window.open(
248-
"https://me.ucsb.edu/index.php/people/kirk-fields",
249-
"_blank",
250-
)
251-
}
252-
className="cursor-pointer transition-transform duration-200 hover:scale-105"
253-
>
254-
<TeamCard
255-
name="Kirk Fields"
256-
title="UCSB R&D Engineer"
257-
titleColor="text-gr-purple"
258-
image="team/lead-images/26/kirk-fields-26.jpg"
259-
/>
260-
</div>
261-
</div>
268+
<TeamCard
269+
name="Kirk Fields"
270+
title="UCSB R&D Engineer"
271+
titleColor="text-gr-purple"
272+
image="team/lead-images/26/kirk-fields-26.jpg"
273+
website="https://me.ucsb.edu/index.php/people/kirk-fields"
274+
/>
262275
</div>
263276
</div>
264277
<div

‎src/components/team-card.tsx‎

Lines changed: 29 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -11,34 +11,42 @@ const TeamCard = ({
1111
title,
1212
titleColor,
1313
image,
14+
website,
1415
}: {
1516
name: string;
1617
title: string;
1718
titleColor: string;
1819
image?: string;
20+
website: string;
1921
}) => {
2022
return (
21-
<Card className="m-4 flex w-64 flex-col items-center justify-between">
22-
<CardHeader className="ml-8 mr-8 items-center">
23-
<div className="mb-4 h-32 w-32 overflow-hidden rounded-full bg-gray-300 md:h-40 md:w-40 lg:h-44 lg:w-44">
24-
<img
25-
src={image || "team/lead-images/placeholder-profile.png"}
26-
alt={`${name}'s picture`}
27-
className="h-full w-full object-cover"
28-
/>
29-
</div>
30-
<CardTitle className="text-center">
31-
<h2 className="text-lg md:text-xl lg:text-2xl">{name}</h2>
32-
</CardTitle>
33-
</CardHeader>
34-
<CardContent>
35-
<p
36-
className={`text-center ${titleColor} text-sm md:text-base lg:text-lg`}
37-
>
38-
{title}
39-
</p>
40-
</CardContent>
41-
</Card>
23+
<a
24+
href={website}
25+
target="_blank"
26+
className="cursor-pointer transition-transform duration-200 hover:scale-105"
27+
>
28+
<Card className="m-4 flex w-64 flex-col items-center justify-between">
29+
<CardHeader className="ml-8 mr-8 items-center">
30+
<div className="mb-4 h-32 w-32 overflow-hidden rounded-full bg-gray-300 md:h-40 md:w-40 lg:h-44 lg:w-44">
31+
<img
32+
src={image || "team/lead-images/placeholder-profile.png"}
33+
alt={`${name}'s picture`}
34+
className="h-full w-full object-cover"
35+
/>
36+
</div>
37+
<CardTitle className="text-center">
38+
<h2 className="text-lg md:text-xl lg:text-2xl">{name}</h2>
39+
</CardTitle>
40+
</CardHeader>
41+
<CardContent>
42+
<p
43+
className={`text-center ${titleColor} text-sm md:text-base lg:text-lg`}
44+
>
45+
{title}
46+
</p>
47+
</CardContent>
48+
</Card>
49+
</a>
4250
);
4351
};
4452

0 commit comments

Comments
 (0)