diana.dolgolyova/blackheart-website
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style: update team cards layout and Instagram links

Browse Source 
Remove role text, add clickable Instagram usernames with icon,
and align card heights consistently.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Diana Dolgolyova
2026-03-09 21:48:48 +03:00
parent 9f1697fd93
commit dcb31415bc
1 changed files with 4 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
src/components/sections/Team.tsx
View File

@@ -17,7 +17,7 @@ export function Team() {
<div className="mt-12 grid gap-8 sm:grid-cols-2 lg:grid-cols-3"> <div className="mt-12 grid gap-8 sm:grid-cols-2 lg:grid-cols-3">
{team.members.map((member, i) => ( {team.members.map((member, i) => (
<Reveal key={i}> <Reveal key={i}>
<div className="card text-center"> <div className="card flex h-full flex-col items-center text-center">
<div className="mx-auto h-32 w-32 overflow-hidden rounded-full"> <div className="mx-auto h-32 w-32 overflow-hidden rounded-full">
<Image <Image
src={member.image} src={member.image}
@@ -28,18 +28,15 @@ export function Team() {
/> />
</div> </div>
<h3 className="heading-text mt-4 text-lg font-semibold">{member.name}</h3> <h3 className="heading-text mt-4 text-lg font-semibold">{member.name}</h3>
<p className="muted-text mt-1 text-sm">{member.role}</p>
{member.instagram && ( {member.instagram && (
<a <a
href={member.instagram} href={member.instagram}
target="_blank" target="_blank"
rel="noopener noreferrer" rel="noopener noreferrer"
className="nav-link mt-2 inline-flex items-center gap-1 text-sm" className="nav-link mt-1 inline-flex gap-1.5 text-sm"
> >
<Instagram size={14} /> <Instagram size={14} className="shrink-0 mt-[3px]" />
<span> <span>{member.instagram.split("/").filter(Boolean).pop()}</span>
@{member.instagram.split("/").filter(Boolean).pop()}
</span>
</a> </a>
)} )}
</div> </div>