Mobile First - Responsive Landing Page

Community feedback

• 

  Minh Khang Tran•510

  @MinhKhangTran

  Posted about 3 years ago

  Hi Dogan Saglam, nice solution.

  Your subtle animation at the nav-icon and at the gallery are great!

  I found a small "issue". I just discovered it because I played with the viewport. If you go to mobile viewport and click on the hamburger the navigation opens. This is the expected behavior. But if I change the viewport to desktop the navigation should switch to the desktop Navigation. But your solution shows a slightly distorted navigation.

  Something like this should prevent it:

  // Check if responsive menu is open when resized and then remove
    window.addEventListener("resize", () => {
      if (
        menuToggle.classList.contains("active") && navBar.classList.contains("nav-open") &&
        window.matchMedia("(min-width: 768px)").matches
      ) {
        menuToggle.classList.remove('active');
      	navBar.classList.remove('nav-open');
      }
    });
  

  This is a very small issue and normal user normally would not resize the viewport like developers.

  Keep Coding and having fun doing it 🥰

  11

  Marked as helpful
• 

  Ollie•580

  @ohermans1

  Posted about 3 years ago

  Nice work! Love the extra touches!

  11