mirror of
https://github.com/CherryHQ/cherry-studio.git
synced 2025-12-30 07:39:06 +08:00
style(components): update button styling in AgentItem and SessionItem
- 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:
parent
f4e4586fbc
commit
5c8e06ed94
@ -84,7 +84,7 @@ const ButtonContainer: React.FC<React.ComponentProps<typeof Button>> = ({ classN
|
||||
'rounded-[var(--list-item-border-radius)]',
|
||||
'border-[0.5px] border-transparent',
|
||||
'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',
|
||||
className?.includes('active') && 'bg-[var(--color-list-item)] shadow-sm',
|
||||
className
|
||||
|
||||
@ -46,7 +46,7 @@ const SessionItem: FC<SessionItemProps> = ({ session, agentId, isDisabled, isLoa
|
||||
isDisabled={isDisabled}
|
||||
isLoading={isLoading}
|
||||
onPress={onPress}
|
||||
className={isActive ? 'active' : ''}
|
||||
className={cn(isActive ? 'active' : '')}
|
||||
onDoubleClick={() => startEdit(session.name ?? '')}>
|
||||
<SessionLabelContainer className="name h-full w-full" title={session.name ?? session.id}>
|
||||
{isEditing && (
|
||||
@ -99,14 +99,14 @@ const SessionItem: FC<SessionItemProps> = ({ session, agentId, isDisabled, isLoa
|
||||
const ButtonContainer: React.FC<React.ComponentProps<typeof Button>> = ({ className, children, ...props }) => (
|
||||
<Button
|
||||
{...props}
|
||||
variant="light"
|
||||
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)]',
|
||||
'border-[0.5px] border-transparent',
|
||||
'w-[calc(var(--assistants-width)_-_20px)]',
|
||||
'bg-transparent hover:bg-[var(--color-list-item-hover)]',
|
||||
'cursor-pointer',
|
||||
className?.includes('active') && 'bg-[var(--color-list-item)] shadow-sm',
|
||||
className?.includes('active') && 'bg-foreground-100 shadow-sm',
|
||||
className
|
||||
)}>
|
||||
{children}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user