index.tsx 997 B

12345678910111213141516171819202122232425262728293031323334353637383940414243
  1. import React from "react";
  2. import Head from "next/head";
  3. import styled from "styled-components";
  4. import Panes from "src/containers/Editor/Panes";
  5. import { Sidebar } from "src/components/Sidebar";
  6. import { Incompatible } from "src/containers/Incompatible";
  7. export const StyledPageWrapper = styled.div`
  8. display: flex;
  9. height: 100vh;
  10. `;
  11. export const StyledEditorWrapper = styled.div`
  12. width: 100%;
  13. overflow: hidden;
  14. @media only screen and (max-width: 568px) {
  15. display: none;
  16. }
  17. `;
  18. const EditorPage: React.FC = () => {
  19. return (
  20. <StyledEditorWrapper>
  21. <Head>
  22. <title>Editor | JSON Crack</title>
  23. <meta
  24. name="description"
  25. content="View your JSON data in graphs instantly."
  26. />
  27. </Head>
  28. <StyledPageWrapper>
  29. <Sidebar />
  30. <StyledEditorWrapper>
  31. <Panes />
  32. </StyledEditorWrapper>
  33. <Incompatible />
  34. </StyledPageWrapper>
  35. </StyledEditorWrapper>
  36. );
  37. };
  38. export default EditorPage;