mirror of https://github.com/logseq/logseq
cleanup code + format
parent
126129fc71
commit
d78356c8c6
|
@ -8,9 +8,8 @@ import { Minimap } from '~components/Minimap'
|
|||
import { RedoIcon, UndoIcon } from '~components/icons'
|
||||
import { ZoomMenu } from '~components/ZoomMenu'
|
||||
|
||||
export const ActionBar = observer(function ToolBar(): JSX.Element {
|
||||
export const ActionBar = observer(function ActionBar(): JSX.Element {
|
||||
const app = useApp<Shape>()
|
||||
//Use state isOpen
|
||||
const undo = React.useCallback(() => {
|
||||
app.api.undo()
|
||||
}, [app])
|
||||
|
@ -21,7 +20,6 @@ export const ActionBar = observer(function ToolBar(): JSX.Element {
|
|||
|
||||
return (
|
||||
<div className="action-bar">
|
||||
{/* <button>minimap</button> */}
|
||||
<Minimap></Minimap>
|
||||
<button onClick={undo}>
|
||||
<UndoIcon></UndoIcon>
|
||||
|
|
|
@ -1,9 +1,9 @@
|
|||
import React from 'react';
|
||||
import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
|
||||
import { useApp } from '@tldraw/react';
|
||||
import React from 'react'
|
||||
import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu'
|
||||
import { useApp } from '@tldraw/react'
|
||||
|
||||
export const ZoomMenu = () => {
|
||||
const app = useApp();
|
||||
const app = useApp()
|
||||
const preventEvent = (e: Event) => {
|
||||
e.preventDefault()
|
||||
}
|
||||
|
@ -11,30 +11,53 @@ export const ZoomMenu = () => {
|
|||
<div>
|
||||
<DropdownMenuPrimitive.Root>
|
||||
<DropdownMenuPrimitive.Trigger>
|
||||
<label>{(app.viewport.camera.zoom * 100).toFixed(0) + "%"} </label>
|
||||
<button>{(app.viewport.camera.zoom * 100).toFixed(0) + '%'} </button>
|
||||
</DropdownMenuPrimitive.Trigger>
|
||||
<DropdownMenuPrimitive.Content className='dropdown-menu-button' id="zoomPopup" sideOffset={12} >
|
||||
<DropdownMenuPrimitive.Arrow style={{ fill: "white" }}></DropdownMenuPrimitive.Arrow>
|
||||
<DropdownMenuPrimitive.Item className="dropdown-item" onSelect={preventEvent} onClick={app.api.zoomToFit}>
|
||||
<DropdownMenuPrimitive.Content
|
||||
className="dropdown-menu-button"
|
||||
id="zoomPopup"
|
||||
sideOffset={12}
|
||||
>
|
||||
<DropdownMenuPrimitive.Arrow style={{ fill: 'white' }}></DropdownMenuPrimitive.Arrow>
|
||||
<DropdownMenuPrimitive.Item
|
||||
className="dropdown-item"
|
||||
onSelect={preventEvent}
|
||||
onClick={app.api.zoomToFit}
|
||||
>
|
||||
Zoom to Fit <div className="right-slot"></div>
|
||||
</DropdownMenuPrimitive.Item>
|
||||
<DropdownMenuPrimitive.Item className="dropdown-item" onSelect={preventEvent} onClick={app.api.zoomToSelection}>
|
||||
<DropdownMenuPrimitive.Item
|
||||
className="dropdown-item"
|
||||
onSelect={preventEvent}
|
||||
onClick={app.api.zoomToSelection}
|
||||
>
|
||||
Zoom to Selection <div className="right-slot">⌘+Minus</div>
|
||||
</DropdownMenuPrimitive.Item>
|
||||
<DropdownMenuPrimitive.Item className="dropdown-item" onSelect={preventEvent} onClick={app.api.zoomIn}>
|
||||
<DropdownMenuPrimitive.Item
|
||||
className="dropdown-item"
|
||||
onSelect={preventEvent}
|
||||
onClick={app.api.zoomIn}
|
||||
>
|
||||
Zoom In <div className="right-slot">⌘+Plus</div>
|
||||
</DropdownMenuPrimitive.Item>
|
||||
<DropdownMenuPrimitive.Item className="dropdown-item" onSelect={preventEvent} onClick={app.api.zoomOut}>
|
||||
<DropdownMenuPrimitive.Item
|
||||
className="dropdown-item"
|
||||
onSelect={preventEvent}
|
||||
onClick={app.api.zoomOut}
|
||||
>
|
||||
Zoom Out <div className="right-slot">⌘+Minus</div>
|
||||
</DropdownMenuPrimitive.Item>
|
||||
<DropdownMenuPrimitive.Item className="dropdown-item" onSelect={preventEvent} onClick={app.api.resetZoom}>
|
||||
<DropdownMenuPrimitive.Item
|
||||
className="dropdown-item"
|
||||
onSelect={preventEvent}
|
||||
onClick={app.api.resetZoom}
|
||||
>
|
||||
Reset Zoom <div className="right-slot">⇧+0</div>
|
||||
</DropdownMenuPrimitive.Item>
|
||||
</DropdownMenuPrimitive.Content>
|
||||
</DropdownMenuPrimitive.Root>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default ZoomMenu;
|
||||
)
|
||||
}
|
||||
|
||||
export default ZoomMenu
|
||||
|
|
Loading…
Reference in New Issue