From 9f52f20bbd04d7b8454263b4debfbea0b792c1d5 Mon Sep 17 00:00:00 2001
From: chris <kokosias@yahoo.gr>
Date: Thu, 16 Jan 2020 18:12:05 +0200
Subject: [PATCH] left menu components in progress

---
 wax-prosemirror-components/index.js           |  1 +
 .../src/components/LeftMenuTitle.js           | 26 +++++++++++++++++++
 .../src/components/infoArea/InfoArea.js       |  4 +--
 .../src/layouts/EditoriaLayout.js             |  2 +-
 .../DisplayToolGroupService/Display.js        | 11 +++-----
 .../TextToolGroupService/Text.js              | 11 +++-----
 6 files changed, 36 insertions(+), 19 deletions(-)
 create mode 100644 wax-prosemirror-components/src/components/LeftMenuTitle.js

diff --git a/wax-prosemirror-components/index.js b/wax-prosemirror-components/index.js
index 4ce7e5aa5..38e547ec9 100644
--- a/wax-prosemirror-components/index.js
+++ b/wax-prosemirror-components/index.js
@@ -4,3 +4,4 @@ export { default as Button } from "./src/components/Button";
 export { default as icons } from "./src/icons/icons";
 export { default as TableDropDown } from "./src/components/TableDropDown";
 export { default as ImageUpload } from "./src/components/ImageUpload";
+export { default as LeftMenuTitle } from "./src/components/LeftMenuTitle";
diff --git a/wax-prosemirror-components/src/components/LeftMenuTitle.js b/wax-prosemirror-components/src/components/LeftMenuTitle.js
new file mode 100644
index 000000000..15c4ac188
--- /dev/null
+++ b/wax-prosemirror-components/src/components/LeftMenuTitle.js
@@ -0,0 +1,26 @@
+import React from "react";
+import styled from "styled-components";
+
+const LeftMenuStyled = styled.div`
+  border-bottom: 1px solid #d9d9d9;
+  color: #979797;
+  font-family: "Fira Sans";
+  font-size: 15px;
+  font-weight: bold;
+  letter-spacing: 0.6px;
+  list-style: none;
+  line-height: 0;
+  margin: 5px 0;
+  display: block;
+  padding: 20px 0 10px;
+  margin-left: 10px;
+  text-align: left;
+  text-transform: uppercase;
+  width: 51%;
+`;
+
+const LeftMenuTitle = ({ title }) => {
+  return <LeftMenuStyled>{title}</LeftMenuStyled>;
+};
+
+export default LeftMenuTitle;
diff --git a/wax-prosemirror-components/src/components/infoArea/InfoArea.js b/wax-prosemirror-components/src/components/infoArea/InfoArea.js
index 1abbefdfa..ae6e088a0 100644
--- a/wax-prosemirror-components/src/components/infoArea/InfoArea.js
+++ b/wax-prosemirror-components/src/components/infoArea/InfoArea.js
@@ -2,12 +2,12 @@ import React from "react";
 import styled from "styled-components";
 
 const InfoAreaContainer = styled.div`
-  height: ${props => (props.height ? props.height : "30px")};
+  ${"" /* height: ${props => (props.height ? props.height : "30px")};
   position: fixed;
   bottom: 0;
   z-index: 9999;
   background: #efefef;
-  width: 100%;
+  width: 100%;*/};
 `;
 
 const InfoArea = () => <InfoAreaContainer />;
diff --git a/wax-prosemirror-layouts/src/layouts/EditoriaLayout.js b/wax-prosemirror-layouts/src/layouts/EditoriaLayout.js
index 2ebe0d3d4..771dcf12d 100644
--- a/wax-prosemirror-layouts/src/layouts/EditoriaLayout.js
+++ b/wax-prosemirror-layouts/src/layouts/EditoriaLayout.js
@@ -61,7 +61,7 @@ const MainMenuInner = styled.div`
 
 const SideMenuContainer = styled.div`
   display: flex;
-  width: 12%;
+  width: 14%;
   height: 98%;
 `;
 
diff --git a/wax-prosemirror-services/src/WaxToolGroups/DisplayToolGroupService/Display.js b/wax-prosemirror-services/src/WaxToolGroups/DisplayToolGroupService/Display.js
index 274216ffc..60b888079 100644
--- a/wax-prosemirror-services/src/WaxToolGroups/DisplayToolGroupService/Display.js
+++ b/wax-prosemirror-services/src/WaxToolGroups/DisplayToolGroupService/Display.js
@@ -1,18 +1,13 @@
 import React from "react";
 import { injectable, inject } from "inversify";
+import { LeftMenuTitle } from "wax-prosemirror-components";
 import ToolGroup from "../../lib/ToolGroup";
 
 @injectable()
 class Display extends ToolGroup {
   tools = [];
-  title = () => {
-    return (
-      <span>
-        Display
-        <hr />
-      </span>
-    );
-  };
+  title = <LeftMenuTitle title="Display" />;
+
   constructor(
     @inject("Author") author,
     @inject("Title") title,
diff --git a/wax-prosemirror-services/src/WaxToolGroups/TextToolGroupService/Text.js b/wax-prosemirror-services/src/WaxToolGroups/TextToolGroupService/Text.js
index b1cdb108a..c09c5a0f0 100644
--- a/wax-prosemirror-services/src/WaxToolGroups/TextToolGroupService/Text.js
+++ b/wax-prosemirror-services/src/WaxToolGroups/TextToolGroupService/Text.js
@@ -1,18 +1,13 @@
 import React from "react";
 import { injectable, inject } from "inversify";
+import { LeftMenuTitle } from "wax-prosemirror-components";
 import ToolGroup from "../../lib/ToolGroup";
 
 @injectable()
 class Text extends ToolGroup {
   tools = [];
-  title = () => {
-    return (
-      <span>
-        Text
-        <hr />
-      </span>
-    );
-  };
+  title = <LeftMenuTitle title="Text" />;
+
   constructor(
     @inject("Paragraph") paragraph,
     @inject("ParagraphContinued") paragraphContinued,
-- 
GitLab