Show filters in bottom sheet on mobile

Author: the-snesler

package.json

@@ -25,6 +25,7 @@
     "react-leaflet": "^5.0.0",
     "react-leaflet-custom-control": "^1.5.0",
     "react-leaflet-markercluster": "^5.0.0-rc.0",
+    "react-modal-sheet": "^5.2.1",
     "react-range-slider-input": "^3.3.2",
     "react-router": "^7.9.6",
     "valibot": "^0.21.0"

pnpm-lock.yaml

@@ -11,7 +11,7 @@ const Navigation = () => {
     </Link>
   )
   return (
-    <div className="absolute top-0 z-[1000] flex h-5 w-full items-center gap-1 overflow-hidden border-b-2 border-gray-400 bg-white px-2 text-xs leading-none">
+    <div className="absolute top-0 z-[1000] flex h-5 w-full items-center gap-1 overflow-x-auto overflow-y-hidden border-b-2 border-gray-400 bg-white px-2 text-xs leading-none">
       <NavLink to="/" text="Mapa" />
       <NavLink to="/stats" text="Estadísticas" />
       {isLoggedIn && (