mirror of
https://github.com/AykutSarac/jsoncrack.com.git
synced 2025-01-27 15:22:56 +08:00
add loading to editor lazy loadings
This commit is contained in:
parent
caa9c8b318
commit
a466bfa7ad
@ -8,13 +8,16 @@ import { Button } from "src/components/Button";
|
||||
import { defaultJson } from "src/constants/data";
|
||||
import dynamic from "next/dynamic";
|
||||
import { LiveEditor } from "src/containers/LiveEditor";
|
||||
import { Loading } from "src/components/Loading";
|
||||
|
||||
const JsonEditor = dynamic(() => import("src/containers/JsonEditor"), {
|
||||
ssr: false,
|
||||
loading: () => <Loading />,
|
||||
});
|
||||
|
||||
const Sidebar = dynamic(() => import("src/components/Sidebar"), {
|
||||
ssr: false,
|
||||
loading: () => <Loading />,
|
||||
});
|
||||
|
||||
const StyledPageWrapper = styled.div`
|
||||
@ -78,9 +81,9 @@ const StyledEditor = styled(SplitPane)`
|
||||
.Resizer {
|
||||
background: #000;
|
||||
opacity: 0.2;
|
||||
z-index: 1;
|
||||
box-sizing: border-box;
|
||||
background-clip: padding-box;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.Resizer:hover {
|
||||
@ -107,6 +110,7 @@ const StyledEditor = styled(SplitPane)`
|
||||
border-left: 5px solid rgba(255, 255, 255, 0);
|
||||
border-right: 5px solid rgba(255, 255, 255, 0);
|
||||
cursor: col-resize;
|
||||
z-index: 0 !important;
|
||||
}
|
||||
|
||||
.Resizer.vertical:hover {
|
||||
@ -124,7 +128,7 @@ const StyledEditor = styled(SplitPane)`
|
||||
`;
|
||||
|
||||
const Editor: React.FC = () => {
|
||||
const [json, setJson] = React.useState<string>(JSON.stringify(defaultJson));
|
||||
const [json, setJson] = React.useState(JSON.stringify(defaultJson));
|
||||
const route = useRouter();
|
||||
|
||||
React.useEffect(() => {
|
||||
|
Loading…
x
Reference in New Issue
Block a user