Pod landing page [harder than I thought!][html/css form validation]
Design comparison
Solution retrospective
Hi everyone :)
I am amazed at how varied all these challenges can be, hence pretty much always making us work on different and new things. On completing this challenge I would specifically like to thank Frontend Mentor for the endless opportunity to practice, train and get better.
More context on the github repo.
My questions are:
- On the subject of modifying the color of svg elements without having to copy paste the whole svg code into html markup in order to access the
fill
property with css, that I find cumbersome : do you have any resources on the subject that could enlighten me. - Also, I did get through quickly on the matter of styling the background image on mobile view and did not quite matched the expected design with my use of
background-blend-mode
property. Any advice on that part?
Thanks!
Community feedback
- @fileccPosted over 1 year ago
Ehy, hi and congratulations for completing this challenge!
It looks really great! My suggestion for the SVG color, via css are:
- this codepen that need a color input in HEX and can produce a filter property for you, so you don’t need to insert the SVG in you html, you can simply import as an image and then target it in you cas with the property the codepen gave you.
Hope it helps!!
Cheers Fil :)
0 - @visualdennissPosted over 1 year ago
Your submission looks great! Almost identical to the solution screenshot!
To answer your first question:
- Open the SVG in a code editor
- Add or rewrite the attribute of fill of every path to fill="currentColor"
- Now, that svg will take the color of your font color, so you can do something like:
svg { color : "red"; }
Hope this was helpful!
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