From e567181b58bcafe898075134f68fcb29d9a3afcc Mon Sep 17 00:00:00 2001
From: xintaofei <itpkcn@gmail.com>
Date: Tue, 21 Apr 2026 18:44:20 +0800
Subject: [PATCH] fix(sidebar): center guide line under folder chevron and
 tighten list paddings

- Align conversation guide line and status icon to the folder chevron center (left: 0.875rem)
- Use fixed 1px guide line with darker shade (sidebar-primary/15) for better visibility
- Add bottom border to sidebar title and a top gap above the folder list
- Tighten list horizontal padding to px-2 with matching pt-2 for consistency
- Fill the done status icon frame directly to avoid sub-pixel off-centering
---
 .../conversations/sidebar-conversation-card.tsx       |  6 +++---
 .../conversations/sidebar-conversation-list.tsx       |  4 ++--
 src/components/conversations/sidebar-status-icon.tsx  | 11 +++++------
 src/components/layout/sidebar.tsx                     |  4 ++--
 4 files changed, 12 insertions(+), 13 deletions(-)

diff --git a/src/components/conversations/sidebar-conversation-card.tsx b/src/components/conversations/sidebar-conversation-card.tsx
index be5de83..97ce7f6 100644
--- a/src/components/conversations/sidebar-conversation-card.tsx
+++ b/src/components/conversations/sidebar-conversation-card.tsx
@@ -151,10 +151,10 @@ export const SidebarConversationCard = memo(function SidebarConversationCard({
             >
               <span
                 aria-hidden
-                className="pointer-events-none absolute top-0 bottom-0 rounded-[0.125rem] bg-sidebar-primary/5"
+                className="pointer-events-none absolute top-0 bottom-0 rounded-[0.125rem] bg-sidebar-primary/15"
                 style={{
-                  left: "1rem",
-                  width: "0.125rem",
+                  left: "0.875rem",
+                  width: "1px",
                   transform: "translateX(-50%)",
                 }}
               />
diff --git a/src/components/conversations/sidebar-conversation-list.tsx b/src/components/conversations/sidebar-conversation-list.tsx
index 4c85da5..73297b5 100644
--- a/src/components/conversations/sidebar-conversation-list.tsx
+++ b/src/components/conversations/sidebar-conversation-list.tsx
@@ -709,7 +709,7 @@ export function SidebarConversationList({
                     aria-hidden
                     className="absolute inset-0 right-[0.5rem] bg-sidebar"
                   />
-                  <div className="relative pl-[0.625rem] pr-[0.625rem]">
+                  <div className="relative px-2">
                     <FolderHeader
                       key={`sticky-${stickyFolderItem.folderId}`}
                       folderId={stickyFolderItem.folderId}
@@ -731,7 +731,7 @@ export function SidebarConversationList({
               )}
               <ScrollArea
                 className={cn(
-                  "h-full min-h-0 pl-[0.625rem] pr-[0.625rem] pt-[0.125rem] pb-[1.25rem]",
+                  "h-full min-h-0 px-2 pb-[1.25rem]",
                   "[overflow-anchor:none]"
                 )}
               >
diff --git a/src/components/conversations/sidebar-status-icon.tsx b/src/components/conversations/sidebar-status-icon.tsx
index 2e54fa1..e6eee3d 100644
--- a/src/components/conversations/sidebar-status-icon.tsx
+++ b/src/components/conversations/sidebar-status-icon.tsx
@@ -27,7 +27,7 @@ function IconFrame({
         className
       )}
       style={{
-        left: "1rem",
+        left: "0.875rem",
         width: "0.625rem",
         height: "0.625rem",
         transform: "translate(-50%, -50%)",
@@ -141,13 +141,12 @@ export function SidebarStatusIcon({
   return (
     <IconFrame colorClass="text-sidebar-primary/40" className={className}>
       <svg
-        width="0.45rem"
-        height="0.45rem"
-        viewBox="0 0 12 12"
+        width="0.625rem"
+        height="0.625rem"
+        viewBox="0 0 10 10"
         preserveAspectRatio="xMidYMid meet"
-        style={{ overflow: "visible" }}
       >
-        <circle cx="6" cy="6" r="5" fill="currentColor" />
+        <circle cx="5" cy="5" r="3" fill="currentColor" />
       </svg>
     </IconFrame>
   )
diff --git a/src/components/layout/sidebar.tsx b/src/components/layout/sidebar.tsx
index 6bc1ed9..f40fcda 100644
--- a/src/components/layout/sidebar.tsx
+++ b/src/components/layout/sidebar.tsx
@@ -88,7 +88,7 @@ export function Sidebar() {
   return (
     <aside className="flex h-full min-h-0 flex-col overflow-hidden bg-sidebar text-sidebar-foreground select-none">
       <TooltipProvider>
-        <div className="flex h-10 shrink-0 items-center justify-between gap-2 pl-[1.125rem] pr-2">
+        <div className="flex h-10 shrink-0 items-center justify-between gap-2 border-b border-border pl-4 pr-2">
           <div className="flex min-w-0 items-baseline gap-[0.375rem]">
             <h2 className="truncate text-[0.875rem] font-bold tracking-[-0.00625rem] text-sidebar-foreground">
               {t("title")}
@@ -154,7 +154,7 @@ export function Sidebar() {
 
       {/* On mobile, clicking a conversation card auto-closes the Sheet */}
       <div
-        className="flex flex-col flex-1 min-h-0 overflow-hidden"
+        className="flex flex-col flex-1 min-h-0 overflow-hidden pt-2"
         onClick={
           isMobile
             ? (e) => {