Design comparison
SolutionDesign
Solution retrospective
What are you most proud of, and what would you do differently next time?
- One opportunity to improve is that the final design of the mobile preview is not similar to the original design, for instance, the "Preparation time" section.
- Overall, the spacing around the bullet points could also be improved drastically.
- There were a few challenges that I encountered, one of them was using classes logically in my code. I have been struggling to use classes efficiently, especially in my CSS code.
- On one specific issue, I would really appreciate some help from the community. I was not able to make the color of the bullet points(dots) same as that of their heading.
- For instance, the color of the heading "Ingredients", and its bullet points(dots) should have been the same.
Community feedback
- @manav-sharma69Posted 6 months ago
Hi! You can add colors to bullet points by using the
::markerpseudo-element.Here's the MDN link:
::markerHope this helps!
Marked as helpful0@undrthegraveyardPosted 6 months ago@manav-sharma69
Hey! Ahh, I see. I am still getting used to the concept of pseudo-elements. ChatGPT gave some long complex code just to solve this one simple issue, could have just said pseudo-element instead, hehe.
Thank you so much for your help buddy! 😄
1
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