Update error text and style

app/assets/templates/directives/account-menu.html.haml

@@ -68,6 +68,11 @@
 
       %div{"ng-if" => "!formData.showLogin && !formData.showRegister && !formData.mfa"}
         .panel-section{"ng-if" => "user"}
+          .notification.danger{"ng-if" => "syncStatus.error"}
+            %h2.title Sync Unreachable
+            .text Hmm...we can't seem to sync your account. The reason: {{syncStatus.error.message}}
+            %p
+              %a{"href" => "https://standardnotes.org/help", "target" => "_blank"} Need help?
           .panel-row
             %h2.title.wrap {{user.email}}
             .horizontal-group{"delay-hide" => "true", "show" => "syncStatus.syncOpInProgress || syncStatus.needsMoreSync", "delay" => "1000"}
@@ -76,8 +81,6 @@
                 {{"Syncing" + (syncStatus.total > 0 ? ":" : "")}}
                 %span{"ng-if" => "syncStatus.total > 0"} {{syncStatus.current}}/{{syncStatus.total}}
 
-          .subtitle.danger.panel-row{"ng-if" => "syncStatus.error"} Error syncing: {{syncStatus.error.message}}
-
           .subtitle.subtle.normal {{server}}
 
           .panel-row

app/assets/templates/editor.html.haml

@@ -13,7 +13,7 @@
                 "ng-change" => "ctrl.nameChanged()", "ng-focus" => "ctrl.onNameFocus()", "ng-blur" => "ctrl.onNameBlur()",
                 "select-on-click" => "true", "ng-disabled" => "ctrl.note.locked"}
 
-    #save-status{"ng-class" => "{'red bold': ctrl.saveError, 'warning bold': ctrl.syncTakingTooLong}", "ng-bind-html" => "ctrl.noteStatus"}
+    #save-status{"ng-class" => "{'error bold': ctrl.syncTakingTooLong}", "ng-bind-html" => "ctrl.noteStatus"}
 
     .editor-tags
       #note-tags-component-container{"ng-if" => "ctrl.tagsComponent"}
@@ -26,7 +26,7 @@
     .app-bar.no-edges
       .left
         .item{"ng-click" => "ctrl.showMenu = !ctrl.showMenu; ctrl.showExtensions = false; ctrl.showEditorMenu = false;", "ng-class" => "{'selected' : ctrl.showMenu}", "click-outside" => "ctrl.showMenu = false;", "is-open" => "ctrl.showMenu"}
-          .label Menu
+          .label Options
           .menu-panel.dropdown-menu{"ng-if" => "ctrl.showMenu"}
             .section
               .header
@@ -63,7 +63,7 @@
 
     %panel-resizer{"panel-id" => "'editor-content'", "on-resize-finish" => "ctrl.onPanelResizeFinish","control" => "ctrl.resizeControl", "min-width" => 300, "hoverable" => "true", "property" => "'right'"}
 
-  %section.section{"ng-if" => "ctrl.note.errorDecrypting"}
+  .section{"ng-if" => "ctrl.note.errorDecrypting"}
     %p.medium-padding{"style" => "padding-top: 0 !important;"} There was an error decrypting this item. Ensure you are running the latest version of this app, then sign out and sign back in to try again.
 
   #editor-pane-component-stack