From 8e5ca7c720a1d6248970c75b4597d55ac1bc6fda Mon Sep 17 00:00:00 2001
From: chris <kokosias@yahoo.gr>
Date: Thu, 2 Mar 2017 16:34:35 +0200
Subject: [PATCH] toolbar left in progress
---
app/components/SimpleEditor/Editor.js | 15 +++++++++++++++
app/components/SimpleEditor/SimpleEditor.scss | 17 ++++++++++++++++-
2 files changed, 31 insertions(+), 1 deletion(-)
diff --git a/app/components/SimpleEditor/Editor.js b/app/components/SimpleEditor/Editor.js
index 27239f7..2db5557 100644
--- a/app/components/SimpleEditor/Editor.js
+++ b/app/components/SimpleEditor/Editor.js
@@ -65,6 +65,7 @@ class Editor extends ProseEditor {
// left side: editor and toolbar
let toolbar = this._renderToolbar($$)
+ let toolbarLeft = this._renderToolbarLeft($$)
let editor = this._renderEditor($$)
let SplitPane = this.componentRegistry.get('split-pane')
@@ -107,6 +108,8 @@ class Editor extends ProseEditor {
commentsPane
)
+ let sideNav = $$('div').addClass('sidenav').append(toolbarLeft)
+
var contentPanel = $$(ScrollPane, {
name: 'contentPanel',
// contextMenu: 'custom',
@@ -179,6 +182,18 @@ class Editor extends ProseEditor {
.append(viewMode)
}
+ _renderToolbarLeft ($$) {
+ let commandStates = this.commandManager.getCommandStates()
+ return $$('div').addClass('se-toolbar-wrapper').append(
+ $$(Toolbar, {
+ commandStates: commandStates,
+ trackChanges: this.props.trackChanges,
+ trackChangesView: this.state.trackChangesView,
+ toolGroups: ['text']
+ }).ref('toolbarLeft')
+ )
+ }
+
_renderEditor ($$) {
const configurator = this.props.configurator
const editing = this.props.disabled ? 'selection' : 'full'
diff --git a/app/components/SimpleEditor/SimpleEditor.scss b/app/components/SimpleEditor/SimpleEditor.scss
index d5aee9b..cbc08e4 100644
--- a/app/components/SimpleEditor/SimpleEditor.scss
+++ b/app/components/SimpleEditor/SimpleEditor.scss
@@ -109,10 +109,11 @@ $active-blue: #4a90e2;
.se-options {
top: 36px;
+ background-color: #E8E8E8;
}
.se-option {
- background-color: $white;
+ background-color: #E8E8E8;
border: 0;
font-family: 'Fira Sans';
}
@@ -229,6 +230,20 @@ $active-blue: #4a90e2;
background-color: $primary;
border-right: 1px solid $light-gray;
margin-top: 1px;
+
+ .sidenav {
+ height: 270px;
+ width: 150px;
+ position: fixed;
+ z-index: 1;
+ top: 0;
+ left: 0;
+ background-color: #e8e8e8;
+ overflow-x: hidden;
+ transition: 0.5s;
+ margin-top: 256px;
+ box-shadow: 0 0 12px $dark-gray;
+}
}
--
GitLab