Skip to content
Submitted over 3 years ago

Scss, BEM methodology and Vanilla JS for form validation

Agata Liberska•3,995
@AgataLiberska
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Ping single column coming soon page
  • HTML
  • CSS
  • JS
1newbie

Design comparison

SolutionDesign

Solution retrospective

Hi, are the focus states on the form clear enough? I feel like the button is a bit too subtle, but it's technically the same as the input.

I seem to sometimes get a horizontal scrollbar on smaller screens, but it's not happening consistently so I think it's just a browser issue - or am I missing something?

I also cannot find the thing that HTML validation is picking up on, if someone could have a look and help me out, that would be great :D

Thanks!

Community feedback

  • Anna Leigh•5,135
    @brasspetalsPosted over 3 years ago

    Hi, Agata! 👋

    Great job on this challenge! I tested it in multiple browsers, and never came across any horizontal scrollbar issues so I think you're good there. 👍

    It seems like the HTML error has something to do with how the font awesome icons generate themselves. I've very rarely used FA, so I'm sorry I can't be of more help here. 😅

    My only recommendation would to be to make the placeholder text a bit larger and darker to make it more legible.

    Again, good job - and happy coding!

    1
    Agata Liberska•3,995
    @AgataLiberskaPosted over 3 years ago

    @brasspetals you're absolutely right about the placeholder text, didn't notice how light it is until I saw the comparison! thank you, I'll correct that :)

    0

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