From e687a3f5f39f9a90ab3a13daf6c7a441b8d69072 Mon Sep 17 00:00:00 2001
From: muerwre <gotham48@gmail.com>
Date: Mon, 29 Jul 2019 14:23:32 +0700
Subject: [PATCH] started editor

---
 src/containers/App.tsx                        | 11 +++++-----
 .../examples/EditorExample/index.tsx          | 22 +++++++++++++++++++
 .../examples/EditorExample/styles.scss        | 22 +++++++++++++++++++
 3 files changed, 50 insertions(+), 5 deletions(-)
 create mode 100644 src/containers/examples/EditorExample/index.tsx
 create mode 100644 src/containers/examples/EditorExample/styles.scss

diff --git a/src/containers/App.tsx b/src/containers/App.tsx
index e0210379..61671c05 100644
--- a/src/containers/App.tsx
+++ b/src/containers/App.tsx
@@ -4,11 +4,12 @@ import { bindActionCreators } from 'redux';
 import { hot } from 'react-hot-loader';
 import { ConnectedRouter } from "connected-react-router";
 import { history } from "~/redux/store";
-import { NavLink, Switch, Route } from 'react-router-dom';
+import { NavLink, Switch, Route, Redirect } from 'react-router-dom';
 import { FlowLayout } from "~/containers/flow/FlowLayout";
 import { LoginLayout } from "~/containers/login/LoginLayout";
 import { MainLayout } from "~/containers/main/MainLayout";
 import { ImageExample } from "~/containers/examples/ImageExample";
+import { EditorExample } from "~/containers/examples/EditorExample";
 
 interface IAppProps {}
 interface IAppState {}
@@ -20,12 +21,12 @@ class Component extends React.Component<IAppProps, IAppState> {
         <MainLayout>
           <Switch>
             <Route path="/examples/image" component={ImageExample} />
+            <Route path="/examples/edit" component={EditorExample} />
             <Route path="/" component={FlowLayout} />
 
-            <Route
-              path="/login"
-              component={LoginLayout}
-            />
+            <Route path="/login" component={LoginLayout} />
+
+            <Redirect to="/" />
           </Switch>
         </MainLayout>
       </ConnectedRouter>
diff --git a/src/containers/examples/EditorExample/index.tsx b/src/containers/examples/EditorExample/index.tsx
new file mode 100644
index 00000000..8531aaff
--- /dev/null
+++ b/src/containers/examples/EditorExample/index.tsx
@@ -0,0 +1,22 @@
+import React, { FC } from 'react';
+import { Card } from "~/components/containers/Card";
+import * as styles from './styles.scss';
+import { Group } from "~/components/containers/Group";
+
+interface IProps {}
+
+const EditorExample: FC<IProps> = () => (
+    <Card className={styles.wrap}>
+      <Group horizontal className={styles.group}>
+        <div className={styles.editor}>
+          editor
+        </div>
+
+        <div className={styles.panel}>
+          panel
+        </div>
+      </Group>
+    </Card>
+);
+
+export { EditorExample };
diff --git a/src/containers/examples/EditorExample/styles.scss b/src/containers/examples/EditorExample/styles.scss
new file mode 100644
index 00000000..32442150
--- /dev/null
+++ b/src/containers/examples/EditorExample/styles.scss
@@ -0,0 +1,22 @@
+.wrap {
+  height: calc(100vh - 20px);
+  align-items: stretch;
+  justify-content: center;
+  display: flex;
+}
+
+.group {
+  display: flex;
+  align-items: stretch !important;
+  justify-content: stretch;
+  flex: 1;
+}
+
+.panel {
+  background: red;
+  flex: 0 0 33%;
+}
+
+.editor {
+  flex: 1;
+}