Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

HTML,CSS,VS CODE

@Badhrikr


Design comparison


SolutionDesign

Solution retrospective


Any kind of feedback is useful 🤗.This is my first attempt in creating a landing page 😅. Can anyone suggest me on how to create a perfect hover effect on svg.

Community feedback

Tomi 565

@Tomi-pter

Posted

Notable points

  1. You need to decrease the min-width on the media query from 1400px as it is larger than the average desktop size
  2. For the desktop view you'll need to decrease the size of the images so they can fit the cards with the text
  3. Reduce the inline (left and right) padding set on the text beside the images
  4. Add some opacity on the box shadow of the cards as they're too dark
  5. Add box shadow to the card that contains the button above the footer
  6. For the hover effect on the svg, use the "filter" function for that. Refer to https://css-tricks.com/almanac/properties/f/filter/ for more help
  7. Also check out the html issues highlighted in your solution report.

I hope this helps 👍🏾

Marked as helpful

0
P
Jay 260

@Hyuuga81

Posted

Great job. Love the mouse over effects as they are. Especially the footer links. Keep it up.

0

Please log in to post a comment

Log in with GitHub
Discord logo

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