GitHub/jsoncrack.com
1
0
Fork 0
mirror of https://github.com/AykutSarac/jsoncrack.com.git synced 2025-01-12 19:02:53 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix widget view

Browse Source
This commit is contained in:
AykutSarac 2023-04-29 19:05:40 +03:00
parent 701267a5f1
commit 3acd81b63c
No known key found for this signature in database
2 changed files with 96 additions and 79 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/Graph/index.tsx
View File

@ -134,7 +134,7 @@ export const Graph = ({ isWidget = false }: GraphProps) => {
return (
<>
<Loading message="Painting graph..." loading={loading} />
<StyledEditorWrapper widget={isWidget}>
<StyledEditorWrapper onContextMenu={e => e.preventDefault()} widget={isWidget}>
<TransformWrapper
maxScale={2}
minScale={0.05}

31
src/containers/Editor/LiveEditor/Tools.tsx
View File

@ -1,6 +1,6 @@
import React from "react";
import styled from "styled-components";
import { Flex, Menu, Text } from "@mantine/core";
import { Flex, Group, Menu, Text } from "@mantine/core";
import { useHotkeys } from "@mantine/hooks";
import toast from "react-hot-toast";
import { AiOutlineFullscreen, AiOutlineMinus, AiOutlinePlus } from "react-icons/ai";
@ -29,7 +29,7 @@ export const StyledTools = styled.div`
gap: 4px;
justify-content: space-between;
height: 36px;
padding: 4px 16px;
padding: 4px 8px;
background: ${({ theme }) => theme.BACKGROUND_SECONDARY};
color: ${({ theme }) => theme.SILVER};
box-shadow: 0 1px 0px ${({ theme }) => theme.BACKGROUND_TERTIARY};
@ -152,8 +152,22 @@ export const Tools: React.FC<{ isWidget?: boolean }> = ({ isWidget = false }) =>
return (
<StyledTools>
<Section>
<StyledToolElement as="a" title="Herowand" href="https://herowand.com">
{isWidget && (
<StyledToolElement as="a" title="JSON Crack" href="https://herowand.com">
<Flex gap="xs" align="center" justify="center">
<StyledLogo
src="/assets/icon.png"
width="auto"
height="16"
alt="logo"
invert={lightmode}
/>
</Flex>
</StyledToolElement>
)}
{!isWidget && (
<Group spacing="xs" position="left" w="100%">
<StyledToolElement as="a" title="Herowand" href="https://jsoncrack.com">
<Flex gap="xs" align="center" justify="center">
<StyledLogo
src="/assets/icon.png"
@ -232,17 +246,20 @@ export const Tools: React.FC<{ isWidget?: boolean }> = ({ isWidget = false }) =>
<StyledToolElement title="Download as File" onClick={handleSave}>
Download
</StyledToolElement>
</Section>
<Section>
</Group>
)}
<Group spacing="xs" position="right" w="100%">
<StyledToolElement title="Zoom Out" onClick={zoomOut}>
<AiOutlineMinus size="18" />
</StyledToolElement>
<StyledToolElement title="Zoom In" onClick={zoomIn}>
<AiOutlinePlus size="18" />
</StyledToolElement>
{!isWidget && (
<StyledToolElement title="Save as Image" onClick={() => setVisible("download")(true)}>
<FiDownload size="18" />
</StyledToolElement>
)}
<StyledToolElement title="Center Canvas" onClick={centerView}>
<MdCenterFocusWeak size="18" />
</StyledToolElement>
@ -257,7 +274,7 @@ export const Tools: React.FC<{ isWidget?: boolean }> = ({ isWidget = false }) =>
>
<VscSettingsGear size="18" />
</StyledToolElement>
</Section>
</Group>
</StyledTools>
);
};