### What problem does this PR solve? feat: modify DuckDuckGo's style #918 ### Type of change - [x] New Feature (non-breaking change which adds functionality)
This commit is contained in:
@@ -11,6 +11,8 @@ import NodeDropdown from './dropdown';
|
||||
import styles from './index.less';
|
||||
import NodePopover from './popover';
|
||||
|
||||
const ZeroGapOperators = [Operator.RewriteQuestion, Operator.KeywordExtract];
|
||||
|
||||
export function RagNode({
|
||||
id,
|
||||
data,
|
||||
@@ -47,20 +49,29 @@ export function RagNode({
|
||||
<Flex
|
||||
vertical
|
||||
align="center"
|
||||
justify={'center'}
|
||||
gap={data.label === Operator.RewriteQuestion ? 0 : 6}
|
||||
justify={'space-around'}
|
||||
gap={ZeroGapOperators.some((x) => x === data.label) ? 0 : 6}
|
||||
>
|
||||
<OperatorIcon
|
||||
name={data.label as Operator}
|
||||
fontSize={style?.iconFontSize ?? 24}
|
||||
></OperatorIcon>
|
||||
<span
|
||||
className={styles.type}
|
||||
style={{ fontSize: style?.fontSize ?? 14 }}
|
||||
>
|
||||
{t(lowerFirst(data.label))}
|
||||
</span>
|
||||
<NodeDropdown id={id}></NodeDropdown>
|
||||
<Flex flex={1} justify="center" align="center">
|
||||
<OperatorIcon
|
||||
name={data.label as Operator}
|
||||
fontSize={style?.iconFontSize ?? 24}
|
||||
width={style?.iconWidth}
|
||||
></OperatorIcon>
|
||||
</Flex>
|
||||
|
||||
<Flex flex={1}>
|
||||
<span
|
||||
className={styles.type}
|
||||
style={{ fontSize: style?.fontSize ?? 14 }}
|
||||
>
|
||||
{t(lowerFirst(data.label))}
|
||||
</span>
|
||||
</Flex>
|
||||
<Flex flex={1}>
|
||||
{' '}
|
||||
<NodeDropdown id={id}></NodeDropdown>
|
||||
</Flex>
|
||||
</Flex>
|
||||
|
||||
<section className={styles.bottomBox}>
|
||||
|
||||
@@ -47,18 +47,24 @@ export function RelevantNode({ id, data, selected }: NodeProps<NodeData>) {
|
||||
></Handle>
|
||||
<CategorizeHandle top={20} right={6} text={'yes'}></CategorizeHandle>
|
||||
<CategorizeHandle top={80} right={6} text={'no'}></CategorizeHandle>
|
||||
<Flex vertical align="center" justify="center">
|
||||
<OperatorIcon
|
||||
name={data.label as Operator}
|
||||
fontSize={style.iconFontSize}
|
||||
></OperatorIcon>
|
||||
<span
|
||||
className={styles.type}
|
||||
style={{ fontSize: style.fontSize ?? 14 }}
|
||||
>
|
||||
{t(lowerFirst(data.label))}
|
||||
</span>
|
||||
<NodeDropdown id={id}></NodeDropdown>
|
||||
<Flex vertical align="center" justify="center" gap={0}>
|
||||
<Flex flex={1}>
|
||||
<OperatorIcon
|
||||
name={data.label as Operator}
|
||||
fontSize={style.iconFontSize}
|
||||
></OperatorIcon>
|
||||
</Flex>
|
||||
<Flex flex={1}>
|
||||
<span
|
||||
className={styles.type}
|
||||
style={{ fontSize: style.fontSize ?? 14 }}
|
||||
>
|
||||
{t(lowerFirst(data.label))}
|
||||
</span>
|
||||
</Flex>
|
||||
<Flex flex={1}>
|
||||
<NodeDropdown id={id}></NodeDropdown>
|
||||
</Flex>
|
||||
</Flex>
|
||||
<section className={styles.bottomBox}>
|
||||
<div className={styles.nodeName}>{data.name}</div>
|
||||
|
||||
Reference in New Issue
Block a user