diff --git a/app/components/SimpleEditor/Editor.js b/app/components/SimpleEditor/Editor.js
index 50a62cfba56e086d363df9b0b7da284bcb026492..6e04486c5a703dd87d7980d268f88ce54a5a62c0 100644
--- a/app/components/SimpleEditor/Editor.js
+++ b/app/components/SimpleEditor/Editor.js
@@ -59,8 +59,8 @@ class Editor extends ProseEditor {
     const el = $$('div').addClass('sc-prose-editor')
 
     // left side: editor and toolbar
-    var toolbar = this._renderToolbar($$)
-    var editor = this._renderEditor($$)
+    let toolbar = this._renderToolbar($$)
+    let editor = this._renderEditor($$)
 
     let SplitPane = this.componentRegistry.get('split-pane')
     let ScrollPane = this.componentRegistry.get('scroll-pane')
@@ -144,6 +144,10 @@ class Editor extends ProseEditor {
 
   // TODO -- use this to insert read-only mode alert
   _renderToolbar ($$) {
+    let viewMode = this.props.disabled ? $$('span')
+        .addClass('view-mode')
+        .append('Editor is in Read-Only mode')
+        : ''
     let commandStates = this.commandManager.getCommandStates()
     return $$('div').addClass('se-toolbar-wrapper').append(
     $$(Toolbar, {
@@ -152,7 +156,7 @@ class Editor extends ProseEditor {
       trackChangesView: this.state.trackChangesView,
       toolGroups: ['text', 'document', 'annotations', 'default', 'track-change-enable', 'track-change-toggle-view']
     }).ref('toolbar')
-  )
+  ).append(viewMode)
   }
 
   _renderEditor ($$) {
diff --git a/app/components/SimpleEditor/SimpleEditor.jsx b/app/components/SimpleEditor/SimpleEditor.jsx
index 82ddf89c7ef28113c120eef9b73062798f5e4f47..d703bf77f00e0a483be3c74113df26ec4d2452ac 100644
--- a/app/components/SimpleEditor/SimpleEditor.jsx
+++ b/app/components/SimpleEditor/SimpleEditor.jsx
@@ -1,7 +1,6 @@
 // import { get } from 'lodash'
 import React from 'react'
 import ReactDOM from 'react-dom'
-import { Alert } from 'react-bootstrap'
 
 import {
   ProseEditorConfigurator as Configurator,
@@ -24,11 +23,6 @@ export default class SimpleEditor extends React.Component {
 
     this._releaseLock = this._releaseLock.bind(this)
     this._acquireLock = this._acquireLock.bind(this)
-
-    // TODO -- delete, along with Alert
-    this.state = {
-      canEdit: false
-    }
   }
 
   // TODO -- is this necessary?
@@ -209,19 +203,8 @@ export default class SimpleEditor extends React.Component {
 
   // TODO -- do I even need a render here?
   render () {
-    // TODO -- DELETE THIS !!!!!
-    let viewMode = !this.state.canEdit
-    ? (
-      <Alert bsStyle='warning' className='view-mode'>
-        <span>Editor is in Read-Only Mode</span>
-      </Alert>
-    )
-    : null
-
     return (
-      <div className='editor-wrapper'>
-        {viewMode}
-      </div>
+      <div className='editor-wrapper' />
     )
   }
 }
diff --git a/app/components/SimpleEditor/SimpleEditor.scss b/app/components/SimpleEditor/SimpleEditor.scss
index 8a0609cf9ebc3e95790032327b529aa08618b66e..b302c5b5bbf7878146a95bde7d902b4b9a46b8f6 100644
--- a/app/components/SimpleEditor/SimpleEditor.scss
+++ b/app/components/SimpleEditor/SimpleEditor.scss
@@ -28,18 +28,13 @@ $active-blue: #4a90e2;
   position: relative;
 
   .view-mode {
-    height: 44px;
-    position: fixed;
+    font-size: 14px;
+    position: absolute;
     right: 0;
     text-align: center;
+    top: 10px;
     width: 20%;
     z-index: 9999;
-
-    span {
-      font-size: 14px;
-      position: relative;
-      top: 10px;
-    }
   }
 
   .track-changes-mode {
@@ -124,6 +119,7 @@ $active-blue: #4a90e2;
         background-color: $inactive-grey;
         border-radius: 0;
         color: $white;
+        line-height: 0;
         // cursor: pointer;
         padding: 0 19px;
         position: relative;
@@ -154,6 +150,7 @@ $active-blue: #4a90e2;
         cursor: pointer;
         padding: 0 19px;
         position: relative;
+        line-height: 0;
       }
 
       button::after {