A solution provided by jefflangtech for the Product preview card component challenge on Frontend Mentor.
I've been away from any sort of writing or coding for a while, and I wanted to take a baby-step back in to see where I'm at. I really enjoyed knocking this out because it, frankly, was pretty enjoyable just to put all the pieces together, and I realized I was able to pick things back up again pretty quickly.
This is a pretty standard product card with 2 sizes, one for desktop and one for mobile. Users will be able to see a different size and layout based on the screen size, as well as a basic interactive button.
- Solution URL: Front End Mentor Solution
- Live Site URL: Github Sites
HTML & CSS
This was a re-intro, refresher, to see what I had lost from my long break. I can confirm:
- Cheat sheets are great
- It doesn't take that long to pick something back up again, and remembering the core concepts of how something should work is more important than the specifics
- I like flexbox
- Using FIGMA files was super helpful when crafting a super specific process to set the layout
- Kevin Powell - As always, the GOAT of CSS.
- Website - JeffLangTech
- Frontend Mentor - @jefflangtech