crowdfunding-product-page /CSS and JS

Community feedback

• 

  Raymart Pamplona•16,100

  @pikapikamartPosted over 3 years ago

  Hey, really great work on this one. This challenge as well I think is the hardest for me but the most exciting as well.

  In terms of layout, desktop I think is fine for now and the mobile state, needs a little bit of tweaking :>

  Suggestions would be:

  1. Upon loading the website, there is appearance of scrollbar at the bottom. We could remove this via removing width: 100vw on the #main selector.

  2. It will be really great if you used button on the "back this project", because div alone will not create an accessible element, but buttons have that. Also your "bookmark" cannot be un-bookmark, you need to check that one out. Also in that, you could make use of "checkbox" and labels, but you need to create some selector using ~ or + and :focus to give some accessibility features.

  3. Line-height. Line height is really important, it creates this sort of easy reading feeling for users. Creating some gaps so that you could as a user read text with hassle and not conflict because of the top and bottom text, being near or almost touching the text between them. Adjusting that will be really awesome.

  4. On the modal pop up, I think the design on that needs a little bit more touch right :> I will leave that for you.

  4.1. Also when I click the "continue" in the pop, I get the success modal right, but for just a really short time and the website refreshes. Since you are using form right, a button default is submit. So it submit when I click "continue" but we do want the site to refresh. You could add an eventlistener of submit on the form. Then use .preventDefault method to prevent the listener from submitting the form that causes that refresh.

  5. I think it will be better if you made the hamburger dropdown take the full width instead of just width: vw. Taking full width creates consistency, but making sure that paddings is still present okay.

  Though it is a lot, refactoring our work is really really important in terms of developing. If you need some guide on structuring it here is my solution which you can take a look at. Made with accessible features and other components.

  If you need help on that, just drop your query okay. Overall, great work^

  0

  ---

  

  Salko•600

  @sarajlijaPosted over 3 years ago

  @pikamart Thank you for the tips, especially for resolving the website refresh issue after “continue”. I couldn't solve that.

  0