estel/dify
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

Feat: workflow dark mode (#17785)

Browse Source
This commit is contained in:
KVOJJJin
2025-04-10 17:15:48 +08:00
committed by GitHub
parent 636a0ba37f
commit 17a26da1e6
75 changed files with 324 additions and 368 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
web/app/components/workflow/panel/workflow-preview.tsx
View File

@@ -49,29 +49,29 @@ const WorkflowPreview = () => {
return (
<div className={`
flex h-full w-[420px] flex-col rounded-l-2xl border-[0.5px] border-gray-200 bg-white shadow-xl
flex h-full w-[420px] flex-col rounded-l-2xl border-[0.5px] border-components-panel-border bg-components-panel-bg shadow-xl
`}>
<div className='flex items-center justify-between p-4 pb-1 text-base font-semibold text-gray-900'>
<div className='flex items-center justify-between p-4 pb-1 text-base font-semibold text-text-primary'>
{`Test Run${!workflowRunningData?.result.sequence_number ? '' : `#${workflowRunningData?.result.sequence_number}`}`}
<div className='cursor-pointer p-1' onClick={() => handleCancelDebugAndPreviewPanel()}>
<RiCloseLine className='h-4 w-4 text-gray-500' />
<RiCloseLine className='h-4 w-4 text-text-tertiary' />
</div>
</div>
<div className='relative flex grow flex-col'>
<div className='flex shrink-0 items-center border-b-[0.5px] border-[rgba(0,0,0,0.05)] px-4'>
<div className='flex shrink-0 items-center border-b-[0.5px] border-divider-subtle px-4'>
{showInputsPanel && (
<div
className={cn(
'mr-6 cursor-pointer border-b-2 border-transparent py-3 text-[13px] font-semibold leading-[18px] text-gray-400',
currentTab === 'INPUT' && '!border-[rgb(21,94,239)] text-gray-700',
'mr-6 cursor-pointer border-b-2 border-transparent py-3 text-[13px] font-semibold leading-[18px] text-text-tertiary',
currentTab === 'INPUT' && '!border-[rgb(21,94,239)] text-text-secondary',
)}
onClick={() => switchTab('INPUT')}
>{t('runLog.input')}</div>
)}
<div
className={cn(
'mr-6 cursor-pointer border-b-2 border-transparent py-3 text-[13px] font-semibold leading-[18px] text-gray-400',
currentTab === 'RESULT' && '!border-[rgb(21,94,239)] text-gray-700',
'mr-6 cursor-pointer border-b-2 border-transparent py-3 text-[13px] font-semibold leading-[18px] text-text-tertiary',
currentTab === 'RESULT' && '!border-[rgb(21,94,239)] text-text-secondary',
!workflowRunningData && '!cursor-not-allowed opacity-30',
)}
onClick={() => {
@@ -82,8 +82,8 @@ const WorkflowPreview = () => {
>{t('runLog.result')}</div>
<div
className={cn(
'mr-6 cursor-pointer border-b-2 border-transparent py-3 text-[13px] font-semibold leading-[18px] text-gray-400',
currentTab === 'DETAIL' && '!border-[rgb(21,94,239)] text-gray-700',
'mr-6 cursor-pointer border-b-2 border-transparent py-3 text-[13px] font-semibold leading-[18px] text-text-tertiary',
currentTab === 'DETAIL' && '!border-[rgb(21,94,239)] text-text-secondary',
!workflowRunningData && '!cursor-not-allowed opacity-30',
)}
onClick={() => {
@@ -94,8 +94,8 @@ const WorkflowPreview = () => {
>{t('runLog.detail')}</div>
<div
className={cn(
'mr-6 cursor-pointer border-b-2 border-transparent py-3 text-[13px] font-semibold leading-[18px] text-gray-400',
currentTab === 'TRACING' && '!border-[rgb(21,94,239)] text-gray-700',
'mr-6 cursor-pointer border-b-2 border-transparent py-3 text-[13px] font-semibold leading-[18px] text-text-tertiary',
currentTab === 'TRACING' && '!border-[rgb(21,94,239)] text-text-secondary',
!workflowRunningData && '!cursor-not-allowed opacity-30',
)}
onClick={() => {