Social Links Profile Card

What are you most proud of, and what would you do differently next time?

1. Mobile-First Development

• Started with mobile layout and progressively enhanced for larger screens
• Used CSS custom properties for responsive design

:root {
  --spacing-100: 8px;
  --spacing-300: 24px;
}

2. BEM Methodology

• Implemented BEM naming convention for better CSS organization
• Created modular and reusable components

  Jessica Randall

3. CSS Transitions & Hover Effects

• Added smooth transitions for better UX
• Implemented hover states with transforms

.profile-card__link {
  transition: all 0.3s ease;
}

.profile-card__link:hover {
  transform: translateY(-2px);
}

4. Accessibility Improvements

• Used semantic HTML elements
• Added proper alt text for images
• Ensured proper color contrast