Pod request landing page with Flexbox and funky SVG icons

Solution retrospective
-
I had trouble getting the SVGs in an external file and then apply the filters in CSS. Couldn't make it work. Fixed it down and dirty now. Is there a way to properly do this?
-
Is there a good way to add styling to the autocompletion of an email input field?
Please log in to post a comment
Log in with GitHubCommunity feedback
- @ApplePieGiraffe
Hello, Joran Minjon! 👋
Good job on another challenge! 👏 I really like the way the error/success messages smoothly slide in and out of view! 👍
The only minor thing I suggest is adding a
max-width
to the email input element and submit button so that they aren't too wide when the layout first changes from desktop to mobile.Of course, keep coding (and happy coding, too)! 😁
- @pikapikamart
Upon looking at it, your filter seems unnecessary in here since they provide the picture or the svg already filtered, so maybe your
background-blend-mode
could be remove in here. In your second question, I don't really know if there is, but if you probably know it by now, share it with us. Only that and good work^ - @sophiebushchak
Some feedback:
On a very small screen size, the platform SVG's shrink to be almost unreadable, you could probably let them stay a tiny bit larger until there's really no space for it: https://puu.sh/HtnSN/1ba6aed03a.png
Maybe put a max width on the content or find some way to scale the image and text block to be bigger, because on a 1440p screen it stops looking like the design at all and the image and text are completely separated: https://puu.sh/HtnT4/d6dd89649c.png
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