export function PersonCard()

in src/components/Team/PersonCard.tsx [24:45]


export function PersonCard(props: { info: ContributorInfo}) {
    const { info } = props;
    const { realName, githubId, githubLink, avatar, date } = info;
    return (
      <a
        className="py-[25px] no-underline hover:no-underline px-4 rounded-[10px] transition bg-white  shadow-lower hover:shadow-high flex items-center text-neutral-600 hover:text-primary-500"
        href={githubLink}
        target="_blank"
      >
        <img
          className="w-[100px] h-[100px] mr-4 rounded-full bg-primary-500 shrink-0 uppercase flex justify-center items-center overflow-hidden text-white"
          src={avatar}
          alt={githubId}
        />
        <div className="flex flex-col space-y-1 h-fit">
          <span className="text-heading4">{realName}</span>
          <span className="text-label12 text-neutral-500">{githubId}</span>
          { date && <span className="text-body-sm text-neutral-500">{dateFormatter(date)}</span>}
        </div>
      </a>
    );
  }