compress the size of top bar

js/src/pages/path-resolver.tsx

@@ -5,7 +5,6 @@ import { ParticleListView } from "@/features/particles/particle-list-view";
 import { ParticleViewResolver } from "@/features/particles/particle-view-resolver";
 import { WindowControls } from "@/components/window-controls";
 import { Button } from "@/components/ui/button";
-import { Muted } from "@/components/ui/typography";
 import {
   Breadcrumb,
   BreadcrumbItem,
@@ -42,16 +41,15 @@ function NetworkBreadcrumbContent({ networkId }: { networkId: string }) {
 
 function TopBar({ segments }: { segments: string[] }) {
   const navigate = useNavigate();
-  const user = useAuthStore((s) => s.user);
   const networkId = segments[0] ?? null;
 
   return (
-    <div className="drag-region flex items-center gap-3 border-b px-4 py-3">
+    <div className="drag-region flex items-center gap-3 border-b px-3 py-1">
       <WindowControls />
 
       <Breadcrumb className="no-drag">
         <BreadcrumbList>
-          <BreadcrumbItem>
+          <BreadcrumbItem className="text-xs">
             {segments.length === 0 ? (
               <BreadcrumbPage className="flex items-center gap-1">
                 <Home className="size-3.5" />
@@ -71,7 +69,7 @@ function TopBar({ segments }: { segments: string[] }) {
           {networkId && (
             <span className="contents">
               <BreadcrumbSeparator />
-              <BreadcrumbItem>
+              <BreadcrumbItem className="text-xs">
                 {segments.length === 1 ? (
                   <BreadcrumbPage>
                     <NetworkBreadcrumbContent networkId={networkId} />
@@ -95,7 +93,7 @@ function TopBar({ segments }: { segments: string[] }) {
             return (
               <span key={path} className="contents">
                 <BreadcrumbSeparator />
-                <BreadcrumbItem>
+                <BreadcrumbItem className="text-xs">
                   {isLast ? (
                     <BreadcrumbPage>{segment}</BreadcrumbPage>
                   ) : (
@@ -114,7 +112,7 @@ function TopBar({ segments }: { segments: string[] }) {
       </Breadcrumb>
 
       <div className="flex-1" />
-      {user && <Muted className="text-xs">{user.email_prefix}</Muted>}
+
       <Button
         variant="ghost"
         size="sm"