kobalte icon indicating copy to clipboard operation
kobalte copied to clipboard

NavigationMenu does not work on mobile

Open ian-pascoe opened this issue 1 year ago • 1 comments

Describe the bug A clear and concise description of what the bug is. Clicking on links within the NavigationMenu component does not work on iOS, just closes the menu.

To Reproduce Steps to reproduce the behavior:

  1. Go to kobalte.dev
  2. Click on NavigationMenu component
  3. Scroll down to the example
  4. Open DevTools
  5. Change to mobile view
  6. Try clicking the links

Expected behavior A clear and concise description of what you expected to happen. Links should be clickable on mobile

Screenshots If applicable, add screenshots to help explain your problem.

Desktop (please complete the following information): N/A

Smartphone (please complete the following information):

  • Device: iPhone 13
  • OS: iOS
  • Browser: Safari

Additional context Add any other context about the problem here.

ian-pascoe avatar Jul 18 '24 14:07 ian-pascoe

For a quick-fix we used the onSelect prop from the NavigationMenu.CheckboxItem and used the window.open function to open the link.

onSelect={() => window.open("https://kobalte.dev/docs/core/components/navigation-menu/", "_blank");}

papatie avatar Oct 18 '24 10:10 papatie