Design comparison
Solution retrospective
Not sure how to go about for the cyan effect on the main picture. I'd imagine theres a screen blend mode for css but I can't find it. Maybe there's a different and similar blend mode/ technique. Any help to making the Eye Icon and cyan background apear on-click would be appreciated.
Community feedback
- @anoshaahmedPosted almost 3 years ago
Hey good job on this challenge! Your report above shows a few issues though:
- wrap everything in your body in
<main>... OR use semantic tags! .... you can also giverole=""to the direct children of your<body>but that's a little frowned upon... Click here to read more - have at least one
<h1>in your code
Here's a link to something I wrote about accessibility issues & best practices
To make the overlay, you can use the ::after pseudoelement, and create it with the opacity of 0, and change the opacity to something visible when the image is hovered.
Hope this helps :)
Marked as helpful0 - wrap everything in your body in
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