feat: add shimmer loading skeletons for all pages (Closes #827) [fj4WqyCCw3C5ShR1RfB7MoBPTpkRrBFYP1uT35g3MvT]

[waterWang]

Description

Add shimmer loading skeleton animations for all data-loading states across the site. Replaces the existing basic spinner/"Loading..." text with properly shaped skeleton components that match the layout of actual content.

Changes

• New Skeleton component (frontend/src/components/ui/Skeleton.tsx):

  • SkeletonBlock — base shimmer block with gradient animation
  • SkeletonText — text line placeholder
  • SkeletonAvatar — circular avatar placeholder
  • BountyCardSkeleton — matches the BountyCard layout (repo, title, skills, reward, meta)
  • BountyDetailSkeleton — matches the BountyDetail page layout
  • LeaderboardRowSkeleton — matches the leaderboard table rows
  • PodiumCardSkeleton — matches the podium cards
  • ProfileDashboardSkeleton — matches the profile dashboard layout

• Updated pages:

  • BountyGrid.tsx — replaced simple shimmer blocks with BountyCardSkeleton
  • FeaturedBounties.tsx — replaced animate-pulse with BountyCardSkeleton
  • BountyDetailPage.tsx — replaced basic shimmer blocks with BountyDetailSkeleton
  • LeaderboardPage.tsx — replaced spinner with podium + table row skeletons
  • ProfileDashboard.tsx — replaced "Loading..." text with ProfileDashboardSkeleton

Shimmer Animation

Uses the existing animate-shimmer CSS animation defined in the design system (gradient sweep over 2s with infinite loop).

Acceptance Criteria

• Skeletons visible on all pages during data loading
• Match the layout of actual content
• Smooth transition when data loads