From 0b5bfae8b01eba30501478eca73b03696734ffcb Mon Sep 17 00:00:00 2001
From: Zak Nesler <zak@nesler.dev>
Date: Tue, 23 Jul 2024 08:25:02 -0400
Subject: [PATCH] fix border gap

---
 ui/src/components/feed/feed-folder.tsx | 21 +++++++++++----------
 ui/src/components/feed/feed-item.tsx   |  2 +-
 ui/src/constants/ui/feed.ts            |  2 +-
 3 files changed, 13 insertions(+), 12 deletions(-)

diff --git a/ui/src/components/feed/feed-folder.tsx b/ui/src/components/feed/feed-folder.tsx
index 13109c2..833ff61 100644
--- a/ui/src/components/feed/feed-folder.tsx
+++ b/ui/src/components/feed/feed-folder.tsx
@@ -34,16 +34,17 @@ export const FeedFolder: ParentComponent<FeedFolderProps> = props => {
 
   return (
     <Collapsible open={open()} onOpenChange={handleNavigate} class="flex flex-col items-stretch gap-1">
-      <Collapsible.Trigger as="button" class={feedClasses.item({ active: isActive(), class: 'gap-1.5' })}>
-        <Button class={feedClasses.folderTrigger({ active: isActive() })} onClick={handleClick}>
-          <div class="flex size-7 items-center justify-center md:size-5">
-            <HiOutlineChevronRight
-              class={cx(
-                'size-4 text-gray-500 transition-transform md:size-3 dark:text-gray-400',
-                open() && 'rotate-90',
-              )}
-            />
-          </div>
+      <Collapsible.Trigger as="button" class={feedClasses.item({ active: isActive() })}>
+        <Button
+          class={feedClasses.folderTrigger({
+            active: isActive(),
+            class: 'flex size-7 items-center justify-center md:size-5',
+          })}
+          onClick={handleClick}
+        >
+          <HiOutlineChevronRight
+            class={cx('size-4 text-gray-500 transition-transform md:size-3 dark:text-gray-400', open() && 'rotate-90')}
+          />
         </Button>
 
         <span class="text-base md:text-sm">{props.label}</span>
diff --git a/ui/src/components/feed/feed-item.tsx b/ui/src/components/feed/feed-item.tsx
index b42b0a1..f814a37 100644
--- a/ui/src/components/feed/feed-item.tsx
+++ b/ui/src/components/feed/feed-item.tsx
@@ -136,7 +136,7 @@ export const BaseFeedItem: Component<BaseFeedItemProps> = props => {
   ]);
 
   return (
-    <A {...rest} href={local.href} class={feedClasses.item({ active: local.active, class: 'gap-2' })}>
+    <A {...rest} href={local.href} class={feedClasses.item({ active: local.active })}>
       <div class="relative flex size-7 shrink-0 items-center justify-center overflow-hidden rounded-md md:size-5 md:rounded">
         <Switch fallback={<RssIcon />}>
           <Match when={local.favicon_src}>
diff --git a/ui/src/constants/ui/feed.ts b/ui/src/constants/ui/feed.ts
index f4720a8..cff8c3d 100644
--- a/ui/src/constants/ui/feed.ts
+++ b/ui/src/constants/ui/feed.ts
@@ -1,7 +1,7 @@
 import { cva, cx } from 'class-variance-authority';
 
 const base = cx(
-  'flex touch-manipulation select-none items-center rounded-lg border p-1 text-base no-underline transition focus:outline-none md:rounded-md md:text-sm',
+  'flex touch-manipulation select-none items-center gap-2 rounded-lg border p-1 text-base no-underline transition focus:outline-none md:rounded-md md:text-sm',
   'text-gray-600 focus:border-gray-400 dark:text-gray-300 dark:focus:border-gray-600',
 );