[update] static file

.babelrc

@@ -28,7 +28,7 @@
           { "removeNonInheritableGroupAttrs": true },
           { "removeUselessStrokeAndFill": true },
           { "removeUnusedNS": true },
-          { "cleanupIDs": false },
+          { "cleanupIDs": true },
           { "cleanupNumericValues": true },
           { "cleanupListOfValues": true },
           { "moveElemsAttrsToGroup": true },

.gitignore

@@ -10,6 +10,8 @@
 /build
 /dist
 /.next
+/out
+demo.tsx
 
 # misc
 .DS_Store

containers/Navbar.tsx

@@ -0,0 +1,27 @@
+import React from 'react';
+
+import { useStore } from '../store';
+import { switchNavbar } from '../actions';
+
+import NavbarComponent from '../components/Navbar';
+
+const Navbar = () => {
+  const [{ navbarState }, dispatch] = useStore();
+
+  const onClick = (state: string) => {
+    if (state === navbarState) {
+      dispatch(switchNavbar(''));  
+    } else {
+      dispatch(switchNavbar(state));
+    }
+  };
+
+  return (
+    <NavbarComponent
+      onClick={onClick}
+      navbarState={navbarState}
+    />
+  );
+};
+
+export default Navbar;

containers/Pdf.tsx

@@ -8,7 +8,7 @@ const PdfContainer: React.FunctionComponent = () => {
   // const dispatch = useDispatch();
 
   return (
-    <PdfComponent src="/pdfs/QuickStartGuide.pdf" />
+    <PdfComponent src="/static/Quick Start Guide.pdf" />
   );
 }
 

containers/Sidebar.tsx

@@ -0,0 +1,48 @@
+import React from 'react';
+
+import Button from '../components/Button';
+import Typography from '../components/Typography';
+import Icon from '../components/Icon';
+import MarkupTools from '../components/MarkupTools';
+import CreateForm from '../components/CreateForm';
+import Watermark from '../components/Watermark';
+
+import { useStore } from '../store';
+import { switchSidebar } from '../actions';
+
+import { BtnWrapper } from '../global/toolStyled';
+import { SidebarWrapper } from '../global/otherStyled';
+
+const Sidebar = () => {
+  const [{ sidebarState }, dispatch] = useStore();
+
+  const onClick = (state: string) => {
+    if (state === sidebarState) {
+      dispatch(switchSidebar(''));  
+    } else {
+      dispatch(switchSidebar(state));
+    }
+  };
+
+  const transferProps = {
+    onClick,
+    sidebarState,
+  }
+
+  return (
+    <SidebarWrapper>
+      <Typography light style={{marginLeft: '30px', marginTop: '46px'}}>Main Menu</Typography>
+      <MarkupTools {...transferProps} />
+      <CreateForm {...transferProps} />
+      <BtnWrapper>
+        <Button shouldFitContainer align="left" onClick={() => { onClick('add-image'); }}>
+          <Icon glyph="add-image" style={{marginRight: '10px'}}/>
+          Add Image
+        </Button>
+      </BtnWrapper>
+      <Watermark {...transferProps} />
+    </SidebarWrapper>
+  );
+};
+
+export default Sidebar;

global/otherStyled.ts

@@ -0,0 +1,16 @@
+import styled from 'styled-components';
+
+export const Separator = styled.div`
+  flex: 1 1 auto;
+`;
+
+export const SidebarWrapper = styled.div`
+  position: fixed;
+  top: 60px;
+  left: 0;
+  bottom: 0;
+  right: auto;
+  width: 267px;
+  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.24);
+  background-color: white;
+`;

global/sidebarStyled.ts

@@ -0,0 +1,20 @@
+import styled from 'styled-components';
+
+export const Wrapper = styled.div`
+  margin-top: 60px;
+  padding: 24px 8px;
+`;
+
+export const Head = styled.div`
+  display: flex;
+  align-items: center;
+`;
+
+export const Body = styled.div`
+  padding: 8px;
+`;
+
+export const IconWrapper = styled.span`
+  display: inline-flex;
+  padding: 8px;
+`;

global/toolStyled.ts

@@ -12,9 +12,9 @@ export const Wrapper = styled('div')<{width?: string}>`
 
 export const Group = styled.div`
   display: flex;
-  justify-content: space-between;
+  justify-content: space-around;
   align-items: center;
-  margin-bottom: 5px;
+  margin-bottom: 7px;
 `;
 
 export const Item = styled('div')<{size?: string}>`
@@ -43,4 +43,8 @@ export const SliderWrapper = styled.div`
   width: 178px;
   border-radius: 4px;
   border: solid 1px rgba(0, 0, 0, 0.12);
-`;
+`;
+
+export const BtnWrapper = styled.div`
+  padding: 8px;
+`;

i18n.js

@@ -2,7 +2,6 @@ const NextI18Next = require('next-i18next').default;
 
 const NextI18NextInstance = new NextI18Next({
   defaultNS: 'common',
-  localePath: 'public/static/locales',
   lowerCaseLng: true,
   localeSubpaths: {
     'zh-tw': 'zh-tw',

package.json

@@ -2,11 +2,9 @@
   "name": "create-next-example-app",
   "version": "1.0.0",
   "scripts": {
-    "dev": "babel-node ./server",
-    "build": "yarn build:next && yarn build:server",
-    "build:next": "next build",
-    "build:server": "webpack --config ./server/webpack.config.js",
-    "start": "node .next/server.bundle.js",
+    "dev": "next",
+    "build": "next build",
+    "start": "next start",
     "export": "npm run build && next export",
     "lint": "eslint . --ext .js,.jsx,.ts,.tsx",
     "test": "jest --config=./config/jest.config.js"
@@ -18,29 +16,19 @@
     "@loadable/component": "^5.10.3",
     "@material-ui/core": "^4.6.1",
     "babel-plugin-inline-react-svg": "^1.1.0",
-    "body-parser": "^1.18.3",
-    "compression": "^1.7.4",
-    "cookie-parser": "^1.4.3",
-    "express": "^4.17.1",
-    "express-session": "^1.15.6",
     "immer": "^5.0.0",
     "isomorphic-unfetch": "^3.0.0",
     "js-cookie": "^2.2.0",
     "mobile-detect": "^1.4.3",
-    "morgan": "^1.9.1",
-    "next": "^9.1.2",
+    "next": "9.1.4",
     "next-i18next": "^2.0.0",
-    "next-redux-saga": "^3.0.0",
-    "next-redux-wrapper": "^2.0.0",
     "notistack": "^0.9.6",
     "pdfjs-dist": "^2.2.228",
     "prop-types": "^15.6.2",
     "react": "16.10.0",
     "react-dom": "16.10.0",
-    "react-redux": "^7.1.1",
-    "redux": "^4.0.0",
+    "react-popper": "^1.3.6",
     "redux-devtools-extension": "^2.13.5",
-    "redux-saga": "^1.1.1",
     "styled-components": "4.4.0",
     "webpack": "^4.41.2"
   },
@@ -74,7 +62,6 @@
     "pre-commit": "^1.2.2",
     "prettier": "^1.19.1",
     "react-test-renderer": "^16.5.2",
-    "secure-env": "^1.2.0",
     "typescript": "^3.7.2",
     "webpack-cli": "^3.2.3",
     "webpack-node-externals": "^1.7.2"

pages/_app.js

@@ -1,13 +1,11 @@
 import App from 'next/app';
 import React from 'react';
-import { Provider } from 'react-redux';
-import withRedux from 'next-redux-wrapper';
-import withReduxSaga from 'next-redux-saga';
 import { SnackbarProvider } from 'notistack';
 import loadable from '@loadable/component';
 import { i18n, appWithTranslation } from '../i18n';
-
-import createStore from '../config/configureStore';
+import { StoreProvider } from '../store';
+import reducers from '../reducers';
+import initialState from '../store/initialState';
 
 const GlobalStyle = loadable(() => import('../global/styled'));
 
@@ -24,18 +22,19 @@ class MainApp extends App {
 
   render() {
     const {
-      Component, pageProps, store,
+      Component,
+      pageProps,
     } = this.props;
 
     return (
-      <Provider store={store}>
+      <StoreProvider initialState={initialState} reducer={reducers}>
         <SnackbarProvider maxSnack={3}>
           <GlobalStyle lang={i18n.language} />
           <Component {...pageProps} />
         </SnackbarProvider>
-      </Provider>
+      </StoreProvider>
     );
   }
 }
 
-export default withRedux(createStore)(withReduxSaga({ async: true })(appWithTranslation(MainApp)));
+export default appWithTranslation(MainApp);

pages/index.tsx

@@ -1,13 +1,17 @@
 import React from 'react';
 
-import PdfContainer from '../containers/Pdf';
+import Navbar from '../containers/Navbar';
+import Sidebar from '../containers/Sidebar';
+import Toolbar from '../components/Toolbar';
 
-const Home = () => (
-  <PdfContainer />
-);
+const index: React.FunctionComponent = () => {
+  return (
+    <>
+      <Sidebar />
+      <Navbar />
+      <Toolbar />
+    </>
+  );
+};
 
-Home.getInitialProps = async () => ({
-  namespacesRequired: ['home'],
-});
-
-export default Home;
+export default index;

static/icons/annotation/import.svg

@@ -0,0 +1,17 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 58 (84663) - https://sketch.com -->
+    <title>MyannotationMenu/ic/import</title>
+    <desc>Created with Sketch.</desc>
+    <g id="MyannotationMenu/ic/import" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round">
+        <g id="Group-2" transform="translate(6.000000, 4.000000)" stroke="#707070" stroke-width="1.5">
+            <g id="Bars/ic-search00" transform="translate(0.000000, 3.325063)" stroke-linejoin="round">
+                <g id="Group">
+                    <polyline id="Path" points="2.25 0 0 0 0 13 12 13 12 0 9.75 0"></polyline>
+                </g>
+            </g>
+            <path d="M6,0 L6,10.5" id="Line"></path>
+            <polyline id="Path-9" stroke-linejoin="round" transform="translate(6.000000, 10.250000) rotate(-180.000000) translate(-6.000000, -10.250000) " points="3 11.5 6 9 9 11.5"></polyline>
+        </g>
+    </g>
+</svg>

static/icons/annotation/sort.svg

@@ -0,0 +1,18 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 58 (84663) - https://sketch.com -->
+    <title>MyannotationMenu/ic/sort</title>
+    <desc>Created with Sketch.</desc>
+    <g id="MyannotationMenu/ic/sort" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="Group-2" transform="translate(4.000000, 6.000000)" stroke="#707070" stroke-width="1.5">
+            <path d="M13,2 L16,2" id="Path-4-Copy-2" stroke-linecap="round"></path>
+            <path d="M0,2 L9,2" id="Path-4-Copy-2" stroke-linecap="round"></path>
+            <circle id="Oval" cx="11" cy="2" r="2"></circle>
+        </g>
+        <g id="Group" transform="translate(12.000000, 16.000000) scale(-1, 1) translate(-12.000000, -16.000000) translate(4.000000, 14.000000)" stroke="#707070" stroke-width="1.5">
+            <path d="M13,2 L16,2" id="Path-4-Copy-2" stroke-linecap="round" transform="translate(14.500000, 2.000000) scale(-1, 1) translate(-14.500000, -2.000000) "></path>
+            <path d="M0,2 L9,2" id="Path-4-Copy-2" stroke-linecap="round" transform="translate(4.500000, 2.000000) scale(-1, 1) translate(-4.500000, -2.000000) "></path>
+            <circle id="Oval" transform="translate(11.000000, 2.000000) scale(-1, 1) translate(-11.000000, -2.000000) " cx="11" cy="2" r="2"></circle>
+        </g>
+    </g>
+</svg>

static/icons/arrow00.svg

@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <g id="web/ic/arrow00" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="baseline-arrow_drop_down-24px">
+            <polygon id="Path" points="0 0 24 0 24 24 0 24"></polygon>
+            <polygon id="Path" fill="#000000" fill-rule="nonzero" points="7 10 12 15 17 10"></polygon>
+        </g>
+    </g>
+</svg>

static/icons/arrow01.svg

@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 58 (84663) - https://sketch.com -->
+    <title>web/ic/arrow01</title>
+    <desc>Created with Sketch.</desc>
+    <g id="web/ic/arrow01" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="baseline-arrow_drop_down-24px">
+            <polygon id="Path" fill-opacity="0.38" fill="#000000" fill-rule="nonzero" points="7 10 12 15 17 10"></polygon>
+            <polygon id="Path" points="0 0 24 0 24 24 0 24"></polygon>
+        </g>
+    </g>
+</svg>

static/icons/close.svg

@@ -0,0 +1,4 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" focusable="false" viewBox="0 0 24 24" aria-hidden="true" role="presentation">
+  <path d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"></path>
+</svg>

static/icons/navbar/Export00.svg

@@ -0,0 +1,17 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="60px" height="60px" viewBox="0 0 60 60" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 58 (84663) - https://sketch.com -->
+    <title>Navbar/ic/Export00</title>
+    <desc>Created with Sketch.</desc>
+    <g id="Navbar/ic/Export00" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round">
+        <g id="Group-2" transform="translate(19.000000, 17.000000)" stroke="#707070" stroke-width="2.5">
+            <g id="Bars/ic-search00" transform="translate(0.000000, 8.650126)" stroke-linejoin="round">
+                <g id="Group">
+                    <polyline id="Path" points="4.125 0.933504679 0 0.933504679 0 17 22 17 22 0.933504679 17.875 0.933504679"></polyline>
+                </g>
+            </g>
+            <path d="M11,1.15012627 L11,18.1501263" id="Line"></path>
+            <polyline id="Path-9" stroke-linejoin="round" points="5.51624279 5.58363094 11.0998737 0 16.6835047 5.58363094"></polyline>
+        </g>
+    </g>
+</svg>

static/icons/navbar/Export01.svg

@@ -0,0 +1,18 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="60px" height="60px" viewBox="0 0 60 60" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 58 (84663) - https://sketch.com -->
+    <title>Navbar/ic/Export01</title>
+    <desc>Created with Sketch.</desc>
+    <g id="Navbar/ic/Export01" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <rect id="Rectangle" fill-opacity="0.6" fill="#586AF2" x="12" y="12" width="36" height="36" rx="4"></rect>
+        <g id="Group-2" transform="translate(19.000000, 17.000000)" stroke="#FFFFFF" stroke-linecap="round" stroke-width="2.5">
+            <g id="Bars/ic-search00" transform="translate(0.000000, 8.650126)" stroke-linejoin="round">
+                <g id="Group">
+                    <polyline id="Path" points="4.125 0.933504679 0 0.933504679 0 17 22 17 22 0.933504679 17.875 0.933504679"></polyline>
+                </g>
+            </g>
+            <path d="M11,1.15012627 L11,18.1501263" id="Line"></path>
+            <polyline id="Path-9" stroke-linejoin="round" points="5.51624279 5.58363094 11.0998737 0 16.6835047 5.58363094"></polyline>
+        </g>
+    </g>
+</svg>

static/icons/navbar/rename00.svg

@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 58 (84663) - https://sketch.com -->
+    <title>Navbar/ic/rename00</title>
+    <desc>Created with Sketch.</desc>
+    <g id="Navbar/ic/rename00" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="round-edit-24px-(1)">
+            <polygon id="Path" points="0 0 24 0 24 24 0 24"></polygon>
+            <path d="M3,17.46 L3,20.5 C3,20.78 3.22,21 3.5,21 L6.54,21 C6.67,21 6.8,20.95 6.89,20.85 L17.81,9.94 L14.06,6.19 L3.15,17.1 C3.05,17.2 3,17.32 3,17.46 Z M20.71,7.04 C21.1,6.65 21.1,6.02 20.71,5.63 L18.37,3.29 C17.98,2.9 17.35,2.9 16.96,3.29 L15.13,5.12 L18.88,8.87 L20.71,7.04 Z" id="Shape" fill-opacity="0.38" fill="#000000" fill-rule="nonzero"></path>
+        </g>
+    </g>
+</svg>

static/icons/navbar/rename01.svg

@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 58 (84663) - https://sketch.com -->
+    <title>Navbar/ic/rename01</title>
+    <desc>Created with Sketch.</desc>
+    <g id="Navbar/ic/rename01" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="round-edit-24px-(1)">
+            <polygon id="Path" points="0 0 24 0 24 24 0 24"></polygon>
+            <path d="M3,17.46 L3,20.5 C3,20.78 3.22,21 3.5,21 L6.54,21 C6.67,21 6.8,20.95 6.89,20.85 L17.81,9.94 L14.06,6.19 L3.15,17.1 C3.05,17.2 3,17.32 3,17.46 Z M20.71,7.04 C21.1,6.65 21.1,6.02 20.71,5.63 L18.37,3.29 C17.98,2.9 17.35,2.9 16.96,3.29 L15.13,5.12 L18.88,8.87 L20.71,7.04 Z" id="Shape" fill="#586AF2" fill-rule="nonzero"></path>
+        </g>
+    </g>
+</svg>

static/icons/sidebar/AddImage00.svg

@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <g id="MainMenu/ic/AddImage00" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <rect id="Rectangle" stroke="#707070" stroke-width="1.5" x="3" y="5" width="18" height="14" rx="2"></rect>
+        <polyline id="Path" stroke="#707070" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" points="5.06524792 19 10.2219266 13.1818182 12.5546205 15.8130909 16.7849722 11 21.0652479 15.8695978"></polyline>
+        <circle id="Oval" fill="#707070" cx="7.5" cy="9.5" r="1.5"></circle>
+    </g>
+</svg>

static/icons/sidebar/AddImage01.svg

@@ -0,0 +1,11 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 58 (84663) - https://sketch.com -->
+    <title>MainMenu/ic/AddImage01</title>
+    <desc>Created with Sketch.</desc>
+    <g id="MainMenu/ic/AddImage01" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <rect id="Rectangle" stroke="#586AF2" stroke-width="1.5" x="3" y="5" width="18" height="14" rx="2"></rect>
+        <polyline id="Path" stroke="#586AF2" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" points="5.06524792 19 10.2219266 13.1818182 12.5546205 15.8130909 16.7849722 11 21.0652479 15.8695978"></polyline>
+        <circle id="Oval" fill="#586AF2" cx="7.5" cy="9.5" r="1.5"></circle>
+    </g>
+</svg>

static/icons/sidebar/Aligncenter00.svg

@@ -0,0 +1,11 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 58 (84663) - https://sketch.com -->
+    <title>MainMenu/ic/Aligncenter00</title>
+    <desc>Created with Sketch.</desc>
+    <g id="MainMenu/ic/Aligncenter00" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round">
+        <path d="M10,12 L14,12" id="Path-4" stroke="#586AF2" stroke-width="1.5"></path>
+        <path d="M8,17 L16,17" id="Path-4-Copy" stroke="#586AF2" stroke-width="1.5"></path>
+        <path d="M6,7 L18,7" id="Path-4-Copy-2" stroke="#586AF2" stroke-width="1.5"></path>
+    </g>
+</svg>

static/icons/sidebar/Aligncenter01.svg

@@ -0,0 +1,11 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 58 (84663) - https://sketch.com -->
+    <title>MainMenu/ic/Aligncenter01</title>
+    <desc>Created with Sketch.</desc>
+    <g id="MainMenu/ic/Aligncenter01" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round">
+        <path d="M10,12 L14,12" id="Path-4" stroke="#FFFFFF" stroke-width="1.5"></path>
+        <path d="M8,17 L16,17" id="Path-4-Copy" stroke="#FFFFFF" stroke-width="1.5"></path>
+        <path d="M6,7 L18,7" id="Path-4-Copy-2" stroke="#FFFFFF" stroke-width="1.5"></path>
+    </g>
+</svg>

static/icons/sidebar/Alignleft00.svg

@@ -0,0 +1,11 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 58 (84663) - https://sketch.com -->
+    <title>MainMenu/ic/Alignleft00</title>
+    <desc>Created with Sketch.</desc>
+    <g id="MainMenu/ic/Alignleft00" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round">
+        <path d="M6,12 L10,12" id="Path-4" stroke="#586AF2" stroke-width="1.5"></path>
+        <path d="M6,17 L14,17" id="Path-4-Copy" stroke="#586AF2" stroke-width="1.5"></path>
+        <path d="M6,7 L18,7" id="Path-4-Copy-2" stroke="#586AF2" stroke-width="1.5"></path>
+    </g>
+</svg>

static/icons/sidebar/Alignleft01.svg

@@ -0,0 +1,11 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 58 (84663) - https://sketch.com -->
+    <title>MainMenu/ic/Alignleft01</title>
+    <desc>Created with Sketch.</desc>
+    <g id="MainMenu/ic/Alignleft01" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round">
+        <path d="M6,12 L10,12" id="Path-4" stroke="#FFFFFF" stroke-width="1.5"></path>
+        <path d="M6,17 L14,17" id="Path-4-Copy" stroke="#FFFFFF" stroke-width="1.5"></path>
+        <path d="M6,7 L18,7" id="Path-4-Copy-2" stroke="#FFFFFF" stroke-width="1.5"></path>
+    </g>
+</svg>

static/icons/sidebar/Alignright00.svg

@@ -0,0 +1,11 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 58 (84663) - https://sketch.com -->
+    <title>MainMenu/ic/Alignright00</title>
+    <desc>Created with Sketch.</desc>
+    <g id="MainMenu/ic/Alignright00" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round">
+        <path d="M14,12 L18,12" id="Path-4" stroke="#586AF2" stroke-width="1.5"></path>
+        <path d="M10,17 L18,17" id="Path-4-Copy" stroke="#586AF2" stroke-width="1.5"></path>
+        <path d="M6,7 L18,7" id="Path-4-Copy-2" stroke="#586AF2" stroke-width="1.5"></path>
+    </g>
+</svg>

static/icons/sidebar/Alignright01.svg

@@ -0,0 +1,11 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 58 (84663) - https://sketch.com -->
+    <title>MainMenu/ic/Alignright01</title>
+    <desc>Created with Sketch.</desc>
+    <g id="MainMenu/ic/Alignright01" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round">
+        <path d="M14,12 L18,12" id="Path-4" stroke="#FFFFFF" stroke-width="1.5"></path>
+        <path d="M10,17 L18,17" id="Path-4-Copy" stroke="#FFFFFF" stroke-width="1.5"></path>
+        <path d="M6,7 L18,7" id="Path-4-Copy-2" stroke="#FFFFFF" stroke-width="1.5"></path>
+    </g>
+</svg>

static/icons/sidebar/Arrow.svg

@@ -0,0 +1,11 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 58 (84663) - https://sketch.com -->
+    <title>MainMenu/ic/Arrow</title>
+    <desc>Created with Sketch.</desc>
+    <g id="MainMenu/ic/Arrow" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="Group" transform="translate(18.000000, 5.500000) scale(-1, -1) rotate(-135.000000) translate(-18.000000, -5.500000) translate(16.000000, 4.000000)"></g>
+        <path d="M5.5,18.5 L18.5,5.5" id="Line-10" stroke="#586AF2" stroke-width="1.5" stroke-linecap="round"></path>
+        <polyline id="Path-9" stroke="#586AF2" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" transform="translate(18.000000, 6.000000) rotate(-315.000000) translate(-18.000000, -6.000000) " points="16 7 18 5 20 7"></polyline>
+    </g>
+</svg>

static/icons/sidebar/Border.svg

@@ -0,0 +1,10 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 58 (84663) - https://sketch.com -->
+    <title>MainMenu/ic/Border</title>
+    <desc>Created with Sketch.</desc>
+    <g id="MainMenu/ic/Border" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <rect id="Rectangle" stroke="#586AF2" stroke-width="1.5" x="9.75" y="9.75" width="10.5" height="10.5" rx="1"></rect>
+        <rect id="Rectangle-Copy" stroke="#586AF2" stroke-width="1.5" x="3.75" y="3.75" width="10.5" height="10.5" rx="1"></rect>
+    </g>
+</svg>

static/icons/sidebar/Circle.svg

@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 58 (84663) - https://sketch.com -->
+    <title>MainMenu/ic/Circle</title>
+    <desc>Created with Sketch.</desc>
+    <g id="MainMenu/ic/Circle" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <circle id="Oval" stroke="#586AF2" stroke-width="1.5" cx="12" cy="12" r="6.25"></circle>
+    </g>
+</svg>

static/icons/sidebar/Colorpicker.svg

@@ -0,0 +1,46 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 58 (84663) - https://sketch.com -->
+    <title>Menu/ic/Colorpicker</title>
+    <desc>Created with Sketch.</desc>
+    <g id="Menu/ic/Colorpicker" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="BYR_color_wheel" fill-rule="nonzero">
+            <g id="a-link" transform="translate(17.916667, 9.385417)" fill="#FF844C">
+                <path d="M0.04459375,4.24651042 C0.333882228,3.18485761 0.333882228,2.06514239 0.04459375,1.00348958 L3.69348958,0.01665625 C4.15754591,1.72459159 4.15754591,3.52540841 3.69348958,5.23334375" id="a"></path>
+            </g>
+            <g id="a-link" transform="translate(19.121038, 16.519609) rotate(30.000000) translate(-19.121038, -16.519609) translate(16.621038, 13.519609)" fill="#FF614F">
+                <path d="M0.0382688291,4.27174626 C0.327557307,3.21009346 0.327557307,2.09037824 0.0382688291,1.02872543 L3.68716466,0.0418920965 C4.15122099,1.74982744 4.15122099,3.55064425 3.68716466,5.2585796" id="a"></path>
+            </g>
+            <g id="a-link" transform="translate(15.913799, 19.470802) rotate(60.000000) translate(-15.913799, -19.470802) translate(13.413799, 16.470802)" fill="#E7387E">
+                <path d="M0.0382688291,4.27174626 C0.327557307,3.21009346 0.327557307,2.09037824 0.0382688291,1.02872543 L3.68716466,0.0418920965 C4.15122099,1.74982744 4.15122099,3.55064425 3.68716466,5.2585796" id="a"></path>
+            </g>
+            <g id="a-link" transform="translate(11.635417, 20.416667) rotate(90.000000) translate(-11.635417, -20.416667) translate(9.135417, 17.416667)" fill="#C038F3">
+                <path d="M0.04459375,4.24651042 C0.333882228,3.18485761 0.333882228,2.06514239 0.04459375,1.00348958 L3.69348958,0.01665625 C4.15754591,1.72459159 4.15754591,3.52540841 3.69348958,5.23334375" id="a"></path>
+            </g>
+            <g id="a-link" transform="translate(7.501225, 19.121038) rotate(120.000000) translate(-7.501225, -19.121038) translate(5.001225, 16.121038)" fill="#864FFE">
+                <path d="M0.0382688291,4.27174626 C0.327557307,3.21009346 0.327557307,2.09037824 0.0382688291,1.02872543 L3.68716466,0.0418920965 C4.15122099,1.74982744 4.15122099,3.55064425 3.68716466,5.2585796" id="a"></path>
+            </g>
+            <g id="a-link" transform="translate(4.542891, 15.888782) rotate(150.000000) translate(-4.542891, -15.888782) translate(2.042891, 12.888782)" fill="#3B84FF">
+                <path d="M0.04459375,4.24651042 C0.333882228,3.18485761 0.333882228,2.06514239 0.04459375,1.00348958 L3.69348958,0.01665625 C4.15754591,1.72459159 4.15754591,3.52540841 3.69348958,5.23334375" id="a"></path>
+            </g>
+            <g id="a-link" transform="translate(3.604167, 11.635417) rotate(180.000000) translate(-3.604167, -11.635417) translate(1.104167, 8.635417)" fill="#03C5FD">
+                <path d="M0.04459375,4.24651042 C0.333882228,3.18485761 0.333882228,2.06514239 0.04459375,1.00348958 L3.69348958,0.01665625 C4.15754591,1.72459159 4.15754591,3.52540841 3.69348958,5.23334375" id="a"></path>
+            </g>
+            <g id="a-link" transform="translate(4.917891, 7.482532) rotate(-150.000000) translate(-4.917891, -7.482532) translate(2.417891, 4.482532)" fill="#99D363">
+                <path d="M0.04459375,4.24651042 C0.333882228,3.18485761 0.333882228,2.06514239 0.04459375,1.00348958 L3.69348958,0.01665625 C4.15754591,1.72459159 4.15754591,3.52540841 3.69348958,5.23334375" id="a"></path>
+            </g>
+            <g id="a-link" transform="translate(8.132051, 4.542891) rotate(-120.000000) translate(-8.132051, -4.542891) translate(5.632051, 1.542891)" fill="#E6ED69">
+                <path d="M0.04459375,4.24651042 C0.333882228,3.18485761 0.333882228,2.06514239 0.04459375,1.00348958 L3.69348958,0.01665625 C4.15754591,1.72459159 4.15754591,3.52540841 3.69348958,5.23334375" id="a"></path>
+            </g>
+            <g id="a-link" transform="translate(12.385417, 3.604167) rotate(-90.000000) translate(-12.385417, -3.604167) translate(9.885417, 0.604167)" fill="#FFF56C">
+                <path d="M0.04459375,4.24651042 C0.333882228,3.18485761 0.333882228,2.06514239 0.04459375,1.00348958 L3.69348958,0.01665625 C4.15754591,1.72459159 4.15754591,3.52540841 3.69348958,5.23334375" id="a"></path>
+            </g>
+            <g id="a-link" transform="translate(16.128091, 4.678791) rotate(-60.000000) translate(-16.128091, -4.678791) translate(13.628091, 1.178791)" fill="#FFC93E">
+                <path d="M0.0426319307,5.22131265 C0.331920408,4.15965984 0.331920408,3.03994462 0.0426319307,1.97829181 L3.69152776,0.99145848 C4.15558409,2.69939382 4.15558409,4.50021064 3.69152776,6.20814598" id="a"></path>
+            </g>
+            <g id="a-link" transform="translate(19.477943, 8.132051) rotate(-30.000000) translate(-19.477943, -8.132051) translate(16.977943, 5.132051)" fill="#FFB040">
+                <path d="M0.04459375,4.24651042 C0.333882228,3.18485761 0.333882228,2.06514239 0.04459375,1.00348958 L3.69348958,0.01665625 C4.15754591,1.72459159 4.15754591,3.52540841 3.69348958,5.23334375" id="a"></path>
+            </g>
+        </g>
+    </g>
+</svg>

static/icons/sidebar/CreatForm00.svg

@@ -0,0 +1,14 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 58 (84663) - https://sketch.com -->
+    <title>MainMenu/ic/CreatForm00</title>
+    <desc>Created with Sketch.</desc>
+    <g id="MainMenu/ic/CreatForm00" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round">
+        <g id="Group" transform="translate(16.000000, 4.000000)" stroke="#707070" stroke-linejoin="round" stroke-width="1.5">
+            <path d="M2.5,1.46666667 L2.5,15" id="Line-3"></path>
+            <path d="M0,1 L5,1" id="Line-4"></path>
+            <path d="M0,16 L5,16" id="Line-4-Copy"></path>
+        </g>
+        <path d="M15,18 L12.6,18 L4.92,18 C3.85961328,18 3,17.242328 3,16.3076923 L3,8.69230769 C3,7.75767196 3.85961328,7 4.92,7 L4.92,7 L12.6,7 L12.6,7 L15,7" id="Shape" stroke="#707070" stroke-width="1.5"></path>
+    </g>
+</svg>

static/icons/sidebar/Dropdown00.svg

@@ -0,0 +1,11 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 58 (84663) - https://sketch.com -->
+    <title>MainMenu/ic/Dropdown00</title>
+    <desc>Created with Sketch.</desc>
+    <g id="MainMenu/ic/Dropdown00" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="round-keyboard_arrow_down-24px-(2)" transform="translate(6.000000, 8.000000)" fill="#000000" fill-rule="nonzero">
+            <path d="M2.12,1.29 L6,5.17 L9.88,1.29 C10.27,0.9 10.9,0.9 11.29,1.29 C11.68,1.68 11.68,2.31 11.29,2.7 L6.7,7.29 C6.31,7.68 5.68,7.68 5.29,7.29 L0.7,2.7 C0.31,2.31 0.31,1.68 0.7,1.29 C1.09,0.91 1.73,0.9 2.12,1.29 Z" id="Path"></path>
+        </g>
+    </g>
+</svg>

static/icons/sidebar/Dropdown01.svg

@@ -0,0 +1,11 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 58 (84663) - https://sketch.com -->
+    <title>MainMenu/ic/Dropdown01</title>
+    <desc>Created with Sketch.</desc>
+    <g id="MainMenu/ic/Dropdown01" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="round-keyboard_arrow_down-24px-(2)" transform="translate(6.000000, 8.000000)" fill="#586AF2" fill-rule="nonzero">
+            <path d="M2.12,1.29 L6,5.17 L9.88,1.29 C10.27,0.9 10.9,0.9 11.29,1.29 C11.68,1.68 11.68,2.31 11.29,2.7 L6.7,7.29 C6.31,7.68 5.68,7.68 5.29,7.29 L0.7,2.7 C0.31,2.31 0.31,1.68 0.7,1.29 C1.09,0.91 1.73,0.9 2.12,1.29 Z" id="Path"></path>
+        </g>
+    </g>
+</svg>

static/icons/sidebar/Fill.svg

@@ -0,0 +1,10 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 58 (84663) - https://sketch.com -->
+    <title>MainMenu/ic/Fill</title>
+    <desc>Created with Sketch.</desc>
+    <g id="MainMenu/ic/Fill" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <rect id="Rectangle" fill="#586AF2" x="9" y="9" width="12" height="12" rx="1"></rect>
+        <rect id="Rectangle-Copy" fill="#586AF2" x="3" y="3" width="12" height="12" rx="1"></rect>
+    </g>
+</svg>

static/icons/sidebar/Freehand.svg

@@ -0,0 +1,14 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 58 (84663) - https://sketch.com -->
+    <title>MainMenu/ic/Freehand</title>
+    <desc>Created with Sketch.</desc>
+    <g id="MainMenu/ic/Freehand" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="Group-3" transform="translate(10.000000, 14.500000) rotate(-315.000000) translate(-10.000000, -14.500000) translate(3.000000, 5.000000)">
+            <path d="M0.5,3.5 C2.66666667,4.09349714 4.83333333,4.39024571 7,4.39024571 C9.16666667,4.39024571 11.3333333,4.09349714 13.5,3.5" id="Line-4" stroke="#27BEFD" stroke-width="2" stroke-linecap="round"></path>
+            <path d="M9,12 L9,13 L9,13 L9,14 C9,15.1045695 8.40304633,16 7.66666667,16 L6.33333333,16 C5.59695367,16 5,15.1045695 5,14 L5,13 L5,13 L5,12" id="Path" stroke="#000000" stroke-width="1.5"></path>
+            <path d="M0,0 C0,7.17970175 3.13400675,13 7,13 L7,13 C10.8659932,13 14,7.17970175 14,0" id="Path" stroke="#000000" stroke-width="1.5" stroke-linecap="round"></path>
+            <rect id="Rectangle-Copy-7" stroke="#000000" fill="#586AF2" x="6.5" y="16.5" width="1" height="2" rx="0.5"></rect>
+        </g>
+    </g>
+</svg>

static/icons/sidebar/Italic00.svg

@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 58 (84663) - https://sketch.com -->
+    <title>MainMenu/ic/Italic00</title>
+    <desc>Created with Sketch.</desc>
+    <g id="MainMenu/ic/Italic00" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <polygon id="I" fill="#586AF2" fill-rule="nonzero" points="13.3769531 18.515625 7 18.515625 7.43945312 16.3964844 9.27539062 16.3964844 11.2578125 7.11914062 9.421875 7.11914062 9.86132812 5 16.2382812 5 15.7988281 7.11914062 13.953125 7.11914062 11.9804688 16.3964844 13.8164062 16.3964844"></polygon>
+    </g>
+</svg>

static/icons/sidebar/Italic01.svg

@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 58 (84663) - https://sketch.com -->
+    <title>MainMenu/ic/Italic01</title>
+    <desc>Created with Sketch.</desc>
+    <g id="MainMenu/ic/Italic01" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <polygon id="I" fill="#FFFFFF" fill-rule="nonzero" points="13.3769531 18.515625 7 18.515625 7.43945312 16.3964844 9.27539062 16.3964844 11.2578125 7.11914062 9.421875 7.11914062 9.86132812 5 16.2382812 5 15.7988281 7.11914062 13.953125 7.11914062 11.9804688 16.3964844 13.8164062 16.3964844"></polygon>
+    </g>
+</svg>

static/icons/sidebar/Line.svg

@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 58 (84663) - https://sketch.com -->
+    <title>MainMenu/ic/Line</title>
+    <desc>Created with Sketch.</desc>
+    <g id="MainMenu/ic/Line" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round">
+        <path d="M5.5,18.5 L18.5,5.5" id="Line-10" stroke="#586AF2" stroke-width="1.5"></path>
+    </g>
+</svg>

static/icons/sidebar/Rectangle.svg

@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 58 (84663) - https://sketch.com -->
+    <title>MainMenu/ic/Rectangle</title>
+    <desc>Created with Sketch.</desc>
+    <g id="MainMenu/ic/Rectangle" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <rect id="Rectangle" stroke="#586AF2" stroke-width="1.5" x="5.75" y="6.75" width="12.5" height="10.5" rx="1"></rect>
+    </g>
+</svg>

static/icons/sidebar/Shape.svg

@@ -0,0 +1,7 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <g id="MainMenu/ic/Shape" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <circle id="Oval" stroke="#000000" stroke-width="1.5" cx="9" cy="10" r="6.25"></circle>
+        <rect id="Rectangle" stroke="#000000" stroke-width="1.5" x="8.75" y="9.75" width="12.5" height="10.5" rx="1"></rect>
+    </g>
+</svg>

static/icons/sidebar/Squiggly.svg

@@ -0,0 +1,7 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <g id="MainMenu/ic/Squiggly" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <path d="M7.75,7.5 C7.33578644,7.5 7,7.16421356 7,6.75 C7,6.33578644 7.33578644,6 7.75,6 L16.25,6 C16.6642136,6 17,6.33578644 17,6.75 C17,7.16421356 16.6642136,7.5 16.25,7.5 L12.75,7.5 L12.75,7.5 L12.75,16 C12.75,16.4142136 12.4142136,16.75 12,16.75 C11.5857864,16.75 11.25,16.4142136 11.25,16 L11.25,7.5 L7.75,7.5 Z" id="Combined-Shape" fill="#C1C0C6"></path>
+        <path d="M3.375,19 C4.8125,19 4.8125,20 6.25,20 C7.6875,20 7.6875,19 9.125,19 C10.5625,19 10.5625,20 12,20 C13.4375,20 13.4375,19 14.875,19 C16.3125,19 16.3125,20 17.75,20 C19.1875,20 19.1875,19 20.625,19" id="Line" stroke="#02FF36" stroke-width="1.5" stroke-linecap="round" transform="translate(12.000000, 19.500000) rotate(-180.000000) translate(-12.000000, -19.500000) "></path>
+    </g>
+</svg>

static/icons/sidebar/StickyNote.svg

@@ -0,0 +1,9 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24px" height="24px" viewBox="0 0 24 24" fill="none" fill-rule="evenodd">
+  <path d="M0 0h24v24H0z"/>
+  <g fill="#ffd300">
+    <circle cx="7" cy="13" r="1"/>
+    <circle cx="12" cy="13" r="1"/>
+    <circle cx="17" cy="13" r="1"/>
+  </g>
+  <path d="M18 20.25H6A3.25 3.25 0 0 1 2.75 17V9a3.25 3.25 0 0 1 2.437-3.148l.563-.145V2.414a.25.25 0 0 1 .427-.177L9.69 5.75H18A3.25 3.25 0 0 1 21.25 9v8A3.25 3.25 0 0 1 18 20.25z" stroke="#ffd300" stroke-width="1.5"/>
+</svg>

static/icons/sidebar/Strikeout.svg

@@ -0,0 +1,10 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 58 (84663) - https://sketch.com -->
+    <title>MainMenu/ic/Strikeout</title>
+    <desc>Created with Sketch.</desc>
+    <g id="MainMenu/ic/Strikeout" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <path d="M6.75,7.5 C6.33578644,7.5 6,7.16421356 6,6.75 C6,6.33578644 6.33578644,6 6.75,6 L17.25,6 C17.6642136,6 18,6.33578644 18,6.75 C18,7.16421356 17.6642136,7.5 17.25,7.5 L12.75,7.5 L12.75,7.5 L12.75,18 C12.75,18.4142136 12.4142136,18.75 12,18.75 C11.5857864,18.75 11.25,18.4142136 11.25,18 L11.25,7.5 L6.75,7.5 Z" id="Combined-Shape" fill="#C1C0C6"></path>
+        <path d="M3.5,12 L20.5,12" id="Line-2" stroke="#FF1B89" stroke-width="1.8" stroke-linecap="round"></path>
+    </g>
+</svg>

static/icons/sidebar/Text.svg

@@ -0,0 +1,17 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 58 (84663) - https://sketch.com -->
+    <title>MainMenu/ic/Text</title>
+    <desc>Created with Sketch.</desc>
+    <g id="MainMenu/ic/Text" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <path d="M7.75,8.5 C7.33578644,8.5 7,8.16421356 7,7.75 C7,7.33578644 7.33578644,7 7.75,7 L16.25,7 C16.6642136,7 17,7.33578644 17,7.75 C17,8.16421356 16.6642136,8.5 16.25,8.5 L12.75,8.5 L12.75,8.5 L12.75,17 C12.75,17.4142136 12.4142136,17.75 12,17.75 C11.5857864,17.75 11.25,17.4142136 11.25,17 L11.25,8.5 L7.75,8.5 Z" id="Combined-Shape" fill="#F25858"></path>
+        <path d="M3.5,4 L3.5,20" id="Line-16" stroke="#C1C0C6" stroke-width="1.5" stroke-linecap="round"></path>
+        <path d="M20.5,4 L20.5,20" id="Line-17" stroke="#C1C0C6" stroke-width="1.5" stroke-linecap="round"></path>
+        <path d="M4,3.5 L20,3.5" id="Line-18" stroke="#C1C0C6" stroke-width="1.5" stroke-linecap="round"></path>
+        <path d="M4,20.5 L20,20.5" id="Line" stroke="#C1C0C6" stroke-width="1.5" stroke-linecap="round"></path>
+        <rect id="Rectangle" fill="#586AF2" x="2" y="2" width="3" height="3" rx="1.5"></rect>
+        <rect id="Rectangle-Copy-3" fill="#586AF2" x="2" y="19" width="3" height="3" rx="1.5"></rect>
+        <rect id="Rectangle-Copy-2" fill="#586AF2" x="19" y="2" width="3" height="3" rx="1.5"></rect>
+        <rect id="Rectangle-Copy-4" fill="#586AF2" x="19" y="19" width="3" height="3" rx="1.5"></rect>
+    </g>
+</svg>

static/icons/sidebar/Underline.svg

@@ -0,0 +1,10 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 58 (84663) - https://sketch.com -->
+    <title>MainMenu/ic/Underline</title>
+    <desc>Created with Sketch.</desc>
+    <g id="MainMenu/ic/Underline" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <path d="M7.75,7.5 C7.33578644,7.5 7,7.16421356 7,6.75 C7,6.33578644 7.33578644,6 7.75,6 L16.25,6 C16.6642136,6 17,6.33578644 17,6.75 C17,7.16421356 16.6642136,7.5 16.25,7.5 L12.75,7.5 L12.75,7.5 L12.75,16 C12.75,16.4142136 12.4142136,16.75 12,16.75 C11.5857864,16.75 11.25,16.4142136 11.25,16 L11.25,7.5 L7.75,7.5 Z" id="Combined-Shape" fill="#C1C0C6"></path>
+        <path d="M3.5,19.5 L20.5,19.5" id="Line-2" stroke="#27BEFD" stroke-width="1.8" stroke-linecap="round"></path>
+    </g>
+</svg>

static/icons/sidebar/Watermark00.svg

@@ -0,0 +1,14 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 58 (84663) - https://sketch.com -->
+    <title>MainMenu/ic/Watermark00</title>
+    <desc>Created with Sketch.</desc>
+    <g id="MainMenu/ic/Watermark00" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="Group" transform="translate(12.000000, 12.500000) scale(1, -1) translate(-12.000000, -12.500000) translate(3.000000, 7.000000)" stroke="#C1C0C6" stroke-linecap="round" stroke-width="1.5">
+            <path d="M0,5.5 L18,5.5" id="Path-4-Copy-3"></path>
+            <path d="M0,1 L18,1" id="Path-4-Copy-5"></path>
+            <path d="M0,10 L18,10" id="Path-4-Copy-4"></path>
+        </g>
+        <path d="M10.628866,4 L13.371134,4 L19,20 L16.4226804,20 L15.0824742,15.9887955 L8.91752577,15.9887955 L7.57731959,20 L5,20 L10.628866,4 Z M9.63917526,13.837535 L14.3608247,13.837535 L12.0515464,6.82352941 L11.9690722,6.82352941 L9.63917526,13.837535 Z" id="Combined-Shape" fill="#707070" fill-rule="nonzero"></path>
+    </g>
+</svg>

static/icons/sidebar/Watermark01.svg

@@ -0,0 +1,14 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 58 (84663) - https://sketch.com -->
+    <title>MainMenu/ic/Watermark01</title>
+    <desc>Created with Sketch.</desc>
+    <g id="MainMenu/ic/Watermark01" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round">
+        <g id="Group" transform="translate(16.000000, 4.000000)" stroke="#586AF2" stroke-linejoin="round" stroke-width="1.5">
+            <path d="M2.5,1.46666667 L2.5,15" id="Line-3"></path>
+            <path d="M0,1 L5,1" id="Line-4"></path>
+            <path d="M0,16 L5,16" id="Line-4-Copy"></path>
+        </g>
+        <path d="M15,18 L12.6,18 L4.92,18 C3.85961328,18 3,17.242328 3,16.3076923 L3,8.69230769 C3,7.75767196 3.85961328,7 4.92,7 L4.92,7 L12.6,7 L12.6,7 L15,7" id="Shape" stroke="#586AF2" stroke-width="1.5"></path>
+    </g>
+</svg>

static/icons/sidebar/clear.svg

@@ -0,0 +1,14 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 58 (84663) - https://sketch.com -->
+    <title>MainMenu/ic/clear</title>
+    <desc>Created with Sketch.</desc>
+    <g id="MainMenu/ic/clear" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="Group-15" transform="translate(12.500000, 12.000000) rotate(-315.000000) translate(-12.500000, -12.000000) translate(6.000000, 3.000000)" stroke="#FE2712">
+            <path d="M2.62593227,7.75 L0.95224524,16.9552786 C0.949562334,16.9700346 0.948212717,16.9850021 0.948212717,17 C0.948212717,17.1380712 1.06014153,17.25 1.19821272,17.25 L11.8017873,17.25 C11.8167852,17.25 11.8317527,17.2486504 11.8465086,17.2459675 C11.9823527,17.2212686 12.0724537,17.0911227 12.0477548,16.9552786 L10.3740677,7.75 L2.62593227,7.75 Z" id="Rectangle" stroke-width="1.5"></path>
+            <path d="M8,11 L8,17" id="Line-15" stroke-linecap="round"></path>
+            <path d="M5,14 L5,17" id="Line-15-Copy" stroke-linecap="round"></path>
+            <path d="M8.54545455,0 L8.54545455,4 L10.1818182,4 C10.6336875,4 11,4.3581722 11,4.8 L11,7.2 C11,7.6418278 10.6336875,8 10.1818182,8 L2.81818182,8 C2.36631248,8 2,7.6418278 2,7.2 L2,4.8 C2,4.3581722 2.36631248,4 2.81818182,4 L4.45454545,4 L4.45454545,0" id="Shape" stroke-width="1.5" stroke-linecap="round"></path>
+        </g>
+    </g>
+</svg>

static/icons/sidebar/eraser00.svg

@@ -0,0 +1,17 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 58 (84663) - https://sketch.com -->
+    <title>MainMenu/ic/eraser00</title>
+    <desc>Created with Sketch.</desc>
+    <g id="MainMenu/ic/eraser00" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="Group-13" transform="translate(2.000000, 3.000000)" stroke="#586AF2" stroke-width="1.5">
+            <g id="Group-9" transform="translate(9.781134, 9.718866) rotate(-315.000000) translate(-9.781134, -9.718866) translate(5.281134, 1.718866)">
+                <path d="M1,0 L8,0 C8.55228475,-3.23497668e-16 9,0.44771525 9,1 L9,7.69047619 L9,11.5357143 L9,12.3060831 C9,12.5391284 8.91860641,12.7648558 8.76987935,12.9442725 L7.04992189,15.0191418 C6.85994088,15.2483253 6.57773003,15.3809524 6.28004255,15.3809524 L4.5,15.3809524 L1,15.3809524 C0.44771525,15.3809524 6.76353751e-17,14.9332371 0,14.3809524 L0,1 C-6.76353751e-17,0.44771525 0.44771525,-8.97747659e-16 1,0 Z" id="Rectangle"></path>
+                <path d="M0.45,10.4047619 L8.55,10.4047619" id="Line-13" stroke-linecap="square"></path>
+            </g>
+            <path d="M10.5,16.5 L11.5,16.5" id="Line-14" stroke-linecap="round"></path>
+            <path d="M13.5,16.5 L14.5,16.5" id="Line-14-Copy" stroke-linecap="round"></path>
+            <path d="M16.5,16.5 L17.5,16.5" id="Line-14-Copy-2" stroke-linecap="round"></path>
+        </g>
+    </g>
+</svg>

static/icons/sidebar/eraser01.svg

@@ -0,0 +1,17 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 58 (84663) - https://sketch.com -->
+    <title>MainMenu/ic/eraser01</title>
+    <desc>Created with Sketch.</desc>
+    <g id="MainMenu/ic/eraser01" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="Group-13" transform="translate(2.000000, 3.000000)" stroke="#FFFFFF" stroke-width="1.5">
+            <g id="Group-9" transform="translate(9.781134, 9.718866) rotate(-315.000000) translate(-9.781134, -9.718866) translate(5.281134, 1.718866)">
+                <path d="M1,0 L8,0 C8.55228475,-3.23497668e-16 9,0.44771525 9,1 L9,7.69047619 L9,11.5357143 L9,12.3060831 C9,12.5391284 8.91860641,12.7648558 8.76987935,12.9442725 L7.04992189,15.0191418 C6.85994088,15.2483253 6.57773003,15.3809524 6.28004255,15.3809524 L4.5,15.3809524 L1,15.3809524 C0.44771525,15.3809524 6.76353751e-17,14.9332371 0,14.3809524 L0,1 C-6.76353751e-17,0.44771525 0.44771525,-8.97747659e-16 1,0 Z" id="Rectangle"></path>
+                <path d="M0.45,10.4047619 L8.55,10.4047619" id="Line-13" stroke-linecap="square"></path>
+            </g>
+            <path d="M10.5,16.5 L11.5,16.5" id="Line-14" stroke-linecap="round"></path>
+            <path d="M13.5,16.5 L14.5,16.5" id="Line-14-Copy" stroke-linecap="round"></path>
+            <path d="M16.5,16.5 L17.5,16.5" id="Line-14-Copy-2" stroke-linecap="round"></path>
+        </g>
+    </g>
+</svg>

static/icons/sidebar/radiobutton.svg

@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 58 (84663) - https://sketch.com -->
+    <title>MainMenu/ic/radiobutton</title>
+    <desc>Created with Sketch.</desc>
+    <g id="MainMenu/ic/radiobutton" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="Group" transform="translate(2.000000, 2.000000)">
+            <circle id="Oval" stroke="#000000" stroke-width="1.5" cx="10" cy="10" r="10"></circle>
+            <circle id="Oval" fill="#27BEFD" cx="10" cy="10" r="7"></circle>
+        </g>
+    </g>
+</svg>

static/icons/sidebar/redo.svg

@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 58 (84663) - https://sketch.com -->
+    <title>MainMenu/ic/redo</title>
+    <desc>Created with Sketch.</desc>
+    <g id="MainMenu/ic/redo" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round">
+        <g id="Group" transform="translate(12.500000, 12.000000) scale(-1, 1) translate(-12.500000, -12.000000) translate(3.500000, 4.500000)" stroke="#586AF2" stroke-width="1.5">
+            <polyline id="Path-9" stroke-linejoin="round" transform="translate(6.500000, 3.500000) rotate(-90.000000) translate(-6.500000, -3.500000) " points="3.5 5 6.5 2 9.5 5"></polyline>
+            <path d="M5,3.5 L12,3.5 C15.0375661,3.5 17.5,5.96243388 17.5,9 C17.5,12.0375661 15.0375661,14.5 12,14.5 L0,14.5" id="Path"></path>
+        </g>
+    </g>
+</svg>

static/icons/sidebar/undo.svg

@@ -0,0 +1,10 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 58 (84663) - https://sketch.com -->
+    <title>MainMenu/ic/undo</title>
+    <desc>Created with Sketch.</desc>
+    <g id="MainMenu/ic/undo" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round">
+        <polyline id="Path-9" stroke="#586AF2" stroke-width="1.5" stroke-linejoin="round" transform="translate(10.000000, 8.000000) rotate(-90.000000) translate(-10.000000, -8.000000) " points="7 9.5 10 6.5 13 9.5"></polyline>
+        <path d="M8.5,8 L15.5,8 C18.5375661,8 21,10.4624339 21,13.5 C21,16.5375661 18.5375661,19 15.5,19 L3.5,19" id="Path" stroke="#586AF2" stroke-width="1.5"></path>
+    </g>
+</svg>

static/icons/toolbar/RotateLeft00.svg

@@ -0,0 +1,16 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 58 (84663) - https://sketch.com -->
+    <title>ToolBar/Default/ic/RotateLeft00</title>
+    <desc>Created with Sketch.</desc>
+    <g id="ToolBar/Default/ic/RotateLeft00" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="Group-4" transform="translate(16.000000, 10.000000) rotate(-360.000000) translate(-16.000000, -10.000000) translate(12.000000, 4.000000)">
+            <path d="M5.31066017,-0.75 L8.75,2.68933983 L8.75,11 C8.75,11.8906796 8.08159716,12.6362338 7.1598159,12.7420274 L7,12.75 L1,12.75 C0.0335016878,12.75 -0.75,11.9664983 -0.75,11 L-0.75,1 C-0.75,0.0335016878 0.0335016878,-0.75 1,-0.75 L5.31066017,-0.75 Z" id="Combined-Shape" stroke="#C1C0C6" stroke-width="1.5"></path>
+            <path d="M5,0 L8,3 L6,3 C5.44771525,3 5,2.55228475 5,2 L5,0 L5,0 Z" id="Rectangle" fill="#C1C0C6" transform="translate(6.500000, 1.500000) rotate(-360.000000) translate(-6.500000, -1.500000) "></path>
+        </g>
+        <g id="Group-4" transform="translate(10.000000, 16.000000) rotate(-90.000000) translate(-10.000000, -16.000000) translate(6.000000, 10.000000)">
+            <path d="M5.31066017,-0.75 L8.75,2.68933983 L8.75,11 C8.75,11.9664983 7.96649831,12.75 7,12.75 L1,12.75 C0.0335016878,12.75 -0.75,11.9664983 -0.75,11 L-0.75,1 C-0.75,0.0335016878 0.0335016878,-0.75 1,-0.75 L5.31066017,-0.75 Z" id="Combined-Shape" stroke="#707070" stroke-width="1.5"></path>
+            <path d="M5,0 L8,3 L6,3 C5.44771525,3 5,2.55228475 5,2 L5,0 L5,0 Z" id="Rectangle" fill="#707070" transform="translate(6.500000, 1.500000) rotate(-360.000000) translate(-6.500000, -1.500000) "></path>
+        </g>
+    </g>
+</svg>

static/icons/toolbar/RotateLeft01.svg

@@ -0,0 +1,16 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 58 (84663) - https://sketch.com -->
+    <title>ToolBar/Default/ic/RotateLeft01</title>
+    <desc>Created with Sketch.</desc>
+    <g id="ToolBar/Default/ic/RotateLeft01" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="Group-4" transform="translate(16.000000, 10.000000) rotate(-360.000000) translate(-16.000000, -10.000000) translate(12.000000, 4.000000)">
+            <path d="M5.31066017,-0.75 L8.75,2.68933983 L8.75,11 C8.75,11.8906796 8.08159716,12.6362338 7.1598159,12.7420274 L7,12.75 L1,12.75 C0.0335016878,12.75 -0.75,11.9664983 -0.75,11 L-0.75,1 C-0.75,0.0335016878 0.0335016878,-0.75 1,-0.75 L5.31066017,-0.75 Z" id="Combined-Shape" stroke="#C1C0C6" stroke-width="1.5"></path>
+            <path d="M5,0 L8,3 L6,3 C5.44771525,3 5,2.55228475 5,2 L5,0 L5,0 Z" id="Rectangle" fill="#C1C0C6" transform="translate(6.500000, 1.500000) rotate(-360.000000) translate(-6.500000, -1.500000) "></path>
+        </g>
+        <g id="Group-4" transform="translate(10.000000, 16.000000) rotate(-90.000000) translate(-10.000000, -16.000000) translate(6.000000, 10.000000)">
+            <path d="M5.31066017,-0.75 L8.75,2.68933983 L8.75,11 C8.75,11.9664983 7.96649831,12.75 7,12.75 L1,12.75 C0.0335016878,12.75 -0.75,11.9664983 -0.75,11 L-0.75,1 C-0.75,0.0335016878 0.0335016878,-0.75 1,-0.75 L5.31066017,-0.75 Z" id="Combined-Shape" stroke="#586AF2" stroke-width="1.5"></path>
+            <path d="M5,0 L8,3 L6,3 C5.44771525,3 5,2.55228475 5,2 L5,0 L5,0 Z" id="Rectangle" fill="#586AF2" transform="translate(6.500000, 1.500000) rotate(-360.000000) translate(-6.500000, -1.500000) "></path>
+        </g>
+    </g>
+</svg>

static/icons/toolbar/RotateRight00.svg

@@ -0,0 +1,16 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 58 (84663) - https://sketch.com -->
+    <title>ToolBar/Default/ic/RotateRight00</title>
+    <desc>Created with Sketch.</desc>
+    <g id="ToolBar/Default/ic/RotateRight00" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="Group-4" transform="translate(8.000000, 10.000000) rotate(-360.000000) translate(-8.000000, -10.000000) translate(4.000000, 4.000000)">
+            <path d="M5.31066017,-0.75 L8.75,2.68933983 L8.75,11 C8.75,11.8906796 8.08159716,12.6362338 7.1598159,12.7420274 L7,12.75 L1,12.75 C0.0335016878,12.75 -0.75,11.9664983 -0.75,11 L-0.75,1 C-0.75,0.0335016878 0.0335016878,-0.75 1,-0.75 L5.31066017,-0.75 Z" id="Combined-Shape" stroke="#C1C0C6" stroke-width="1.5"></path>
+            <path d="M5,0 L8,3 L6,3 C5.44771525,3 5,2.55228475 5,2 L5,0 L5,0 Z" id="Rectangle" fill="#C1C0C6" transform="translate(6.500000, 1.500000) rotate(-360.000000) translate(-6.500000, -1.500000) "></path>
+        </g>
+        <g id="Group-4" transform="translate(14.000000, 16.000000) rotate(-270.000000) translate(-14.000000, -16.000000) translate(10.000000, 10.000000)">
+            <path d="M5.31066017,-0.75 L8.75,2.68933983 L8.75,11 C8.75,11.9664983 7.96649831,12.75 7,12.75 L1,12.75 C0.0335016878,12.75 -0.75,11.9664983 -0.75,11 L-0.75,1 C-0.75,0.0335016878 0.0335016878,-0.75 1,-0.75 L5.31066017,-0.75 Z" id="Combined-Shape" stroke="#707070" stroke-width="1.5"></path>
+            <path d="M5,0 L8,3 L6,3 C5.44771525,3 5,2.55228475 5,2 L5,0 L5,0 Z" id="Rectangle" fill="#707070" transform="translate(6.500000, 1.500000) rotate(-360.000000) translate(-6.500000, -1.500000) "></path>
+        </g>
+    </g>
+</svg>

static/icons/toolbar/RotateRight01.svg

@@ -0,0 +1,16 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 58 (84663) - https://sketch.com -->
+    <title>ToolBar/Default/ic/RotateRight01</title>
+    <desc>Created with Sketch.</desc>
+    <g id="ToolBar/Default/ic/RotateRight01" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="Group-4" transform="translate(8.000000, 10.000000) rotate(-360.000000) translate(-8.000000, -10.000000) translate(4.000000, 4.000000)">
+            <path d="M5.31066017,-0.75 L8.75,2.68933983 L8.75,11 C8.75,11.8906796 8.08159716,12.6362338 7.1598159,12.7420274 L7,12.75 L1,12.75 C0.0335016878,12.75 -0.75,11.9664983 -0.75,11 L-0.75,1 C-0.75,0.0335016878 0.0335016878,-0.75 1,-0.75 L5.31066017,-0.75 Z" id="Combined-Shape" stroke="#C1C0C6" stroke-width="1.5"></path>
+            <path d="M5,0 L8,3 L6,3 C5.44771525,3 5,2.55228475 5,2 L5,0 L5,0 Z" id="Rectangle" fill="#C1C0C6" transform="translate(6.500000, 1.500000) rotate(-360.000000) translate(-6.500000, -1.500000) "></path>
+        </g>
+        <g id="Group-4" transform="translate(14.000000, 16.000000) rotate(-270.000000) translate(-14.000000, -16.000000) translate(10.000000, 10.000000)">
+            <path d="M5.31066017,-0.75 L8.75,2.68933983 L8.75,11 C8.75,11.9664983 7.96649831,12.75 7,12.75 L1,12.75 C0.0335016878,12.75 -0.75,11.9664983 -0.75,11 L-0.75,1 C-0.75,0.0335016878 0.0335016878,-0.75 1,-0.75 L5.31066017,-0.75 Z" id="Combined-Shape" stroke="#586AF2" stroke-width="1.5"></path>
+            <path d="M5,0 L8,3 L6,3 C5.44771525,3 5,2.55228475 5,2 L5,0 L5,0 Z" id="Rectangle" fill="#586AF2" transform="translate(6.500000, 1.500000) rotate(-360.000000) translate(-6.500000, -1.500000) "></path>
+        </g>
+    </g>
+</svg>

static/icons/toolbar/zoomOut00.svg

@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 58 (84663) - https://sketch.com -->
+    <title>Default/ic/zoomOut00</title>
+    <desc>Created with Sketch.</desc>
+    <g id="Default/ic/zoomOut00" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="Group" transform="translate(3.000000, 3.000000)" stroke="#707070" stroke-width="1.5">
+            <circle id="Oval" cx="9" cy="9" r="9"></circle>
+            <path d="M5,9.5 L13,9.5" id="Path-5" stroke-linecap="round"></path>
+        </g>
+    </g>
+</svg>

static/icons/toolbar/zoomOut01.svg

@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 58 (84663) - https://sketch.com -->
+    <title>Default/ic/zoomOut01</title>
+    <desc>Created with Sketch.</desc>
+    <g id="Default/ic/zoomOut01" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="Group" transform="translate(3.000000, 3.000000)" stroke="#586AF2" stroke-width="1.5">
+            <circle id="Oval" cx="9" cy="9" r="9"></circle>
+            <path d="M5,9.5 L13,9.5" id="Path-5" stroke-linecap="round"></path>
+        </g>
+    </g>
+</svg>

static/locales/en/home.json

@@ -0,0 +1,11 @@
+{
+  "title": "welcome next.js",
+  "description": "next.js description",
+  "welcome": "welcome to next.js",
+  "sample_test": "test words for en",
+  "sample_button": "fire in the wind for en",
+  "link": {
+    "gotoPage2": "Go to page 2",
+    "gotoPage3": "Go to page 3 (no hoc)"
+  }
+}

static/locales/en/meta.json

@@ -0,0 +1,4 @@
+{
+  "title": "title",
+  "description": "description"
+}