Northern_Lights/cherry-studio
1
0
Fork 0
mirror of https://github.com/CherryHQ/cherry-studio.git synced 2026-01-10 15:49:29 +08:00
Code Issues Actions 3 Packages Projects Releases Wiki Activity

style(components): update button styling in AgentItem and SessionItem

Browse Source 
- Change hover background color and add shadow in AgentItem
- Use cn utility for className in SessionItem
- Update height and background color for active state in SessionItem
This commit is contained in:
icarus 2025-09-26 04:37:30 +08:00
parent f4e4586fbc
commit 5c8e06ed94
2 changed files with 5 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/renderer/src/pages/home/Tabs/components/AgentItem.tsx
View File

@ -84,7 +84,7 @@ const ButtonContainer: React.FC<React.ComponentProps<typeof Button>> = ({ classN
'rounded-[var(--list-item-border-radius)]', 'rounded-[var(--list-item-border-radius)]',
'border-[0.5px] border-transparent', 'border-[0.5px] border-transparent',
'w-[calc(var(--assistants-width)_-_20px)]', 'w-[calc(var(--assistants-width)_-_20px)]',
'bg-transparent hover:bg-[var(--color-list-item-hover)]', 'bg-transparent hover:bg-[var(--color-list-item)] hover:shadow-sm',
'cursor-pointer', 'cursor-pointer',
className?.includes('active') && 'bg-[var(--color-list-item)] shadow-sm', className?.includes('active') && 'bg-[var(--color-list-item)] shadow-sm',
className className

8
src/renderer/src/pages/home/Tabs/components/SessionItem.tsx
View File

@ -46,7 +46,7 @@ const SessionItem: FC<SessionItemProps> = ({ session, agentId, isDisabled, isLoa
isDisabled={isDisabled} isDisabled={isDisabled}
isLoading={isLoading} isLoading={isLoading}
onPress={onPress} onPress={onPress}
className={isActive ? 'active' : ''} className={cn(isActive ? 'active' : '')}
onDoubleClick={() => startEdit(session.name ?? '')}> onDoubleClick={() => startEdit(session.name ?? '')}>
<SessionLabelContainer className="name h-full w-full" title={session.name ?? session.id}> <SessionLabelContainer className="name h-full w-full" title={session.name ?? session.id}>
{isEditing && ( {isEditing && (
@ -99,14 +99,14 @@ const SessionItem: FC<SessionItemProps> = ({ session, agentId, isDisabled, isLoa
const ButtonContainer: React.FC<React.ComponentProps<typeof Button>> = ({ className, children, ...props }) => ( const ButtonContainer: React.FC<React.ComponentProps<typeof Button>> = ({ className, children, ...props }) => (
<Button <Button
{...props} {...props}
variant="light"
className={cn( className={cn(
'relative mb-2 flex h-[37px] flex-row justify-between p-0', 'relative mb-2 flex h-9 flex-row justify-between p-0',
'rounded-[var(--list-item-border-radius)]', 'rounded-[var(--list-item-border-radius)]',
'border-[0.5px] border-transparent', 'border-[0.5px] border-transparent',
'w-[calc(var(--assistants-width)_-_20px)]', 'w-[calc(var(--assistants-width)_-_20px)]',
'bg-transparent hover:bg-[var(--color-list-item-hover)]',
'cursor-pointer', 'cursor-pointer',
className?.includes('active') && 'bg-[var(--color-list-item)] shadow-sm', className?.includes('active') && 'bg-foreground-100 shadow-sm',
className className
)}> )}>
{children} {children}