fix dark theme

This commit is contained in:
hjlarry 2025-09-24 10:08:33 +08:00
parent 8c00f89e36
commit 4188c9a1dd
8 changed files with 21 additions and 21 deletions

View File

@ -50,7 +50,7 @@ export const UserAvatarList: FC<UserAvatarListProps> = memo(({
name={user.name}
avatar={user.avatar_url || null}
size={size}
className='ring-2 ring-white'
className='ring-2 ring-components-panel-bg'
backgroundColor={userColor}
/>
</div>
@ -60,7 +60,7 @@ export const UserAvatarList: FC<UserAvatarListProps> = memo(({
)}
{shouldShowCount && remainingCount > 0 && (
<div
className={'flex items-center justify-center rounded-full bg-components-panel-on-panel-item-bg text-[10px] leading-none text-text-secondary ring-2 ring-white'}
className={'flex items-center justify-center rounded-full bg-components-panel-on-panel-item-bg text-[10px] leading-none text-text-secondary ring-2 ring-components-panel-bg'}
style={{
zIndex: 0,
width: size,

View File

@ -48,7 +48,7 @@ export const CommentIcon: FC<CommentIconProps> = memo(({ comment, onClick }) =>
className={'relative h-10 overflow-hidden rounded-br-full rounded-tl-full rounded-tr-full'}
style={{ width: dynamicWidth }}
>
<div className="absolute inset-[6px] overflow-hidden rounded-br-full rounded-tl-full rounded-tr-full bg-white">
<div className="absolute inset-[6px] overflow-hidden rounded-br-full rounded-tl-full rounded-tr-full border border-components-panel-border bg-components-panel-bg">
<div className="flex h-full w-full items-center justify-center px-1">
<UserAvatarList
users={comment.participants}

View File

@ -23,7 +23,7 @@ export const CommentCursor: FC<CommentCursorProps> = memo(({ mousePosition }) =>
transform: 'translate(-50%, -50%)',
}}
>
<Comment />
<Comment className="text-text-primary" />
</div>
)
})

View File

@ -322,10 +322,10 @@ export const MentionInput: FC<MentionInputProps> = memo(({
{!isEditing && (
<div className="absolute bottom-0 right-1 z-20 flex items-end gap-1">
<div
className="z-20 flex h-8 w-8 cursor-pointer items-center justify-center rounded-lg bg-components-button-secondary-bg hover:bg-state-base-hover"
className="z-20 flex h-8 w-8 cursor-pointer items-center justify-center rounded-lg hover:bg-state-base-hover"
onClick={handleMentionButtonClick}
>
<RiAtLine className="h-4 w-4" />
<RiAtLine className="h-4 w-4 text-components-button-primary-text" />
</div>
<Button
className='z-20 ml-2 w-8 px-0'
@ -333,7 +333,7 @@ export const MentionInput: FC<MentionInputProps> = memo(({
disabled={!value.trim() || disabled || loading}
onClick={handleSubmit}
>
<RiArrowUpLine className='h-4 w-4' />
<RiArrowUpLine className='h-4 w-4 text-components-button-primary-text' />
</Button>
</div>
)}
@ -341,10 +341,10 @@ export const MentionInput: FC<MentionInputProps> = memo(({
{isEditing && (
<div className="absolute bottom-0 left-1 right-1 z-20 flex items-end justify-between">
<div
className="z-20 flex h-8 w-8 cursor-pointer items-center justify-center rounded-lg bg-components-button-secondary-bg hover:bg-state-base-hover"
className="z-20 flex h-8 w-8 cursor-pointer items-center justify-center rounded-lg hover:bg-state-base-hover"
onClick={handleMentionButtonClick}
>
<RiAtLine className="h-4 w-4" />
<RiAtLine className="h-4 w-4 text-components-button-primary-text" />
</div>
<div className='flex items-center gap-2'>
<Button variant='secondary' size='small' onClick={onCancel} disabled={loading}>
@ -365,7 +365,7 @@ export const MentionInput: FC<MentionInputProps> = memo(({
{showMentionDropdown && filteredMentionUsers.length > 0 && typeof document !== 'undefined' && createPortal(
<div
className="fixed z-[9999] max-h-40 w-64 overflow-y-auto rounded-lg border border-components-panel-border bg-white shadow-lg"
className="fixed z-[9999] max-h-40 w-64 overflow-y-auto rounded-lg border border-components-panel-border bg-components-panel-bg shadow-lg"
style={{
left: dropdownPosition.x,
top: dropdownPosition.y,

View File

@ -312,7 +312,7 @@ export const CommentThread: FC<CommentThreadProps> = memo(({
{t('workflow.comments.actions.editReply')}
</button>
<button
className='text-negative flex w-full items-center justify-start px-3 py-2 text-left text-sm hover:bg-state-base-hover'
className='text-negative flex w-full items-center justify-start px-3 py-2 text-left text-sm text-text-secondary hover:bg-state-base-hover'
onClick={() => {
setActiveReplyMenuId(null)
onReplyDelete?.(reply.id)

View File

@ -83,7 +83,7 @@ const OnlineUsers = () => {
}
return (
<div className="flex items-center rounded-full bg-white px-1 py-1">
<div className="flex items-center rounded-full border border-components-panel-border bg-components-panel-bg px-1 py-1">
<div className="flex items-center">
<div className="flex items-center -space-x-2">
{visibleUsers.map((user, index) => {
@ -114,7 +114,7 @@ const OnlineUsers = () => {
name={user.username || 'User'}
avatar={getAvatarUrl(user)}
size={28}
className="ring-2 ring-white"
className="ring-2 ring-components-panel-bg"
backgroundColor={userColor}
/>
</div>
@ -138,7 +138,7 @@ const OnlineUsers = () => {
'flex h-7 w-7 items-center justify-center',
'cursor-pointer rounded-full bg-gray-300',
'text-xs font-medium text-gray-700',
'ring-2 ring-white',
'ring-2 ring-components-panel-bg',
)}
>
+{remainingCount}

View File

@ -253,19 +253,19 @@ const ZoomInOut: FC<ZoomInOutProps> = ({
>
<div className='flex items-center space-x-2'>
{option.key === ZoomType.toggleUserComments && showUserComments && (
<RiCheckLine className='h-4 w-4 text-text-primary' />
<RiCheckLine className='h-4 w-4 text-text-accent' />
)}
{option.key === ZoomType.toggleUserComments && !showUserComments && (
<div className='h-4 w-4' />
)}
{option.key === ZoomType.toggleUserCursors && showUserCursors && (
<RiCheckLine className='h-4 w-4 text-text-primary' />
<RiCheckLine className='h-4 w-4 text-text-accent' />
)}
{option.key === ZoomType.toggleUserCursors && !showUserCursors && (
<div className='h-4 w-4' />
)}
{option.key === ZoomType.toggleMiniMap && showMiniMap && (
<RiCheckLine className='h-4 w-4 text-text-primary' />
<RiCheckLine className='h-4 w-4 text-text-accent' />
)}
{option.key === ZoomType.toggleMiniMap && !showMiniMap && (
<div className='h-4 w-4' />

View File

@ -66,7 +66,7 @@ const CommentsPanel = () => {
<div className='system-xl-semibold font-semibold leading-6 text-text-primary'>Comments</div>
<div className='relative flex items-center gap-2'>
<button
className='flex h-8 w-8 items-center justify-center rounded-md bg-white hover:bg-state-base-hover'
className='flex h-8 w-8 items-center justify-center rounded-md bg-components-panel-on-panel-item-bg hover:bg-state-base-hover'
aria-label='Filter comments'
onClick={() => setShowFilter(v => !v)}
>
@ -78,21 +78,21 @@ const CommentsPanel = () => {
className={cn('flex w-full items-center justify-between rounded-md px-2 py-2 text-left text-sm hover:bg-state-base-hover', filter === 'all' && 'bg-components-panel-on-panel-item-bg')}
onClick={() => handleFilterChange('all')}
>
<span>All</span>
<span className='text-text-secondary'>All</span>
{filter === 'all' && <RiCheckLine className='h-4 w-4 text-text-secondary' />}
</button>
<button
className={cn('mt-1 flex w-full items-center justify-between rounded-md px-2 py-2 text-left text-sm hover:bg-state-base-hover', filter === 'unresolved' && 'bg-components-panel-on-panel-item-bg')}
onClick={() => handleFilterChange('unresolved')}
>
<span>Unresolved</span>
<span className='text-text-secondary'>Unresolved</span>
{filter === 'unresolved' && <RiCheckLine className='h-4 w-4 text-text-secondary' />}
</button>
<button
className={cn('mt-1 flex w-full items-center justify-between rounded-md px-2 py-2 text-left text-sm hover:bg-state-base-hover', filter === 'mine' && 'bg-components-panel-on-panel-item-bg')}
onClick={() => handleFilterChange('mine')}
>
<span>Only your threads</span>
<span className='text-text-secondary'>Only your threads</span>
{filter === 'mine' && <RiCheckLine className='h-4 w-4 text-text-secondary' />}
</button>
</div>