GitHub/jsoncrack.com
1
0
Fork 0
mirror of https://github.com/AykutSarac/jsoncrack.com.git synced 2025-01-27 15:22:56 +08:00
Code Issues Packages Projects Releases Wiki Activity

improve highlight styling

Browse Source
This commit is contained in:
AykutSarac 2023-01-15 14:36:42 +03:00
parent 9bc781bddd
commit 9f9f30b760
2 changed files with 8 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
src/components/CustomNode/TextNode.tsx
View File

@ -22,7 +22,7 @@ const StyledExpand = styled.button`
} }
`; `;
const StyledTextNodeWrapper = styled.div<{ hasCollapse: boolean }>` const StyledTextNodeWrapper = styled.span<{ hasCollapse: boolean }>`
display: flex; display: flex;
justify-content: ${({ hasCollapse }) => (hasCollapse ? "space-between" : "center")}; justify-content: ${({ hasCollapse }) => (hasCollapse ? "space-between" : "center")};
align-items: center; align-items: center;
@ -74,13 +74,13 @@ const TextNode: React.FC<CustomNodeProps> = ({ node, x, y, hasCollapse = false }
<StyledImage src={text} width="70" height="70" /> <StyledImage src={text} width="70" height="70" />
</StyledImageWrapper> </StyledImageWrapper>
) : ( ) : (
<StyledTextNodeWrapper hasCollapse={data.parent && hideCollapse}> <StyledTextNodeWrapper
<Styled.StyledKey hasCollapse={data.parent && hideCollapse}
data-x={x} data-x={x}
data-y={y} data-y={y}
data-key={JSON.stringify(text)} data-key={JSON.stringify(text)}
parent={data.parent} >
> <Styled.StyledKey parent={data.parent}>
<Styled.StyledLinkItUrl> <Styled.StyledLinkItUrl>
{JSON.stringify(text).replaceAll('"', "")} {JSON.stringify(text).replaceAll('"', "")}
</Styled.StyledLinkItUrl> </Styled.StyledLinkItUrl>

1
src/components/CustomNode/styles.tsx
View File

@ -36,7 +36,6 @@ export const StyledForeignObject = styled.foreignObject<{
} }
.highlight { .highlight {
border: 2px dashed #ff2970;
background: rgba(255, 214, 0, 0.3); background: rgba(255, 214, 0, 0.3);
} }