Social Links Profile, Bootstrap grid with custom content

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

I’m most proud of how the button hover effect turned out using pseudo elements to recreate that smooth sliding fill exactly as in the Figma spec and of setting html { font-size: 62.5%; } so I can think in 1 rem = 10 px across my whole site for easy, consistent sizing. Next time I’d layer in richer semantic HTML (like <article> and <nav>), switch to a fixed type scale instead of fluid typography for predictability, and swap Bootstrap for a custom grid so I hit those 375 px/1440 px artboard widths exactly.

What challenges did you encounter, and how did you overcome them?

I hit a snag getting the sliding‐fill hover to layer correctly fixing it with a z-index: 0 stacking context and overflow: hidden made the pseudo-element sit above the background. I also overrode Bootstrap’s gutter and column settings to center the card at the exact 340 px/375 px widths.

What specific areas of your project would you like help with?

I don’t have any major pain points right now everything’s working as expected. But I’d love to hear what people think about using html { font-size: 62.5%; } (so 1 rem = 10 px) for consistent sizing. Any pros, cons, or alternative approaches?