Design comparison
SolutionDesign
Solution retrospective
Mainly focused on Desktop view, stile learning shifting to mobile
Community feedback
- @matt-o-westPosted about 2 years ago
Hello! Nice job finishing this! A couple suggestions for you:
- when you have a layout like this, grid is going to make your life a lot easier; currently you're using flex so depending on the users viewport the layout gets wonky (although it looks good in your screenshot); for instance, in my full screen the cards are 5 in the top row 1 on the bottom row
- you have separate classes for each card, but you really only need one card class and then id attributes for each type of card, that will drastically reduce the amount of CSS you need to write if you apply the principle (specificity) everywhere
- I would try writing media queries for your tablet/mobile layouts and see how polished you can get them, maybe on your next project see how clean you can get every type of layout. It's hard!
- Next project (or if you want to improve this one), see if you can import and manipulate the JSON data provided, it will give you good practice display data and working with objects
Hope this helps!
Marked as helpful1
Please log in to post a comment
Log in with GitHubJoin our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord