Mobile-First approach using CSS Grid / Flexbox and custom properties
Design comparison
Solution retrospective
This was the hardest challenge for me. although it was similar to the previous ones.
I have a few concerns about the solution.
1- I used a picture element to pick the right image based on the viewport size. and css blend modes to apply the effect on the image. I'm not sure If I should have used css background images and linear gradients instead. what do you think?
2- I'm not sure about how I structured the html and css for this project. let me know if you like / dislike the structure of the code ?
3- I have doubts on how I handled the responsiveness and fear that my design looks bad on some screen sizes. let me know if that is the case for you.
Community feedback
- @hitmorecodePosted 9 months ago
Nice well done, good try. Your page needs to be worked on to make it look good. I have a repository for this exercise, it's already a mobile first. It's a simple repository it already has the basic html and css. See if you can take it from here and create a finished product. Give it a try and if you have any questions let me know. I'll try to reply as soon as possible.
Stats preview card component repository
Keep coding
0
Please log in to post a comment
Log in with GitHub
Join 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