Responsive Intro section with dropdown navigation using mobile first

Community feedback

• 

  Gillian Akpeki•445

  @akpekigPosted over 1 year ago

  I think your code could be improved by reducing the redundancy. A lot of the elements are selected using specific classes despite having the same functions and events. To solve this, instead of:

  const elementOne = document.querySelector(".element1");
  const elementTwo = document.querySelector(".element2");
  ...
  const elementN = document.querySelector(".elementN");
  

  give them a unifying class name that can call them all simultaneously:

  const elements = document.querySelectorAll(".element");
  

  Then you can write a function that handles the conditional logic and pass it to the array of elements so you aren't writing the same/similar conditionals repeatedly:

  function handleEl(el, optionalEl) {
  ...
  }
  
  elements.forEach(element => {
  element.addEventListener('click', () => handleEl(element))
  });
  

  Marked as helpful

  2

  ---

  

  Nicolas•90

  @byNico1Posted over 1 year ago

  @akpekig thanks I did that and probably could have improved my code more, but already made the JavaScript better

  0
• 

  wannacode•700

  @kwngptrlPosted over 1 year ago

  You could improve on the hover states as well. As it is now, your css has no :hover on the links and buttons (the font color is supposed to get darker.) Refer to the style-guide.md.

  Marked as helpful

  0

  ---

  

  Nicolas•90

  @byNico1Posted over 1 year ago

  @kwngptrl thanks I actually saw there was a lot of differences between my solution and initial design so already Improved it a lot

  0