Submitted
Social profile links widget
- HTML
- CSS
What are you most proud of, and what would you do differently next time?
I was more selective in my markup and CSS style rules for this one. I treated it more as a self-contained widget with the assumption that other site-wide rules (resets, fonts, margins, etc.) were already in play. I also set up my root style variables to be more modular so if anyone wants to swap out the color palette for a different brand/theme it's super simple.
What challenges did you encounter, and how did you overcome them?
The CSS was done in a bit of a windshield wiper method, refactoring the styles and dependencies as I went. The only real challenges were getting the image to the right size (a lot of trial and error eyeballing), and centering the social link buttons without making every nested div a flexbox.
What specific areas of your project would you like help with?
I'm still trying to get easily responsive font proportions down pat. Ideally there would be one base font for the entire widget that all elements would base their font size off of. That way if this ever needs to resize for a different design layout it only takes one line of CSS to change it all.
If anybody knows of a simple and straightforward method of handling this I'd be very grateful to know what it is.