refactor(sidebar): tighten list padding and round conversation and folder rows into pills

This commit is contained in:
xintaofei
2026-04-22 21:59:55 +08:00
parent 8095a75b5f
commit aea652af76
3 changed files with 6 additions and 6 deletions

View File

@@ -138,7 +138,7 @@ export const SidebarConversationCard = memo(function SidebarConversationCard({
onDoubleClick={handleDblClick}
className={cn(
"relative flex h-[1.9375rem] w-full items-center gap-[0.625rem] text-left outline-none",
"rounded-[0.375rem] text-sidebar-foreground",
"rounded-full text-sidebar-foreground",
"transition-colors duration-[120ms]",
"pr-[0.5rem] pl-7",
isSelected

View File

@@ -150,7 +150,7 @@ const FolderHeader = memo(function FolderHeader({
<div
className={cn(
"flex h-[1.9375rem] w-full items-center",
"rounded-[0.4375rem]",
"rounded-full",
"transition-colors duration-150",
"hover:bg-[color-mix(in_oklab,var(--sidebar-accent),var(--sidebar-foreground)_2%)]"
)}
@@ -759,9 +759,9 @@ export function SidebarConversationList({
>
<div
aria-hidden
className="absolute inset-0 right-[0.5rem] bg-sidebar"
className="absolute inset-0 right-[0.25rem] bg-sidebar"
/>
<div className="relative px-2">
<div className="relative px-1">
<FolderHeader
key={`sticky-${stickyFolderItem.folderId}`}
folderId={stickyFolderItem.folderId}
@@ -781,7 +781,7 @@ export function SidebarConversationList({
)}
<ScrollArea
className={cn(
"h-full min-h-0 px-2 pb-[1.25rem]",
"h-full min-h-0 px-1 pb-[1.25rem]",
"[overflow-anchor:none]"
)}
>

View File

@@ -130,7 +130,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 pt-2"
className="flex flex-col flex-1 min-h-0 overflow-hidden pt-1"
onClick={
isMobile
? (e) => {