Results Summary Component (HTML/CSS/JS)

Community feedback

• 

  MoggStephen•160

  @MoggStephenPosted over 1 year ago

  Hi there!

  This is a great fluid responsive component.

  To improve on your html semantically. You can use the section element to separate the result and the summary sections.

  For a small component like this one css file should be fine! If you want to start separating css files you should look into using sass and sass partials! It can be easily setup within you projects with a live sass compiler.

  Also class naming should be done using '-' and not '_'. This is called hyphen delimited string and is the standard convention for class naming in html and css.

  Other than that its a great second solution!

  Marked as helpful

  0

  ---

  

  Pavle Pavičić•60

  @MellowTangeloPosted over 1 year ago

  @MoggStephen Thank you for taking time to review my code. I appreciate your comments. Also, thaks for the tip about using "-". :)

  0
• 

  Iman Kimiaei•170

  @kimaginPosted over 1 year ago

  Hello Pavle, I think you did a great job.

  Regarding your question, you don't need to divide your CSS file into multiple files since most modern servers are minifying and compressing the CSS file on the server side. You can use Netlify or Vercel as your host which both offer this feature.

  One common practice is to create all the media queries in a separate file and @import it in your style.css or main.css file. You can also inject CSS with javascript for the elements that you are dynamically creating. For bigger applications, you can use a framework such as React or VUE which gives you the opportunity to create individual components and write specific styling for each component in a separate file. For example, you can create a card component and use that multiple times over your project.

  All that said, I think you are doing a great job, and can't wait to see your next project.

  Marked as helpful

  0

  ---

  

  Pavle Pavičić•60

  @MellowTangeloPosted over 1 year ago

  @kimagin Thank you for taking time to review my code. I like the idea of separating media queries from a file. It can definitely improve readability of the code- I will try to use these useful tips in my next project. :)

  1