atproto explorer

adjust navbar size on mobile

juli.ee 110e2301 e1e994fb

verified
+4 -4
+4 -4
src/components/navbar.tsx
··· 22 22 }); 23 23 24 24 return ( 25 - <nav class="flex w-full flex-col px-2 wrap-anywhere"> 25 + <nav class="flex w-full flex-col px-2 text-sm wrap-anywhere sm:text-base"> 26 26 <div class="relative flex items-center justify-between gap-1"> 27 - <div class="flex min-h-[1.5rem] basis-full items-center gap-2"> 27 + <div class="flex min-h-[1.25rem] basis-full items-center gap-2 sm:min-h-[1.5rem]"> 28 28 <Tooltip text="PDS"> 29 29 <span class="iconify lucide--hard-drive shrink-0"></span> 30 30 </Tooltip> ··· 44 44 <MenuProvider> 45 45 <DropdownMenu 46 46 icon="lucide--copy" 47 - buttonClass="rounded p-1" 47 + buttonClass="rounded p-0.5 sm:p-1 text-base" 48 48 menuClass="top-6 p-2 text-xs" 49 49 > 50 50 <Show when={pds()}> ··· 78 78 </div> 79 79 <Tooltip text={showHandle() ? "Show DID" : "Show handle"}> 80 80 <button 81 - class="flex items-center rounded p-1 hover:bg-neutral-200 active:bg-neutral-300 dark:hover:bg-neutral-700 dark:active:bg-neutral-600" 81 + class="flex items-center rounded p-0.5 text-base hover:bg-neutral-200 active:bg-neutral-300 sm:p-1 dark:hover:bg-neutral-700 dark:active:bg-neutral-600" 82 82 onclick={() => { 83 83 localStorage.showHandle = !showHandle(); 84 84 setShowHandle(!showHandle());