mirror of
https://github.com/langgenius/dify.git
synced 2026-04-13 14:48:11 +08:00
fix dark theme
This commit is contained in:
parent
8c00f89e36
commit
4188c9a1dd
@ -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,
|
||||
|
||||
@ -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}
|
||||
|
||||
@ -23,7 +23,7 @@ export const CommentCursor: FC<CommentCursorProps> = memo(({ mousePosition }) =>
|
||||
transform: 'translate(-50%, -50%)',
|
||||
}}
|
||||
>
|
||||
<Comment />
|
||||
<Comment className="text-text-primary" />
|
||||
</div>
|
||||
)
|
||||
})
|
||||
|
||||
@ -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,
|
||||
|
||||
@ -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)
|
||||
|
||||
@ -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}
|
||||
|
||||
@ -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' />
|
||||
|
||||
@ -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>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user