Interface tooltip titles

This commit is contained in:
Mo Bitar
2018-05-31 11:26:30 -05:00
parent b90ea97fcb
commit f17c5995c6
7 changed files with 34 additions and 32 deletions

View File

@@ -6,7 +6,7 @@ class MenuRow {
this.templateUrl = "directives/menu-row.html"; this.templateUrl = "directives/menu-row.html";
this.scope = { this.scope = {
circle: "=", circle: "=",
title: "=", label: "=",
subtite: "=", subtite: "=",
hasButton: "=", hasButton: "=",
buttonText: "=", buttonText: "=",
@@ -14,7 +14,8 @@ class MenuRow {
buttonAction: "&", buttonAction: "&",
spinnerClass: "=", spinnerClass: "=",
subRows: "=", subRows: "=",
faded: "=" faded: "=",
desc: "="
}; };
} }

View File

@@ -2,7 +2,7 @@
.menu-panel.dropdown-menu .menu-panel.dropdown-menu
%a.no-decoration{"ng-if" => "extensions.length == 0", "href" => "https://standardnotes.org/extensions", "target" => "blank"} %a.no-decoration{"ng-if" => "extensions.length == 0", "href" => "https://standardnotes.org/extensions", "target" => "blank"}
%menu-row{"title" => "'Download Actions'"} %menu-row{"label" => "'Download Actions'"}
%div{"ng-repeat" => "extension in extensions"} %div{"ng-repeat" => "extension in extensions"}
.header{"ng-click" => "extension.hide = !extension.hide; $event.stopPropagation();"} .header{"ng-click" => "extension.hide = !extension.hide; $event.stopPropagation();"}
@@ -12,7 +12,7 @@
%div{"ng-if" => "extension.hide"} … %div{"ng-if" => "extension.hide"} …
%menu-row{"ng-if" => "!extension.hide", "ng-repeat" => "action in extension.actionsWithContextForItem(item)", %menu-row{"ng-if" => "!extension.hide", "ng-repeat" => "action in extension.actionsWithContextForItem(item)",
"ng-click" => "executeAction(action, extension); $event.stopPropagation();", "title" => "action.label", "subtitle" => "action.desc", "ng-click" => "executeAction(action, extension); $event.stopPropagation();", "label" => "action.label", "subtitle" => "action.desc",
"spinner-class" => "action.running ? 'info' : null", "sub-rows" => "action.subrows"} "spinner-class" => "action.running ? 'info' : null", "sub-rows" => "action.subrows"}
.sublabel{"ng-if" => "action.access_type"} .sublabel{"ng-if" => "action.access_type"}
Uses Uses

View File

@@ -3,9 +3,9 @@
.section .section
.header .header
%h4.title Note Editor %h4.title Note Editor
%menu-row{"title" => "'Plain Editor'", "circle" => "selectedEditor == null && 'success'", "ng-click" => "selectComponent($event, null)"} %menu-row{"label" => "'Plain Editor'", "circle" => "selectedEditor == null && 'success'", "ng-click" => "selectComponent($event, null)"}
%menu-row{"ng-repeat" => "editor in editors", "ng-click" => "selectComponent($event, editor)", "title" => "editor.name", %menu-row{"ng-repeat" => "editor in editors", "ng-click" => "selectComponent($event, editor)", "label" => "editor.name",
"circle" => "selectedEditor === editor && 'success'", "circle" => "selectedEditor === editor && 'success'",
"has-button" => "selectedEditor == editor || defaultEditor == editor", "button-text" => "defaultEditor == editor ? 'Undefault' : 'Set Default'", "has-button" => "selectedEditor == editor || defaultEditor == editor", "button-text" => "defaultEditor == editor ? 'Undefault' : 'Set Default'",
"button-action" => "toggleDefaultForEditor(editor)", "button-class" => "defaultEditor == editor ? 'warning' : 'info'"} "button-action" => "toggleDefaultForEditor(editor)", "button-class" => "defaultEditor == editor ? 'warning' : 'info'"}
@@ -14,12 +14,12 @@
.sublabel{"ng-if" => "shouldDisplayRunningLocallyLabel(editor)"} Running Locally .sublabel{"ng-if" => "shouldDisplayRunningLocallyLabel(editor)"} Running Locally
%a.no-decoration{"ng-if" => "editors.length == 0", "href" => "https://standardnotes.org/extensions", "target" => "blank"} %a.no-decoration{"ng-if" => "editors.length == 0", "href" => "https://standardnotes.org/extensions", "target" => "blank"}
%menu-row{"title" => "'Download More Editors'"} %menu-row{"label" => "'Download More Editors'"}
.section{"ng-if" => "stack.length > 0"} .section{"ng-if" => "stack.length > 0"}
.header .header
%h4.title Editor Stack %h4.title Editor Stack
%menu-row{"ng-repeat" => "component in stack", "ng-click" => "selectComponent($event, component)", "title" => "component.name", %menu-row{"ng-repeat" => "component in stack", "ng-click" => "selectComponent($event, component)", "label" => "component.name",
"circle" => "stackComponentEnabled(component) ? 'success' : 'danger'"} "circle" => "stackComponentEnabled(component) ? 'success' : 'danger'"}
.column{"ng-if" => "component.conflict_of || shouldDisplayRunningLocallyLabel(component)"} .column{"ng-if" => "component.conflict_of || shouldDisplayRunningLocallyLabel(component)"}
%strong.red.medium-text{"ng-if" => "component.conflict_of"} Conflicted copy %strong.red.medium-text{"ng-if" => "component.conflict_of"} Conflicted copy

View File

@@ -1,17 +1,17 @@
.row .row{"ng-attr-title" => "{{desc}}"}
.column .column
.left .left
.column{"ng-if" => "circle"} .column{"ng-if" => "circle"}
.circle.small{"ng-class" => "circle"} .circle.small{"ng-class" => "circle"}
.column{"ng-class" => "{'faded' : faded}"} .column{"ng-class" => "{'faded' : faded}"}
.label .label
{{title}} {{label}}
.sublabel{"ng-if" => "subtitle"} .sublabel{"ng-if" => "subtitle"}
{{subtitle}} {{subtitle}}
%ng-transclude %ng-transclude
.subrows{"ng-if" => "subRows && subRows.length > 0"} .subrows{"ng-if" => "subRows && subRows.length > 0"}
%menu-row{"ng-repeat" => "row in subRows", "ng-click" => "row.onClick($event); $event.stopPropagation();", %menu-row{"ng-repeat" => "row in subRows", "ng-click" => "row.onClick($event); $event.stopPropagation();",
"title" => "row.title", "subtitle" => "row.subtitle", "spinner-class" => "row.spinnerClass"} "label" => "row.label", "subtitle" => "row.subtitle", "spinner-class" => "row.spinnerClass"}
.column{"ng-if" => "hasButton"} .column{"ng-if" => "hasButton"}
.button.info{"ng-click" => "clickButton($event)", "ng-class" => "buttonClass"} .button.info{"ng-click" => "clickButton($event)", "ng-class" => "buttonClass"}

View File

@@ -1,4 +1,4 @@
.section.editor#editor-column .section.editor#editor-column{"aria-label" => "Note"}
.sn-component .sn-component
.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'"} .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 .left
@@ -31,16 +31,16 @@
.section .section
.header .header
%h4.title Note Options %h4.title Note Options
%menu-row{"title" => "ctrl.note.pinned ? 'Unpin' : 'Pin'", "ng-click" => "ctrl.selectedMenuItem($event, true); ctrl.togglePin()"} %menu-row{"label" => "ctrl.note.pinned ? 'Unpin' : 'Pin'", "ng-click" => "ctrl.selectedMenuItem($event, true); ctrl.togglePin()", "desc" => "'Pin or unpin a note from the top of your list'"}
%menu-row{"title" => "ctrl.note.archived ? 'Unarchive' : 'Archive'", "ng-click" => "ctrl.selectedMenuItem($event, true); ctrl.toggleArchiveNote()"} %menu-row{"label" => "ctrl.note.archived ? 'Unarchive' : 'Archive'", "ng-click" => "ctrl.selectedMenuItem($event, true); ctrl.toggleArchiveNote()", "desc" => "'Archive or unarchive a note from your Archived system tag'"}
%menu-row{"title" => "ctrl.note.locked ? 'Unlock' : 'Lock'", "ng-click" => "ctrl.selectedMenuItem($event, true); ctrl.toggleLockNote()"} %menu-row{"label" => "ctrl.note.locked ? 'Unlock' : 'Lock'", "ng-click" => "ctrl.selectedMenuItem($event, true); ctrl.toggleLockNote()", "desc" => "'Locking notes prevents unintentional editing'"}
%menu-row{"title" => "'Delete'", "ng-click" => "ctrl.selectedMenuItem($event); ctrl.deleteNote()"} %menu-row{"label" => "'Delete'", "ng-click" => "ctrl.selectedMenuItem($event); ctrl.deleteNote()", "desc" => "'Delete this note permanently from all your devices'"}
.section{"ng-if" => "!ctrl.selectedEditor"} .section{"ng-if" => "!ctrl.selectedEditor"}
.header .header
%h4.title Global Display %h4.title Global Display
%menu-row{"title" => "'Monospace Font'", "circle" => "ctrl.monospaceFont ? 'success' : 'default'", "ng-click" => "ctrl.selectedMenuItem($event, true); ctrl.toggleKey('monospaceFont')"} %menu-row{"label" => "'Monospace Font'", "circle" => "ctrl.monospaceFont ? 'success' : 'default'", "ng-click" => "ctrl.selectedMenuItem($event, true); ctrl.toggleKey('monospaceFont')", "desc" => "'Toggles the font style for the default editor'"}
%menu-row{"title" => "'Spellcheck'", "circle" => "ctrl.spellcheck ? 'success' : 'default'", "ng-click" => "ctrl.selectedMenuItem($event, true); ctrl.toggleKey('spellcheck')"} %menu-row{"label" => "'Spellcheck'", "circle" => "ctrl.spellcheck ? 'success' : 'default'", "ng-click" => "ctrl.selectedMenuItem($event, true); ctrl.toggleKey('spellcheck')", "desc" => "'Toggles spellcheck for the default editor'"}
.item{"ng-click" => "ctrl.onEditorMenuClick()", "ng-class" => "{'selected' : ctrl.showEditorMenu}", "click-outside" => "ctrl.showEditorMenu = false;", "is-open" => "ctrl.showEditorMenu"} .item{"ng-click" => "ctrl.onEditorMenuClick()", "ng-class" => "{'selected' : ctrl.showEditorMenu}", "click-outside" => "ctrl.showEditorMenu = false;", "is-open" => "ctrl.showEditorMenu"}
.label Editor .label Editor

View File

@@ -1,13 +1,14 @@
.section.notes#notes-column .section.notes#notes-column{"aria-label" => "Notes"}
.content .content
.section-title-bar#notes-title-bar .section-title-bar#notes-title-bar
.padded .padded
.section-title-bar-header .section-title-bar-header
.title {{ctrl.panelTitle()}} .title {{ctrl.panelTitle()}}
.add-button#notes-add-button{"ng-click" => "ctrl.createNewNote()"} + .add-button#notes-add-button{"ng-click" => "ctrl.createNewNote()", "title" => "Create a new note in the selected tag"} +
.filter-section .filter-section{"role" => "search"}
%input.filter-bar#search-bar.mousetrap{"select-on-click" => "true", "ng-model" => "ctrl.noteFilter.text", "placeholder" => "Search", %input.filter-bar#search-bar.mousetrap{"select-on-click" => "true", "ng-model" => "ctrl.noteFilter.text", "placeholder" => "Search",
"ng-change" => "ctrl.filterTextChanged()", "lowercase" => "true", "ng-blur" => "ctrl.onFilterEnter()", "ng-keyup" => "$event.keyCode == 13 && ctrl.onFilterEnter();"} "ng-change" => "ctrl.filterTextChanged()", "lowercase" => "true", "ng-blur" => "ctrl.onFilterEnter()", "ng-keyup" => "$event.keyCode == 13 && ctrl.onFilterEnter();",
"title" => "Searches notes in the currently selected tag"}
#search-clear-button{"ng-if" => "ctrl.noteFilter.text", "ng-click" => "ctrl.clearFilterText();"} ✕ #search-clear-button{"ng-if" => "ctrl.noteFilter.text", "ng-click" => "ctrl.clearFilterText();"} ✕
.sn-component#notes-menu-bar .sn-component#notes-menu-bar
.app-bar.no-edges .app-bar.no-edges
@@ -25,19 +26,19 @@
.header .header
%h4.title Sort By %h4.title Sort By
%menu-row{"title" => "'Date Added'", "circle" => "ctrl.sortBy == 'created_at' && 'success'", "ng-click" => "ctrl.selectedMenuItem($event); ctrl.selectedSortByCreated()"} %menu-row{"label" => "'Date Added'", "circle" => "ctrl.sortBy == 'created_at' && 'success'", "ng-click" => "ctrl.selectedMenuItem($event); ctrl.selectedSortByCreated()", "desc" => "'Sort notes by newest first'"}
%menu-row{"title" => "'Date Modified'", "circle" => "ctrl.sortBy == 'updated_at' && 'success'", "ng-click" => "ctrl.selectedMenuItem($event); ctrl.selectedSortByUpdated()"} %menu-row{"label" => "'Date Modified'", "circle" => "ctrl.sortBy == 'updated_at' && 'success'", "ng-click" => "ctrl.selectedMenuItem($event); ctrl.selectedSortByUpdated()", "desc" => "'Sort notes with the most recently updated first'"}
%menu-row{"title" => "'Title'", "circle" => "ctrl.sortBy == 'title' && 'success'", "ng-click" => "ctrl.selectedMenuItem($event); ctrl.selectedSortByTitle()"} %menu-row{"label" => "'Title'", "circle" => "ctrl.sortBy == 'title' && 'success'", "ng-click" => "ctrl.selectedMenuItem($event); ctrl.selectedSortByTitle()", "desc" => "'Sort notes alphabetically by their title'"}
.section{"ng-if" => "!ctrl.tag.archiveTag"} .section{"ng-if" => "!ctrl.tag.archiveTag"}
.header .header
%h4.title Display %h4.title Display
%menu-row{"title" => "'Archived Notes'", "circle" => "ctrl.showArchived ? 'success' : 'danger'", "faded" => "!ctrl.showArchived", "ng-click" => "ctrl.selectedMenuItem($event); ctrl.toggleKey('showArchived')"} %menu-row{"label" => "'Archived Notes'", "circle" => "ctrl.showArchived ? 'success' : 'danger'", "faded" => "!ctrl.showArchived", "ng-click" => "ctrl.selectedMenuItem($event); ctrl.toggleKey('showArchived')", "desc" => "'Archived notes are usually hidden. You can explicitly show them with this option.'"}
%menu-row{"title" => "'Pinned Notes'", "circle" => "ctrl.hidePinned ? 'danger' : 'success'", "faded" => "ctrl.hidePinned", "ng-click" => "ctrl.selectedMenuItem($event); ctrl.toggleKey('hidePinned')"} %menu-row{"label" => "'Pinned Notes'", "circle" => "ctrl.hidePinned ? 'danger' : 'success'", "faded" => "ctrl.hidePinned", "ng-click" => "ctrl.selectedMenuItem($event); ctrl.toggleKey('hidePinned')", "desc" => "'Pinned notes always appear on top. You can hide them temporarily with this option so you can focus on other notes in the list.'"}
%menu-row{"title" => "'Note Preview'", "circle" => "ctrl.hideNotePreview ? 'danger' : 'success'", "faded" => "ctrl.hideNotePreview", "ng-click" => "ctrl.selectedMenuItem($event); ctrl.toggleKey('hideNotePreview')"} %menu-row{"label" => "'Note Preview'", "circle" => "ctrl.hideNotePreview ? 'danger' : 'success'", "faded" => "ctrl.hideNotePreview", "ng-click" => "ctrl.selectedMenuItem($event); ctrl.toggleKey('hideNotePreview')", "desc" => "'Hide the note preview for a more condensed list of notes'"}
%menu-row{"title" => "'Date'", "circle" => "ctrl.hideDate ? 'danger' : 'success'","faded" => "ctrl.hideDate", "ng-click" => "ctrl.selectedMenuItem($event); ctrl.toggleKey('hideDate')"} %menu-row{"label" => "'Date'", "circle" => "ctrl.hideDate ? 'danger' : 'success'","faded" => "ctrl.hideDate", "ng-click" => "ctrl.selectedMenuItem($event); ctrl.toggleKey('hideDate')", "desc" => "'Hide the date displayed in each row'"}
%menu-row{"title" => "'Tags'", "circle" => "ctrl.hideTags ? 'danger' : 'success'","faded" => "ctrl.hideTags", "ng-click" => "ctrl.selectedMenuItem($event); ctrl.toggleKey('hideTags')"} %menu-row{"label" => "'Tags'", "circle" => "ctrl.hideTags ? 'danger' : 'success'","faded" => "ctrl.hideTags", "ng-click" => "ctrl.selectedMenuItem($event); ctrl.toggleKey('hideTags')", "desc" => "'Hide the list of tags associated with each note'"}
.scrollable .scrollable

View File

@@ -1,4 +1,4 @@
.section.tags#tags-column .section.tags#tags-column{"aria-label" => "Tags"}
.component-view-container{"ng-if" => "ctrl.component.active"} .component-view-container{"ng-if" => "ctrl.component.active"}
%component-view.component-view{"component" => "ctrl.component"} %component-view.component-view{"component" => "ctrl.component"}
@@ -7,7 +7,7 @@
#tags-title-bar.section-title-bar #tags-title-bar.section-title-bar
.section-title-bar-header .section-title-bar-header
.title Tags .title Tags
.add-button#tag-add-button{"ng-click" => "ctrl.clickedAddNewTag()"} + .add-button#tag-add-button{"ng-click" => "ctrl.clickedAddNewTag()", "title" => "Create a new tag"} +
.scrollable .scrollable
.infinite-scroll .infinite-scroll