Survey form - any feedback appreciated!

Code Feedback
1

Howdy campers!

I started the FCC curriculum back in 2017 and then got sidetracked by life and work. Now that I’m unemployed, I figured it would be a good time to pick up where I left off.

Seems they’ve changed things a bit since back then. The course has been restructured and they’ve added in some new challenges and modules. So I’ve kinda gone back a step, which is not a bad thing at all.

Anyways, here’s my attempt at creating a survey form:

Any feedback would be greatly appreciated! Thanks!

BTW, the content is not to be taken too seriously :smiley:

2 Likes
2

Good job!

I also started back in 2016, got my Front-end Certificate (legacy) in the end of 2017, and now I’m planning to resume and finish freeCodeCamp completely. A lot of things really changed.

Well, one tiny detail I would like to mention about your project.
As you can see, when you focus on text input, select and textarea, the text or placeholder inside them moves a little bit. It happens due to the border you used here:

.input-style:focus, textarea:focus {
  border: 2px solid;
  border-color: #3399ff;
}

You can fixed it adding some padding.
Add this code:

.input-style:focus {
  padding: 10px 9px;
}
textarea.input-style:focus, select.input-style:focus {
  padding: 9px;
}

Keep going and don’t give up.

1 Like
3

Looks good. Don’t really have much to comment on.

I would suggest adding more padding to the form and giving the submit button cursor: pointer.

This is just something subjective. But for some reason, the pure black text color and higher font-weight is making it feel a little dense to me. Maybe try giving the form text a tiny bit of blue mixed in, like a very dark blue, or really black with a hint of blue. You might also try using rgba for the color and give it just a little bit of opacity to pick up some of the blues from the form. Another option might be to lower the font-weight on the radio and checkbox labels, as that may also help lighten the look a bit.

Anyway, good job. Keep it up.

1 Like
4

Thanks both @MorsEtVita and @lasjorg for the useful feedback. I’m going to have a little play and tweak it based on your suggestions.

5

This is really nice!
The font is very enjoyable. I really like the one you picked.

Wow! It’s responsive, too! Awesome!

Awesome job. Keep up the great work.

1 Like
6

Thanks! If you mean the pixelated font for the h1, I knew I had to use that as soon as saw it on Google fonts :smiley:

7

I mean all of the fonts. They are really great.

1 Like