mirror of
https://gitee.com/ByteDance/flowgram.ai.git
synced 2025-07-07 17:43:29 +08:00
feat(free-demo): beautify tools style
This commit is contained in:
parent
3c625c0e9a
commit
08f8fe335f
@ -21,7 +21,7 @@ export const AddNode = (props: { disabled: boolean }) => {
|
||||
padding: 0,
|
||||
}}
|
||||
>
|
||||
<Button icon={<IconPlus />} color="highlight" disabled={props.disabled}>
|
||||
<Button icon={<IconPlus />} color="highlight" style={{ backgroundColor: "rgba(171,181,255,0.3)", borderRadius: "8px" }} disabled={props.disabled}>
|
||||
Add Node
|
||||
</Button>
|
||||
</Popover>
|
||||
|
||||
@ -26,7 +26,9 @@ export const AutoLayout = () => {
|
||||
|
||||
return (
|
||||
<Tooltip content={'Auto Layout'}>
|
||||
<IconButton onClick={autoLayout} icon={icon} />
|
||||
<IconButton
|
||||
type="tertiary"
|
||||
theme="borderless" onClick={autoLayout} icon={icon} />
|
||||
</Tooltip>
|
||||
);
|
||||
};
|
||||
|
||||
@ -49,6 +49,8 @@ export const DemoTools = () => {
|
||||
<Readonly />
|
||||
<Tooltip content="Undo">
|
||||
<IconButton
|
||||
type="tertiary"
|
||||
theme="borderless"
|
||||
icon={<IconUndo />}
|
||||
disabled={!canUndo}
|
||||
onClick={() => history.undo()}
|
||||
@ -56,6 +58,8 @@ export const DemoTools = () => {
|
||||
</Tooltip>
|
||||
<Tooltip content="Redo">
|
||||
<IconButton
|
||||
type="tertiary"
|
||||
theme="borderless"
|
||||
icon={<IconRedo />}
|
||||
disabled={!canRedo}
|
||||
onClick={() => history.redo()}
|
||||
@ -63,6 +67,7 @@ export const DemoTools = () => {
|
||||
</Tooltip>
|
||||
<Divider layout="vertical" style={{ height: '16px' }} margin={3} />
|
||||
<AddNode disabled={playground.config.readonly} />
|
||||
<Divider layout="vertical" style={{ height: '16px' }} margin={3} />
|
||||
<Save disabled={playground.config.readonly} />
|
||||
</ToolSection>
|
||||
</ToolContainer>
|
||||
|
||||
@ -11,6 +11,8 @@ export const MinimapSwitch = (props: {
|
||||
return (
|
||||
<Tooltip content="Minimap">
|
||||
<IconButton
|
||||
type="tertiary"
|
||||
theme="borderless"
|
||||
icon={<UIIconGridRectangle visible={minimapVisible} />}
|
||||
onClick={() => setMinimapVisible(!minimapVisible)}
|
||||
/>
|
||||
|
||||
@ -42,14 +42,14 @@ export function Save(props: { disabled: boolean }) {
|
||||
|
||||
if (errorCount === 0) {
|
||||
return (
|
||||
<Button disabled={props.disabled} onClick={onSave}>
|
||||
<Button disabled={props.disabled} onClick={onSave} style={{ backgroundColor: "rgba(171,181,255,0.3)", borderRadius: "8px" }}>
|
||||
Save
|
||||
</Button>
|
||||
);
|
||||
}
|
||||
return (
|
||||
<Badge count={errorCount} position="rightTop" type="danger">
|
||||
<Button type="danger" disabled={props.disabled} onClick={onSave}>
|
||||
<Button type="danger" disabled={props.disabled} onClick={onSave} style={{ backgroundColor: "rgba(255, 179, 171, 0.3)", borderRadius: "8px" }} >
|
||||
Save
|
||||
</Button>
|
||||
</Badge>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user