diff --git a/app/assets/javascripts/app/controllers/editor.js b/app/assets/javascripts/app/controllers/editor.js index 830585bd8..8bdb9a05d 100644 --- a/app/assets/javascripts/app/controllers/editor.js +++ b/app/assets/javascripts/app/controllers/editor.js @@ -324,7 +324,7 @@ angular.module('app') } this.showSavingStatus = function() { - this.noteStatus = $sce.trustAsHtml("Saving..."); + this.noteStatus = {message: "Saving..."}; } this.showAllChangesSavedStatus = function() { @@ -335,7 +335,7 @@ angular.module('app') if(authManager.offline()) { status += " (offline)"; } - this.noteStatus = $sce.trustAsHtml(status); + this.noteStatus = {message: status}; } this.showErrorStatus = function(error) { @@ -347,7 +347,7 @@ angular.module('app') } this.saveError = true; this.syncTakingTooLong = false; - this.noteStatus = $sce.trustAsHtml(`${error.message}
${error.desc}`) + this.noteStatus = error; } this.contentChanged = function() { diff --git a/app/assets/stylesheets/app/_editor.scss b/app/assets/stylesheets/app/_editor.scss index aac1a7994..712bb4043 100644 --- a/app/assets/stylesheets/app/_editor.scss +++ b/app/assets/stylesheets/app/_editor.scss @@ -63,7 +63,11 @@ $heading-height: 75px; font-weight: normal; margin-top: 4px; text-align: right; - color: var(--sn-stylekit-secondary-contrast-background-color); + + .desc, .message:not(.warning):not(.danger) { + // color: var(--sn-stylekit-editor-foreground-color); + opacity: 0.35; + } } .editor-tags { diff --git a/app/assets/stylesheets/app/_main.scss b/app/assets/stylesheets/app/_main.scss index ada2d1d9b..6031bf199 100644 --- a/app/assets/stylesheets/app/_main.scss +++ b/app/assets/stylesheets/app/_main.scss @@ -53,7 +53,6 @@ input, button, select, textarea { } a { - color: var(--sn-stylekit-info-color); text-decoration: none; &.no-decoration { diff --git a/app/assets/templates/directives/account-menu.html.haml b/app/assets/templates/directives/account-menu.html.haml index f16f8b4c8..3bf603c4d 100644 --- a/app/assets/templates/directives/account-menu.html.haml +++ b/app/assets/templates/directives/account-menu.html.haml @@ -84,8 +84,7 @@ .sk-notification.danger{"ng-if" => "syncStatus.error"} .sk-notification-title Sync Unreachable .sk-notification-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? + %a.sk-a.info-contrast.sk-bold.sk-panel-row{"href" => "https://standardnotes.org/help", "target" => "_blank"} Need help? .sk-panel-row .sk-panel-column diff --git a/app/assets/templates/editor.html.haml b/app/assets/templates/editor.html.haml index 593cdb990..5750ff563 100644 --- a/app/assets/templates/editor.html.haml +++ b/app/assets/templates/editor.html.haml @@ -1,4 +1,4 @@ -.section.editor#editor-column{"aria-label" => "Note"} +.section.editor#editor-column.sn-component{"aria-label" => "Note"} .sn-component .sk-app-bar.no-edges{"ng-if" => "ctrl.note.locked", "ng-init" => "ctrl.lockText = 'Note Locked'", "ng-mouseover" => "ctrl.lockText = 'Unlock'", "ng-mouseleave" => "ctrl.lockText = 'Note Locked'"} .left @@ -13,7 +13,9 @@ "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" => "{'warning bold': ctrl.syncTakingTooLong}", "ng-bind-html" => "ctrl.noteStatus"} + #save-status + .message{"ng-class" => "{'warning sk-bold': ctrl.syncTakingTooLong, 'danger sk-bold': ctrl.saveError}"} {{ctrl.noteStatus.message}} + .desc{"ng-show" => "ctrl.noteStatus.desc"} {{ctrl.noteStatus.desc}} .editor-tags #note-tags-component-container{"ng-if" => "ctrl.tagsComponent"}