Fixed namespace, updated mobile navbar z-index

apps/web/src/components/navbar.tsx

@@ -118,8 +118,8 @@ export function MobileNavbar() {
   const { setOpenMobile } = useSidebar();
 
   return (
-    <div className="z-100 w-full pb-[env(safe-area-inset-bottom)] bg-card border-t">
-      <div className="z-100 w-full h-14 flex justify-center items-center gap-8">
+    <div className="z-51 w-full pb-[env(safe-area-inset-bottom)] bg-card border-t">
+      <div className="z-51 w-full h-14 flex justify-center items-center gap-8">
         <SidebarTrigger
           className="text-foreground w-12! h-12! aspect-square rounded-xl"
           variant="link"

apps/web/src/routes/layout.tsx

@@ -20,38 +20,10 @@ import { isTauri } from "@tauri-apps/api/core";
  * @returns unknown.
  */
 export default function Layout(props: { children: ReactNode }) {
-  const [pixelRatio, setPixelRatio] = useState(devicePixelRatio);
-  const [visible, setVisible] = useState(false);
-
   const isMobile = useIsMobile();
 
-  useEffect(() => {
-    const handleResize = () => {
-      setPixelRatio(devicePixelRatio);
-      setVisible(true);
-      setTimeout(() => setVisible(false), 1000);
-    };
-
-    window.addEventListener("resize", handleResize);
-    return () => window.removeEventListener("resize", handleResize);
-  }, []);
-
   return (
     <>
-      <div className="fixed top-0 left-0 z-100 w-screen h-screen flex flex-col justify-center items-center pointer-events-none select-none">
-        {visible && (
-          <div className="bg-card border p-1 text-xs">
-            {Math.round(pixelRatio)}
-          </div>
-        )}
-
-        {/* Todo: Make this nicer */}
-        {pixelRatio !== 1 && (
-          <div className="fixed bottom-0 right-0 m-3 text-xs text-red-500">
-            Hey! You're zoomed in.
-          </div>
-        )}
-      </div>
       <Toaster
         position={isMobile ? "top-center" : "bottom-right"}
         {...(isTauri()

apps/web/vite.config.ts

@@ -3,7 +3,30 @@ import react from "@vitejs/plugin-react";
 import tsconfigPaths from "vite-tsconfig-paths";
 import tailwindcss from "@tailwindcss/vite";
 
+const host = process.env.TAURI_DEV_HOST;
+
 export default defineConfig({
+  clearScreen: false,
+  server: {
+    port: 5173,
+    strictPort: true,
+    host: host || "0.0.0.0",
+    hmr: host
+      ? {
+          protocol: "ws",
+          host,
+          port: 1421,
+        }
+      : undefined,
+    watch: {
+      ignored: ["**/src-tauri/**"],
+    },
+  },
+  envPrefix: ["VITE_", "TAURI_ENV_*"],
+  build: {
+    minify: !process.env.TAURI_ENV_DEBUG ? "esbuild" : false,
+    sourcemap: !!process.env.TAURI_ENV_DEBUG,
+  },
   plugins: [react(), tsconfigPaths(), tailwindcss()],
   worker: {
     format: "es",