rmorawski/standardnotes-app-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

simplified menu css

Browse Source
This commit is contained in:
Mo Bitar
2017-05-05 01:35:45 -05:00
parent 9a5c170921
commit 776f6adbfe
15 changed files with 252 additions and 317 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
app/assets/templates/frontend/directives/contextual-menu.html.haml
View File

@@ -1,6 +1,6 @@
%ul.dropdown-menu.dropdown-menu-left.nt-dropdown-menu.dark.editor-menu
%ul.dropdown-menu.sectioned-menu
.extension{"ng-repeat" => "extension in extensions"}
.menu-section-header{"ng-click" => "extension.hide = !extension.hide"}
.header{"ng-click" => "extension.hide = !extension.hide"}
.title {{extension.name}}
.subtitle
Will submit your note
@@ -8,7 +8,7 @@
.spinner.loading{"ng-if" => "extension.loading"}
%div{"ng-if" => "extension.hide"} …
%ul{"ng-if" => "!extension.hide"}
%li.menu-item{"ng-repeat" => "action in extension.actionsWithContextForItem(item)", "ng-click" => "executeAction(action, extension)",
%li.menu-item{"ng-repeat" => "action in extension.actionsWithContextForItem(item)", "ng-click" => "executeAction(action, extension);",
"ng-class" => "{'faded' : !isActionEnabled(action, extension)}"}
.menu-item-title {{action.label}}
.menu-item-subtitle {{action.desc}}
@@ -18,7 +18,7 @@
%div{"ng-if" => "action.showNestedActions"}
%ul.mt-10
%li.menu-item.white-bg{"ng-repeat" => "subaction in action.subactions", "ng-click" => "executeAction(subaction, extension); $event.stopPropagation()", "style" => "margin-top: -1px;"}
%li.menu-item.white-bg{"ng-repeat" => "subaction in action.subactions", "ng-click" => "executeAction(subaction, extension);", "style" => "margin-top: -1px;"}
.menu-item-title {{subaction.label}}
.menu-item-subtitle {{subaction.desc}}
%span{"ng-if" => "subaction.running"}

25
app/assets/templates/frontend/directives/editor-menu.html.haml
View File

@@ -1,28 +1,29 @@
%ul.dropdown-menu.dropdown-menu-left.nt-dropdown-menu.dark.editor-menu
.menu-section-header
%ul.dropdown-menu.sectioned-menu
.header
.title System Editors
%ul
%li.menu-item{"ng-repeat" => "editor in editorManager.systemEditors", "ng-click" => "selectEditor(editor)"}
%li.menu-item{"ng-repeat" => "editor in editorManager.systemEditors", "ng-click" => "selectEditor($event, editor)"}
%span.pull-left.mr-10{"ng-if" => "selectedEditor === editor"} ✓
.menu-item-title.pull-left {{editor.name}}
%div{"ng-if" => "editorManager.externalEditors.length > 0"}
.menu-section-header
.header
.title External Editors
.subtitle Can access your current note decrypted.
%ul
%li.menu-item{"ng-repeat" => "editor in editorManager.externalEditors", "ng-click" => "selectEditor(editor)"}
%li.menu-item{"ng-repeat" => "editor in editorManager.externalEditors", "ng-click" => "selectEditor($event, editor)"}
.pull-left{"style" => "width: 60%"}
.left-side
%strong.red.medium{"ng-if" => "editor.conflict_of"} Conflicted copy
.menu-item-title {{editor.name}}
%a.faded{"ng-if" => "!editor.default", "ng-click" => "setDefaultEditor(editor); $event.stopPropagation();"} Set Default
%a.red{"ng-if" => "editor.default", "ng-click" => "removeDefaultEditor(editor); $event.stopPropagation();"} Remove Default
%a.blue{"ng-if" => "editor.default", "ng-click" => "removeDefaultEditor(editor); $event.stopPropagation();"} Remove Default
%a.faded{"ng-click" => "editor.showUrl = !editor.showUrl; $event.stopPropagation();"} Show URL
.menu-item-subtitle.wrap{"ng-if" => "editor.showUrl"} {{editor.url}}
%span.pull-left.ml-10{"ng-if" => "selectedEditor === editor"} ✓
.pull-right
%button.white.medium.inline.top{"style" => "width: 50px; height: 40px;", "ng-click" => "deleteEditor(editor); $event.stopPropagation();"} ☓
.menu-section-footer.mt-10
.menu-item-subtitle.wrap.mt-5{"ng-if" => "editor.showUrl"} {{editor.url}}
%span.inline.ml-10{"ng-if" => "selectedEditor === editor"} ✓
.right-side
%button.white.medium{"style" => "width: 50px; height: 40px;", "ng-click" => "deleteEditor(editor); $event.stopPropagation();"} ☓
.footer.mt-10
%input.form-control{"ng-model" => "formData.url", "placeholder" => "Add new editor via URL", "ng-keyup" => "$event.keyCode == 13 && submitNewEditorRequest()"}
%a.block.blue{"href" => "https://standardnotes.org/extensions", "target" => "_blank"} Available Editors

34
app/assets/templates/frontend/editor.html.haml
View File

@@ -10,29 +10,23 @@
.editor-tags
%input.tags-input{"type" => "text", "ng-keyup" => "$event.keyCode == 13 && $event.target.blur();",
"ng-model" => "ctrl.tagsString", "placeholder" => "#tags", "ng-blur" => "ctrl.updateTagsFromTagsString($event, ctrl.tagsString)"}
.section-menu{"ng-if" => "ctrl.note"}
%ul.nav
%li.dropdown.pull-left.mr-15{"click-outside" => "ctrl.showMenu = false;", "is-open" => "ctrl.showMenu"}
%a.dropdown-toggle{"ng-click" => "ctrl.showMenu = !ctrl.showMenu; ctrl.showExtensions = false; ctrl.showEditorMenu = false;"}
Menu
%ul.section-menu-bar{"ng-if" => "ctrl.note"}
%li{"ng-class" => "{'selected' : ctrl.showMenu}", "click-outside" => "ctrl.showMenu = false;", "is-open" => "ctrl.showMenu"}
%label{"ng-click" => "ctrl.showMenu = !ctrl.showMenu; ctrl.showExtensions = false; ctrl.showEditorMenu = false;"} Menu
%ul.dropdown-menu.dropdown-menu-left.nt-dropdown-menu.dark{"ng-if" => "ctrl.showMenu"}
%li{"ng-click" => "ctrl.selectedMenuItem(); ctrl.toggleFullScreen()"}
.text Toggle Fullscreen
%li{"ng-click" => "ctrl.deleteNote()"}
.text Delete Note
%ul.dropdown-menu{"ng-if" => "ctrl.showMenu"}
%li
%label{"ng-click" => "ctrl.selectedMenuItem($event); ctrl.toggleFullScreen()"} Toggle Fullscreen
%li
%label{"ng-click" => "ctrl.selectedMenuItem($event); ctrl.deleteNote()"} Delete Note
%li.sep
%li.dropdown.pull-left.mr-15{"click-outside" => "ctrl.showEditorMenu = false;", "is-open" => "ctrl.showEditorMenu"}
%a.dropdown-toggle{"ng-click" => "ctrl.showEditorMenu = !ctrl.showEditorMenu; ctrl.showMenu = false; ctrl.showExtensions = false;"}
Editor
%editor-menu{"ng-if" => "ctrl.showEditorMenu", "callback" => "ctrl.selectedEditor", "selected-editor" => "ctrl.editor"}
%li{"ng-class" => "{'selected' : ctrl.showEditorMenu}", "click-outside" => "ctrl.showEditorMenu = false;", "is-open" => "ctrl.showEditorMenu"}
%label{"ng-click" => "ctrl.showEditorMenu = !ctrl.showEditorMenu; ctrl.showMenu = false; ctrl.showExtensions = false;"} Editor
%editor-menu{"ng-if" => "ctrl.showEditorMenu", "callback" => "ctrl.selectedEditor", "selected-editor" => "ctrl.editor"}
%li.sep
%li.dropdown.pull-left{"ng-if" => "ctrl.hasAvailableExtensions()", "click-outside" => "ctrl.showExtensions = false;", "is-open" => "ctrl.showExtensions"}
%a.dropdown-toggle{"ng-click" => "ctrl.showExtensions = !ctrl.showExtensions; ctrl.showMenu = false; ctrl.showEditorMenu = false;"}
Actions
%contextual-extensions-menu{"ng-if" => "ctrl.showExtensions", "item" => "ctrl.note"}
%li{"ng-class" => "{'selected' : ctrl.showExtensions}", "ng-if" => "ctrl.hasAvailableExtensions()", "click-outside" => "ctrl.showExtensions = false;", "is-open" => "ctrl.showExtensions"}
%label{"ng-click" => "ctrl.showExtensions = !ctrl.showExtensions; ctrl.showMenu = false; ctrl.showEditorMenu = false;"} Actions
%contextual-extensions-menu{"ng-if" => "ctrl.showExtensions", "item" => "ctrl.note"}
.editor-content{"ng-if" => "ctrl.noteReady", "ng-class" => "{'fullscreen' : ctrl.fullscreen }"}
%iframe#editor-iframe{"ng-if" => "ctrl.editor && !ctrl.editor.systemEditor", "ng-src" => "{{ctrl.editor.url | trusted}}", "frameBorder" => "0", "style" => "width: 100%;"}

26
app/assets/templates/frontend/notes.html.haml
View File

@@ -6,21 +6,19 @@
%br
.filter-section
%input.filter-bar{"select-on-click" => "true", "ng-model" => "ctrl.noteFilter.text", "placeholder" => "Search", "ng-change" => "ctrl.filterTextChanged()", "lowercase" => "true"}
.section-menu.tag-menu-bar
%ul.nav.nav-pills
%li.dropdown
%a.dropdown-toggle{"ng-click" => "ctrl.showMenu = !ctrl.showMenu"}
Sort
%ul.section-menu-bar#tag-menu-bar
%li{"ng-class" => "{'selected' : ctrl.showMenu}"}
%label{"ng-click" => "ctrl.showMenu = !ctrl.showMenu"} Sort
%ul.dropdown-menu.dropdown-menu-left.nt-dropdown-menu.dark{"ng-if" => "ctrl.showMenu"}
%li
%a.text{"ng-click" => "ctrl.selectedMenuItem(); ctrl.selectedSortByCreated()"}
%span.top.mt-5.mr-5{"ng-if" => "ctrl.sortBy == 'created_at'"} ✓
By date added
%li
%a.text{"ng-click" => "ctrl.selectedMenuItem(); ctrl.selectedSortByUpdated()"}
%span.top.mt-5.mr-5{"ng-if" => "ctrl.sortBy == 'updated_at'"} ✓
By date modified
%ul.dropdown-menu{"ng-if" => "ctrl.showMenu"}
%li
%label{"ng-click" => "ctrl.selectedMenuItem($event); ctrl.selectedSortByCreated()"}
%span.top.mt-5.mr-5{"ng-if" => "ctrl.sortBy == 'created_at'"} ✓
By date added
%li
%label{"ng-click" => "ctrl.selectedMenuItem($event); ctrl.selectedSortByUpdated()"}
%span.top.mt-5.mr-5{"ng-if" => "ctrl.sortBy == 'updated_at'"} ✓
By date modified
.scrollable
.infinite-scroll{"infinite-scroll" => "ctrl.paginate()", "can-load" => "true", "threshold" => "200"}