feat: implement MemberCard component (issue#35)

[IshimweIsaac]

Overview

This PR implements the Member Card component for the Members directory as outlined in Issue #35. It closely adheres to the provided Figma mockups and visual design guidelines.

Closes #35

What was done

• Component Created: Built components/members/member-card.tsx.
• Figma Alignment:
  • Implemented the square avatar layout (w-16 h-16) with grayscale applied.
  • Set the exact typography hierarchy: text-[24px] for the name, 16px for the title, and tracking-wider cyan monospace (text-[12px]) for the @handle.
  • Styled the STACK badges dynamically, giving React-related tech a highlighted cyan background (bg-primary-50 text-primary-700) and standard tech a neutral background (bg-neutral-50 text-neutral-600), perfectly matching the mockup colors.
  • Refined the terminal button to be a minimalist icon (18x18px) that darkens on hover, bypassing the default button borders.
• Component Constraints:
  • Bypassed the global CSS reset (border-radius: 0 !important;) on the availability indicator dots and the top contribution bullet points to enforce perfect circles.

  ---

Screenshots

(Desktop view showing layout, typography, and precise status colors)

Notes for Reviewer

• The component was tested within app/(public)/members/page.tsx locally to verify layout and sizing, but page.tsx has been kept clean in this branch to avoid pushing temporary mock data.