Design comparison
Solution retrospective
Hi,
Another solution from my side. I tried to solve it as easily as possible. For selectors, I mostly used tags themselves, on the contrary, I named classes with and without BEM methodology. I used relative sizes/distances where I knew/could.
I would appreciate any comments.
Community feedback
- @Nadine-GreenPosted almost 2 years ago
HEY FRANCI!
I really like your design however I noticed that none of the active states were included, just thought I would inform you.
HOPE I COULD BE OF HELP :)
HAPPY CODING!
Marked as helpful0@francimelinkPosted almost 2 years ago@Nadine-Green
Thank you.
You are right, they are not included. Thanks for the warning. Totally forgot about active states.
New version deployed (with active states).
0 - @HassiaiPosted almost 2 years ago
Use the colors that were given in the styleguide.md. Give the body a background-color: hsl() and change the background size from cover to contain.
Use rem or em as unit for the padding, margin, width and preferably rem for the font-size for more on this watch this https://youtu.be/N5wpD9Ov_To
In the media query you forgot to give the body, a background-color, and a different background-image with background-repeat no-repeat and background-size of contain.
Hope am helpful. HAPPY CODING
0@francimelinkPosted almost 2 years ago@Hassiai
You are. :D
I didn't really use colors from style-guide.md. I copied the colors from Figma. Thanks for the video link. I'll take a look at it.
Thank you for help.
0
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