Skip to content

Mobile Navbar Doesn't Close on Clicking Internal Nav Link #169

Open
@cybardev

Description

@cybardev

What is your Hugo Extended Version

hugo v0.140.2+extended+withdeploy darwin/arm64 BuildDate=2024-12-30T15:01:53Z VendorInfo=brew

What is your Go Version

go version go1.23.4 darwin/arm64

What is your Node.js Version

v23.6.0

What is your Operating System

macOS 15.2

Check for Existing Issues

  • I have searched and found no relevant issues.

Expected Behavior

When clicking a navbar item with an internal link (URL fragment, like #about) within the same page, the navbar shouldn't just navigate to that section but the nav dropdown should also automatically close, without the user having to click the X icon.

Steps to Reproduce

  1. Change nav link to section on same page
  2. Open site on mobile
  3. Click hamburger menu
  4. Click nav link pointing to section on same page

Code Reproduction URL

github.com/cybardev/hugoplate

Additional Information

I feel like this part is relevant, but I'm not quite sure how to change it to facilitate that:

e.target.closest('.nav-item').classList.toggle("active");

Here's a commit showing how to easily reproduce the issue in the base template after running project setup and installing deps:
cybardev@c2a0abb

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions