mirror of https://github.com/langgenius/dify.git
header
This commit is contained in:
StyleZhang
parent
da84ba06c7
commit
dce01cf002
|
|
@ -0,0 +1,8 @@
|
|||
<svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g id="edit-03">
|
||||
<g id="Solid">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M5.50004 10.0001C5.50004 9.72398 5.7239 9.50012 6.00004 9.50012H10.5C10.7762 9.50012 11 9.72398 11 10.0001C11 10.2763 10.7762 10.5001 10.5 10.5001H6.00004C5.7239 10.5001 5.50004 10.2763 5.50004 10.0001Z" fill="#98A2B3"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M7.89651 1.39656C8.50599 0.787085 9.49414 0.787084 10.1036 1.39656C10.7131 2.00604 10.7131 2.99419 10.1036 3.60367L3.82225 9.88504C3.81235 9.89494 3.80254 9.90476 3.79281 9.91451C3.64909 10.0585 3.52237 10.1855 3.3696 10.2791C3.23539 10.3613 3.08907 10.4219 2.93602 10.4587C2.7618 10.5005 2.58242 10.5003 2.37897 10.5001C2.3652 10.5001 2.35132 10.5001 2.33732 10.5001H1.50005C1.22391 10.5001 1.00005 10.2763 1.00005 10.0001V9.16286C1.00005 9.14886 1.00004 9.13497 1.00003 9.1212C0.999836 8.91776 0.999669 8.73838 1.0415 8.56416C1.07824 8.4111 1.13885 8.26479 1.22109 8.13058C1.31471 7.97781 1.44166 7.85109 1.58566 7.70736C1.5954 7.69764 1.60523 7.68783 1.61513 7.67793L7.89651 1.39656Z" fill="#98A2B3"/>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.1 KiB |
|
|
@ -0,0 +1,57 @@
|
|||
{
|
||||
"icon": {
|
||||
"type": "element",
|
||||
"isRootNode": true,
|
||||
"name": "svg",
|
||||
"attributes": {
|
||||
"width": "12",
|
||||
"height": "12",
|
||||
"viewBox": "0 0 12 12",
|
||||
"fill": "none",
|
||||
"xmlns": "http://www.w3.org/2000/svg"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"type": "element",
|
||||
"name": "g",
|
||||
"attributes": {
|
||||
"id": "edit-03"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"type": "element",
|
||||
"name": "g",
|
||||
"attributes": {
|
||||
"id": "Solid"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"type": "element",
|
||||
"name": "path",
|
||||
"attributes": {
|
||||
"fill-rule": "evenodd",
|
||||
"clip-rule": "evenodd",
|
||||
"d": "M5.50004 10.0001C5.50004 9.72398 5.7239 9.50012 6.00004 9.50012H10.5C10.7762 9.50012 11 9.72398 11 10.0001C11 10.2763 10.7762 10.5001 10.5 10.5001H6.00004C5.7239 10.5001 5.50004 10.2763 5.50004 10.0001Z",
|
||||
"fill": "currentColor"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "path",
|
||||
"attributes": {
|
||||
"fill-rule": "evenodd",
|
||||
"clip-rule": "evenodd",
|
||||
"d": "M7.89651 1.39656C8.50599 0.787085 9.49414 0.787084 10.1036 1.39656C10.7131 2.00604 10.7131 2.99419 10.1036 3.60367L3.82225 9.88504C3.81235 9.89494 3.80254 9.90476 3.79281 9.91451C3.64909 10.0585 3.52237 10.1855 3.3696 10.2791C3.23539 10.3613 3.08907 10.4219 2.93602 10.4587C2.7618 10.5005 2.58242 10.5003 2.37897 10.5001C2.3652 10.5001 2.35132 10.5001 2.33732 10.5001H1.50005C1.22391 10.5001 1.00005 10.2763 1.00005 10.0001V9.16286C1.00005 9.14886 1.00004 9.13497 1.00003 9.1212C0.999836 8.91776 0.999669 8.73838 1.0415 8.56416C1.07824 8.4111 1.13885 8.26479 1.22109 8.13058C1.31471 7.97781 1.44166 7.85109 1.58566 7.70736C1.5954 7.69764 1.60523 7.68783 1.61513 7.67793L7.89651 1.39656Z",
|
||||
"fill": "currentColor"
|
||||
},
|
||||
"children": []
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
"name": "Edit03"
|
||||
}
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
// GENERATE BY script
|
||||
// DON NOT EDIT IT MANUALLY
|
||||
|
||||
import * as React from 'react'
|
||||
import data from './Edit03.json'
|
||||
import IconBase from '@/app/components/base/icons/IconBase'
|
||||
import type { IconBaseProps, IconData } from '@/app/components/base/icons/IconBase'
|
||||
|
||||
const Icon = React.forwardRef<React.MutableRefObject<SVGElement>, Omit<IconBaseProps, 'data'>>((
|
||||
props,
|
||||
ref,
|
||||
) => <IconBase {...props} ref={ref} data={data as IconData} />)
|
||||
|
||||
Icon.displayName = 'Edit03'
|
||||
|
||||
export default Icon
|
||||
|
|
@ -2,6 +2,7 @@ export { default as AnswerTriangle } from './AnswerTriangle'
|
|||
export { default as CheckCircle } from './CheckCircle'
|
||||
export { default as CheckDone01 } from './CheckDone01'
|
||||
export { default as Download02 } from './Download02'
|
||||
export { default as Edit03 } from './Edit03'
|
||||
export { default as Edit04 } from './Edit04'
|
||||
export { default as Eye } from './Eye'
|
||||
export { default as MessageClockCircle } from './MessageClockCircle'
|
||||
|
|
|
|||
|
|
@ -1,12 +1,31 @@
|
|||
import { Edit03 } from '@/app/components/base/icons/src/vender/solid/general'
|
||||
import Button from '@/app/components/base/button'
|
||||
|
||||
const Header = () => {
|
||||
return (
|
||||
<div
|
||||
className='absolute top-0 left-0 w-full h-14 z-10'
|
||||
className='absolute top-0 left-0 flex items-center justify-between px-3 w-full h-14 z-10'
|
||||
style={{
|
||||
background: 'linear-gradient(180deg, #F9FAFB 0%, rgba(249, 250, 251, 0.00) 100%)',
|
||||
}}
|
||||
>
|
||||
|
||||
<div>
|
||||
<div className='text-xs font-medium text-gray-700'>Fitness and Nutrition Expert</div>
|
||||
<div className='flex items-center'>
|
||||
<div className='flex items-center text-xs text-gray-500'>
|
||||
<Edit03 className='mr-1 w-3 h-3 text-gray-400' />
|
||||
Editing
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<Button
|
||||
type='primary'
|
||||
className='px-3 py-0 h-8 text-[13px] font-medium'
|
||||
>
|
||||
publish
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -31,54 +31,56 @@ const BasePanel: FC<BasePanelProps> = ({
|
|||
} = useWorkflowContext()
|
||||
|
||||
return (
|
||||
<div className='absolute top-2 right-2 bottom-2 w-[420px] bg-white shadow-lg border-[0.5px] border-gray-200 rounded-2xl z-20'>
|
||||
<div className='flex items-center px-4 pt-3'>
|
||||
<BlockIcon
|
||||
className='shrink-0 mr-2'
|
||||
type={selectedNode!.data.type}
|
||||
size='md'
|
||||
/>
|
||||
<div className='grow py-1 text-base text-gray-900 font-semibold '>LLM</div>
|
||||
<div className='shrink-0 flex items-center'>
|
||||
<div
|
||||
className='w-6 h-6 cursor-pointer'
|
||||
onClick={() => handleSelectedNodeIdChange('')}
|
||||
>
|
||||
<XClose className='w-4 h-4 text-gray-500' />
|
||||
<div className='absolute top-2 right-2 bottom-2 w-[420px] bg-white shadow-lg border-[0.5px] border-gray-200 rounded-2xl z-20 overflow-y-auto'>
|
||||
<div className='sticky top-0 bg-white'>
|
||||
<div className='flex items-center px-4 pt-3'>
|
||||
<BlockIcon
|
||||
className='shrink-0 mr-2'
|
||||
type={selectedNode!.data.type}
|
||||
size='md'
|
||||
/>
|
||||
<div className='grow py-1 text-base text-gray-900 font-semibold '>LLM</div>
|
||||
<div className='shrink-0 flex items-center'>
|
||||
<div
|
||||
className='w-6 h-6 cursor-pointer'
|
||||
onClick={() => handleSelectedNodeIdChange('')}
|
||||
>
|
||||
<XClose className='w-4 h-4 text-gray-500' />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className='p-2'>
|
||||
<div className='py-[5px] pl-1.5 pr-2 text-xs text-gray-400'>
|
||||
Add description...
|
||||
</div>
|
||||
</div>
|
||||
{
|
||||
(inputsElement || outputsElement) && (
|
||||
<div className='flex items-center px-4 h-[42px]'>
|
||||
{
|
||||
inputsElement && (
|
||||
<div
|
||||
className='cursor-pointer'
|
||||
onClick={() => setActiveTab(TabEnum.Inputs)}
|
||||
>
|
||||
inputs
|
||||
</div>
|
||||
)
|
||||
}
|
||||
{
|
||||
outputsElement && (
|
||||
<div
|
||||
className='ml-4 cursor-pointer'
|
||||
onClick={() => setActiveTab(TabEnum.Outputs)}
|
||||
>
|
||||
outpus
|
||||
</div>
|
||||
)
|
||||
}
|
||||
<div className='p-2'>
|
||||
<div className='py-[5px] pl-1.5 pr-2 text-xs text-gray-400'>
|
||||
Add description...
|
||||
</div>
|
||||
)
|
||||
}
|
||||
</div>
|
||||
{
|
||||
(inputsElement || outputsElement) && (
|
||||
<div className='flex items-center px-4 h-[42px]'>
|
||||
{
|
||||
inputsElement && (
|
||||
<div
|
||||
className='cursor-pointer'
|
||||
onClick={() => setActiveTab(TabEnum.Inputs)}
|
||||
>
|
||||
inputs
|
||||
</div>
|
||||
)
|
||||
}
|
||||
{
|
||||
outputsElement && (
|
||||
<div
|
||||
className='ml-4 cursor-pointer'
|
||||
onClick={() => setActiveTab(TabEnum.Outputs)}
|
||||
>
|
||||
outpus
|
||||
</div>
|
||||
)
|
||||
}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
</div>
|
||||
<div className='py-2 border-t-[0.5px] border-b-[0.5px] border-black/5'>
|
||||
{defaultElement}
|
||||
{activeTab === TabEnum.Inputs && inputsElement}
|
||||
|
|
|
|||
Loading…
Reference in New Issue