atproto explorer pdsls.dev
atproto tool

increase hitslop tab buttons

juli.ee 87177b83 85a31a92

verified
Changed files
+8 -8
src
+1 -1
src/components/create.tsx
···
</Modal>
<Tooltip text={`${props.create ? "Create" : "Edit"} record`}>
<button
-
class={`flex items-center p-1 hover:bg-neutral-200 active:bg-neutral-300 dark:hover:bg-neutral-700 dark:active:bg-neutral-600 ${props.create ? "rounded-lg" : "rounded-sm"}`}
+
class={`flex items-center ${props.create ? "p-1" : "p-1.5"} hover:bg-neutral-200 active:bg-neutral-300 dark:hover:bg-neutral-700 dark:active:bg-neutral-600 ${props.create ? "rounded-lg" : "rounded-sm"}`}
onclick={() => {
setNotice("");
setOpenDialog(true);
+1 -1
src/views/pds.tsx
···
<MenuProvider>
<DropdownMenu
icon="lucide--ellipsis-vertical"
-
buttonClass="rounded-sm p-1"
+
buttonClass="rounded-sm p-1.5"
menuClass="top-8 p-2 text-sm"
>
<CopyMenu content={params.pds} label="Copy PDS" icon="lucide--copy" />
+3 -3
src/views/record.tsx
···
<RecordTab tab="backlinks" label="Backlinks" />
<RecordTab tab="info" label="Info" error />
</div>
-
<div class="flex gap-1">
+
<div class="flex gap-0.5">
<Show when={agent() && agent()?.sub === record()?.uri.split("/")[2]}>
<RecordEditor create={false} record={record()?.value} refetch={refetch} />
<Tooltip text="Delete">
<button
-
class="flex items-center rounded-sm p-1 hover:bg-neutral-200 active:bg-neutral-300 dark:hover:bg-neutral-700 dark:active:bg-neutral-600"
+
class="flex items-center rounded-sm p-1.5 hover:bg-neutral-200 active:bg-neutral-300 dark:hover:bg-neutral-700 dark:active:bg-neutral-600"
onclick={() => setOpenDelete(true)}
>
<span class="iconify lucide--trash-2"></span>
···
<MenuProvider>
<DropdownMenu
icon="lucide--ellipsis-vertical"
-
buttonClass="rounded-sm p-1"
+
buttonClass="rounded-sm p-1.5"
menuClass="top-8 p-2 text-sm"
>
<CopyMenu
+3 -3
src/views/repo.tsx
···
</Show>
<RepoTab tab="backlinks" label="Backlinks" />
</div>
-
<div class="flex gap-1">
+
<div class="flex gap-0.5">
<Show when={error() && error() !== "Missing PDS"}>
<div class="flex items-center gap-1 text-red-500 dark:text-red-400">
<span class="iconify lucide--alert-triangle"></span>
···
<Show when={!error() && (!location.hash || location.hash === "#collections")}>
<Tooltip text="Filter collections">
<button
-
class="flex items-center rounded-sm p-1 hover:bg-neutral-200 active:bg-neutral-300 dark:hover:bg-neutral-700 dark:active:bg-neutral-600"
+
class="flex items-center rounded-sm p-1.5 hover:bg-neutral-200 active:bg-neutral-300 dark:hover:bg-neutral-700 dark:active:bg-neutral-600"
onClick={() => setShowFilter(!showFilter())}
>
<span class="iconify lucide--filter"></span>
···
<MenuProvider>
<DropdownMenu
icon="lucide--ellipsis-vertical"
-
buttonClass="rounded-sm p-1"
+
buttonClass="rounded-sm p-1.5"
menuClass="top-8 p-2 text-sm"
>
<CopyMenu content={params.repo} label="Copy DID" icon="lucide--copy" />