diff --git a/assets/package-lock.json b/assets/package-lock.json
index 02ffbfb1..7dbcaad7 100644
--- a/assets/package-lock.json
+++ b/assets/package-lock.json
@@ -2159,9 +2159,8 @@
       "integrity": "sha1-DQcLTQQ6W+ozovGkDi7bPZpMz3c="
     },
     "codemirror": {
-      "version": "5.27.4",
-      "resolved": "https://registry.npmjs.org/codemirror/-/codemirror-5.27.4.tgz",
-      "integrity": "sha1-DoF8g5v+qZWd0WzUiuFKzA5Dw7Y="
+      "version": "github:tbash/CodeMirror#7e660f8d14802780d87b4f07163ff33381e807be",
+      "from": "github:tbash/CodeMirror"
     },
     "collection-visit": {
       "version": "1.0.0",
diff --git a/assets/package.json b/assets/package.json
index ed4ba425..d23c565c 100644
--- a/assets/package.json
+++ b/assets/package.json
@@ -16,7 +16,7 @@
     "@dillonkearns/elm-graphql": "^3.2.0",
     "@webcomponents/custom-elements": "1.1.0",
     "babel-loader": "^8.0.6",
-    "codemirror": "5.27.4",
+    "codemirror": "github:tbash/CodeMirror",
     "compression-webpack-plugin": "^1.1.11",
     "copy-webpack-plugin": "4.5.1",
     "css-loader": "^3.2.0",
diff --git a/assets/src/Ellie/Ui/CodeEditor.css b/assets/src/Ellie/Ui/CodeEditor.css
index 90c7d075..23641071 100644
--- a/assets/src/Ellie/Ui/CodeEditor.css
+++ b/assets/src/Ellie/Ui/CodeEditor.css
@@ -27,13 +27,21 @@ code-editor .CodeMirror {
   color: #ff6cc9 !important;
 }
 
+.CodeMirror .cm-variable {
+  color: #82b1ff !important;
+}
+
+.CodeMirror .cm-def {
+  color: #decb6b !important;
+}
+
 .CodeMirror .cm-variable-2,
 .CodeMirror .cm-qualifier {
   color: inherit !important;
 }
 
 .CodeMirror .CodeMirror-linenumber {
-  color: #8D8D97 !important;
+  color: #8d8d97 !important;
 }
 
 .CodeMirror-lint-tooltip {
@@ -54,9 +62,9 @@ code-editor .CodeMirror {
 }
 
 .CodeMirror-lint-mark-error, .CodeMirror-lint-mark-warning {
-    background-image: none !important;
-    border-bottom-style: dashed;
-    border-bottom-width: 1px !important;
+  background-image: none !important;
+  border-bottom-style: dashed;
+  border-bottom-width: 1px !important;
 }
 
 .CodeMirror-lint-mark-error {
@@ -67,7 +75,6 @@ code-editor .CodeMirror {
   border-bottom-color: #DECB6B;
 }
 
-
 .CodeMirror .cm-tag.cm-bracket {
   color: #82b1ff;
 }
diff --git a/assets/src/Ellie/Ui/Output.js b/assets/src/Ellie/Ui/Output.js
index 7c18871b..6e036e2c 100644
--- a/assets/src/Ellie/Ui/Output.js
+++ b/assets/src/Ellie/Ui/Output.js
@@ -32,9 +32,7 @@ export default {
           var split = firstArg.split(': ')
           var label = split[0]
           var body = split.slice(1).join(': ')
-          parent.postMessage({ tag: 'LogReceived', contents: { label: label, body: body } }, '${
-            window.location.origin
-          }')
+          parent.postMessage({ tag: 'LogReceived', contents: { label: label, body: body } }, '${window.location.origin}')
         }
         oldLog.apply(this, arguments)
       }
@@ -74,11 +72,10 @@ export default {
         })
         return debuggerWindowProxy
       }
-      var buttonSelector = 'div[style*="z-index: 2147483647"][style*="background-color: rgb(61, 61, 61)"] > div[style*="cursor: pointer"], .elm-mini-controls-button'
-      var controlsSelector = 'div[style*="z-index: 2147483647"][style*="background-color: rgb(61, 61, 61)"], .elm-mini-controls'
+      var buttonSelector = 'div[style*="z-index: 2147483647"][style*="background-color: rgb(18, 147, 216)"]'
       var overlaySelector = 'div[style*="z-index: 2147483646"][style*="background-color: rgba(200, 200, 200, 0.7)"]'
       var styles = document.createElement('style')
-      styles.textContent = controlsSelector + ' { display: none !important; }'
+      styles.textContent = buttonSelector + ' { display: none !important; }'
       document.head.appendChild(styles)
       window.addEventListener('message', function (event) {
         switch(event.data.tag) {
diff --git a/assets/src/Pages/Editor/State/Working.elm b/assets/src/Pages/Editor/State/Working.elm
index c0f66529..fb3a5dfa 100644
--- a/assets/src/Pages/Editor/State/Working.elm
+++ b/assets/src/Pages/Editor/State/Working.elm
@@ -867,11 +867,11 @@ subscriptions model =
         , Effects.networkStatus
             |> Subscription.map
                 (\online ->
-                    if online then
+                    if online == model.connected then
                         NoOp
 
                     else
-                        OnlineStatusChanged False
+                        OnlineStatusChanged online
                 )
         , Subscription.map EditorActionPerformed Effects.keyCombos
         ]
diff --git a/assets/src/Pages/Editor/Views/Editors.elm b/assets/src/Pages/Editor/Views/Editors.elm
index 9d31fb3e..f2946b85 100644
--- a/assets/src/Pages/Editor/Views/Editors.elm
+++ b/assets/src/Pages/Editor/Views/Editors.elm
@@ -78,7 +78,7 @@ view config =
             , minSize = 24
             , first =
                 Html.div [ containerStyles ]
-                    [ viewEditorHeader config "Elm" "Format Elm Code (⇧⌥F)" config.onFormat <| Icon.view Icon.Format
+                    [ viewEditorHeader config "Elm" "Format Elm Code" config.onFormat <| Icon.view Icon.Format
                     , Html.div [ editorStyles ]
                         [ CodeEditor.view
                             [ CodeEditor.value config.elmCode