fix: sync navbar

justdlabs · Oct 26, 2024 · ebaa12d · ebaa12d
1 parent fca5c0b
commit ebaa12d
Show file tree

Hide file tree

Showing 4 changed files with 42 additions and 9 deletions.
diff --git a/bun.lockb b/bun.lockb
diff --git a/package.json b/package.json
@@ -37,7 +37,7 @@
     },
     "dependencies": {
         "clsx": "^2.1.1",
-        "framer-motion": "^11.11.9",
+        "framer-motion": "^11.11.10",
         "justd-icons": "^1.5.0",
         "react-aria-components": "^1.4.1",
         "sonner": "^1.5.0",

diff --git a/resources/js/components/ui/navbar.tsx b/resources/js/components/ui/navbar.tsx
@@ -1,5 +1,3 @@
-'use client';
-
 import * as React from 'react';
 
 import { LayoutGroup, motion } from 'framer-motion';
@@ -106,15 +104,21 @@ const Navbar = ({
 };
 
 const navStyles = tv({
-    base: 'hidden h-[--navbar-height] [--navbar-height:3.5rem] px-4 group peer lg:flex items-center w-full mx-auto',
+    base: [
+        'hidden h-[--navbar-height] [--navbar-height:3.5rem] px-4 group peer lg:flex items-center w-full',
+        '[&>div]:max-w-[1680px] lg:[&>div]:flex [&>div]:items-center [&>div]:w-full [&>div]:mx-auto'
+    ],
     variants: {
         isSticky: {
             true: 'sticky top-0'
         },
         intent: {
-            floating: 'bg-tertiary shadow-sm border rounded-xl sm:px-4',
+            floating: 'bg-tertiary max-w-[1680px] mx-auto shadow-sm border rounded-xl sm:px-4',
             navbar: 'bg-tertiary shadow-sm border-b sm:px-6',
-            inset: 'bg-secondary dark:bg-bg sm:px-6'
+            inset: [
+                'bg-secondary mx-auto dark:bg-bg sm:px-6',
+                '[&>div]:max-w-[1680px] lg:[&>div]:flex [&>div]:items-center [&>div]:w-full [&>div]:mx-auto'
+            ]
         }
     }
 });
@@ -148,7 +152,7 @@ const Nav = ({ className, ...props }: NavbarProps) => {
 
     return (
         <div className={navStyles({ isSticky, intent, className })} {...props}>
-            {props.children}
+            <div>{props.children}</div>
         </div>
     );
 };

diff --git a/resources/js/ziggy.js b/resources/js/ziggy.js
@@ -1,5 +1,34 @@
-const Ziggy = {"url":"http:\/\/inertia.ts.test","port":null,"defaults":{},"routes":{"sanctum.csrf-cookie":{"uri":"sanctum\/csrf-cookie","methods":["GET","HEAD"]},"home":{"uri":"\/","methods":["GET","HEAD"]},"about":{"uri":"about","methods":["GET","HEAD"]},"dashboard":{"uri":"dashboard","methods":["GET","HEAD"]},"profile.edit":{"uri":"profile","methods":["GET","HEAD"]},"profile.update":{"uri":"profile","methods":["PATCH"]},"profile.destroy":{"uri":"profile","methods":["DELETE"]},"register":{"uri":"register","methods":["GET","HEAD"]},"login":{"uri":"login","methods":["GET","HEAD"]},"password.request":{"uri":"forgot-password","methods":["GET","HEAD"]},"password.email":{"uri":"forgot-password","methods":["POST"]},"password.reset":{"uri":"reset-password\/{token}","methods":["GET","HEAD"],"parameters":["token"]},"password.store":{"uri":"reset-password","methods":["POST"]},"verification.notice":{"uri":"verify-email","methods":["GET","HEAD"]},"verification.verify":{"uri":"verify-email\/{id}\/{hash}","methods":["GET","HEAD"],"parameters":["id","hash"]},"verification.send":{"uri":"email\/verification-notification","methods":["POST"]},"password.confirm":{"uri":"confirm-password","methods":["GET","HEAD"]},"password.update":{"uri":"password","methods":["PUT"]},"logout":{"uri":"logout","methods":["POST"]}}};
+const Ziggy = {
+    url: 'http://inertia.ts.test',
+    port: null,
+    defaults: {},
+    routes: {
+        'sanctum.csrf-cookie': { uri: 'sanctum/csrf-cookie', methods: ['GET', 'HEAD'] },
+        home: { uri: '/', methods: ['GET', 'HEAD'] },
+        about: { uri: 'about', methods: ['GET', 'HEAD'] },
+        dashboard: { uri: 'dashboard', methods: ['GET', 'HEAD'] },
+        'profile.edit': { uri: 'profile', methods: ['GET', 'HEAD'] },
+        'profile.update': { uri: 'profile', methods: ['PATCH'] },
+        'profile.destroy': { uri: 'profile', methods: ['DELETE'] },
+        register: { uri: 'register', methods: ['GET', 'HEAD'] },
+        login: { uri: 'login', methods: ['GET', 'HEAD'] },
+        'password.request': { uri: 'forgot-password', methods: ['GET', 'HEAD'] },
+        'password.email': { uri: 'forgot-password', methods: ['POST'] },
+        'password.reset': { uri: 'reset-password/{token}', methods: ['GET', 'HEAD'], parameters: ['token'] },
+        'password.store': { uri: 'reset-password', methods: ['POST'] },
+        'verification.notice': { uri: 'verify-email', methods: ['GET', 'HEAD'] },
+        'verification.verify': {
+            uri: 'verify-email/{id}/{hash}',
+            methods: ['GET', 'HEAD'],
+            parameters: ['id', 'hash']
+        },
+        'verification.send': { uri: 'email/verification-notification', methods: ['POST'] },
+        'password.confirm': { uri: 'confirm-password', methods: ['GET', 'HEAD'] },
+        'password.update': { uri: 'password', methods: ['PUT'] },
+        logout: { uri: 'logout', methods: ['POST'] }
+    }
+};
 if (typeof window !== 'undefined' && typeof window.Ziggy !== 'undefined') {
-  Object.assign(Ziggy.routes, window.Ziggy.routes);
+    Object.assign(Ziggy.routes, window.Ziggy.routes);
 }
 export { Ziggy };