Responsive social media dashboard

Community feedback

• 

  P

  Dave•5,295

  @dwhensonPosted over 3 years ago

  Hi @Sami-21 👋 - Lovely job here. The screenshot looks great and the site is nice and responsive at different viewports - very nice! Here's a few small suggestions for you to consider:

  1. At smaller viewports I would suggest going down to one column of grid-children. This will allow more space for each element. I would also add some padding around each grid child as at the moments the content gets pushed right up against the border at smaller sizes.

  2. Nice use of the checkbox for the toggle switch 🙌 - but don't forget the label for attribute needs to link to the input id attribute. I also just checked the report and see that you have a couple of other ids on the page with the same name - this should be easy to fix.

  3. I don't think you code is a huge mess! But if you wanted some suggestions to make it more concise you could have a think about the following:

  • I would put the JavaScript in a separate file and use addEventListener rather than using inline code to toggle the switch. This will help clean up your HTML file a little bit and is a good habit to get into.
  • Some comments in the CSS could help organising things by highlighting what sections the code applies to (e.g. /* Toggle switch */ etc). Thinking this way might help your overall code structure too
  • Using CSS custom properties on this challenge can really simplify things and are great to get into, this article might help: https://dev.to/ananyaneogi/create-a-dark-light-mode-switch-with-css-variables-34l8 - this will also simplify your JavaScript.
  • I like to try and rely on the cascade in CSS to make properties inherit when ever possible. I find that although this takes a while to get used to I write less code this way. Personal preference though other people prefer the opposite!

  Keep up the good work and just let me know if any of my suggestions are not clear! Cheers 👋

  1

  ---

  

  Sami Maachi•230

  @Sami-21Posted over 3 years ago

  @dwhenson Thanks for your time and advices I will try to optimise my code.

  0