Dark Mode: Workflow darkmode style (#11695)

This commit is contained in:
NFish
2024-12-17 12:20:49 +08:00
committed by GitHub
parent 92a840f1b2
commit a399502ecd
26 changed files with 179 additions and 158 deletions

View File

@@ -5,6 +5,7 @@ import {
} from 'react'
import { useTranslation } from 'react-i18next'
import { useClickAway } from 'ahooks'
import Divider from '../base/divider'
import ShortcutsName from './shortcuts-name'
import { useStore } from './store'
import {
@@ -41,7 +42,7 @@ const PanelContextmenu = () => {
const renderTrigger = () => {
return (
<div
className='flex items-center justify-between px-3 h-8 text-sm text-gray-700 rounded-lg cursor-pointer hover:bg-gray-50'
className='flex items-center justify-between px-3 h-8 text-sm text-text-secondary rounded-lg cursor-pointer hover:bg-state-base-hover'
>
{t('workflow.common.addBlock')}
</div>
@@ -53,7 +54,7 @@ const PanelContextmenu = () => {
return (
<div
className='absolute w-[200px] rounded-lg border-[0.5px] border-gray-200 bg-white shadow-xl z-[9]'
className='absolute w-[200px] rounded-lg border-[0.5px] border-components-panel-border bg-components-panel-bg-blur shadow-lg z-[9]'
style={{
left: panelMenu.left,
top: panelMenu.top,
@@ -69,7 +70,7 @@ const PanelContextmenu = () => {
}}
/>
<div
className='flex items-center justify-between px-3 h-8 text-sm text-gray-700 rounded-lg cursor-pointer hover:bg-gray-50'
className='flex items-center justify-between px-3 h-8 text-sm text-text-secondary rounded-lg cursor-pointer hover:bg-state-base-hover'
onClick={(e) => {
e.stopPropagation()
handleAddNote()
@@ -79,7 +80,7 @@ const PanelContextmenu = () => {
{t('workflow.nodes.note.addNote')}
</div>
<div
className='flex items-center justify-between px-3 h-8 text-sm text-gray-700 rounded-lg cursor-pointer hover:bg-gray-50'
className='flex items-center justify-between px-3 h-8 text-sm text-text-secondary rounded-lg cursor-pointer hover:bg-state-base-hover'
onClick={() => {
handleStartWorkflowRun()
handlePaneContextmenuCancel()
@@ -89,12 +90,12 @@ const PanelContextmenu = () => {
<ShortcutsName keys={['alt', 'r']} />
</div>
</div>
<div className='h-[1px] bg-gray-100'></div>
<Divider className='m-0' />
<div className='p-1'>
<div
className={cn(
'flex items-center justify-between px-3 h-8 text-sm text-gray-700 rounded-lg cursor-pointer',
!clipboardElements.length ? 'opacity-50 cursor-not-allowed' : 'hover:bg-gray-50',
'flex items-center justify-between px-3 h-8 text-sm text-text-secondary rounded-lg cursor-pointer',
!clipboardElements.length ? 'opacity-50 cursor-not-allowed' : 'hover:bg-state-base-hover',
)}
onClick={() => {
if (clipboardElements.length) {
@@ -107,16 +108,16 @@ const PanelContextmenu = () => {
<ShortcutsName keys={['ctrl', 'v']} />
</div>
</div>
<div className='h-[1px] bg-gray-100'></div>
<Divider className='m-0' />
<div className='p-1'>
<div
className='flex items-center justify-between px-3 h-8 text-sm text-gray-700 rounded-lg cursor-pointer hover:bg-gray-50'
className='flex items-center justify-between px-3 h-8 text-sm text-text-secondary rounded-lg cursor-pointer hover:bg-state-base-hover'
onClick={() => exportCheck()}
>
{t('app.export')}
</div>
<div
className='flex items-center justify-between px-3 h-8 text-sm text-gray-700 rounded-lg cursor-pointer hover:bg-gray-50'
className='flex items-center justify-between px-3 h-8 text-sm text-text-secondary rounded-lg cursor-pointer hover:bg-state-base-hover'
onClick={() => setShowImportDSLModal(true)}
>
{t('workflow.common.importDSL')}