mirror of
https://github.com/documize/community.git
synced 2025-08-05 05:25:27 +02:00
Complete UI refactoring to new nav and toolbar UX
Compact design!
This commit is contained in:
McMatts
parent
e37782e5b7
commit
6ae9414361
14 changed files with 113 additions and 90 deletions
|
|
@ -1,34 +1,7 @@
|
|||
{{#ui/ui-toolbar dark=false light=false raised=false large=true bordered=false}}
|
||||
{{#if (or showActivity showRevisions)}}
|
||||
{{#ui/ui-toolbar-dropdown label="History" arrow=true}}
|
||||
{{#attach-popover class="ember-attacher-popper" hideOn="clickout" showOn="click" isShown=false}}
|
||||
<ul class="menu">
|
||||
{{#if showActivity}}
|
||||
{{#link-to "document.activity" class="item"}}Activity summary{{/link-to}}
|
||||
{{/if}}
|
||||
{{#if showRevisions}}
|
||||
{{#link-to "document.revisions" class="item"}}Revisions{{/link-to}}
|
||||
{{/if}}
|
||||
</ul>
|
||||
{{/attach-popover}}
|
||||
{{/ui/ui-toolbar-dropdown}}
|
||||
<Ui::UiToolbarDivider />
|
||||
{{/if}}
|
||||
|
||||
{{#ui/ui-toolbar-dropdown label="Export" arrow=true}}
|
||||
{{#attach-popover class="ember-attacher-popper" hideOn="clickout" showOn="click" isShown=false}}
|
||||
<ul class="menu">
|
||||
<li class="item" {{action "onPrintDocument"}}>Print</li>
|
||||
<li class="item" {{action "onExport"}}>Download HTML file</li>
|
||||
</ul>
|
||||
{{/attach-popover}}
|
||||
{{/ui/ui-toolbar-dropdown}}
|
||||
|
||||
<Ui::UiToolbarDivider />
|
||||
|
||||
{{#if (eq appMeta.edition constants.Product.EnterpriseEdition)}}
|
||||
{{#if permissions.documentEdit}}
|
||||
{{#ui/ui-toolbar-icon icon=constants.Icon.UserAssign color=constants.Color.Gray tooltip="Actions & Sharing"}}
|
||||
{{#ui/ui-toolbar-dropdown label="Actions" arrow=true}}
|
||||
{{#attach-popover class="ember-attacher-popper" hideOn="clickout" showOn="click" isShown=false}}
|
||||
<ul class="menu">
|
||||
<li class="item" {{action "onShowRequestContributionModal"}}>Request contribution</li>
|
||||
|
|
@ -42,26 +15,45 @@
|
|||
<li class="item" {{action "onShareModal"}}>Share via secure external link</li>
|
||||
</ul>
|
||||
{{/attach-popover}}
|
||||
{{/ui/ui-toolbar-icon}}
|
||||
<Ui::UiToolbarDivider />
|
||||
{{/ui/ui-toolbar-dropdown}}
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
|
||||
{{#if (or pinState.isPinned session.authenticated permissions.documentAdd permissions.documentDelete)}}
|
||||
{{#ui/ui-toolbar-dropdown label="More" arrow=true}}
|
||||
{{#ui/ui-toolbar-dropdown label="Content" arrow=true}}
|
||||
{{#attach-popover class="ember-attacher-popper" hideOn="clickout" showOn="click" isShown=false}}
|
||||
<ul class="menu">
|
||||
{{#if pinState.isPinned}}
|
||||
<li class="item" {{action "onUnpin"}}>Remove bookmark</li>
|
||||
<li class="divider"/>
|
||||
{{else if session.authenticated}}
|
||||
<li class="item" {{action "onPin"}}>Bookmark</li>
|
||||
<li class="divider"/>
|
||||
{{/if}}
|
||||
<li class="item" {{action "onPrintDocument"}}>Print</li>
|
||||
<li class="item" {{action "onExport"}}>Download</li>
|
||||
{{#if permissions.documentAdd}}
|
||||
<li class="divider"/>
|
||||
<li class="item" {{action "onShowTemplateModal"}}>Publish template</li>
|
||||
{{/if}}
|
||||
{{#if permissions.documentDelete}}
|
||||
<li class="divider"/>
|
||||
<li class="item red" {{action "onShowDeleteModal"}}>Delete</li>
|
||||
{{/if}}
|
||||
|
||||
</ul>
|
||||
{{/attach-popover}}
|
||||
{{/ui/ui-toolbar-dropdown}}
|
||||
|
||||
|
||||
{{#if (or showActivity showRevisions)}}
|
||||
{{#ui/ui-toolbar-dropdown label="History" arrow=true}}
|
||||
{{#attach-popover class="ember-attacher-popper" hideOn="clickout" showOn="click" isShown=false}}
|
||||
<ul class="menu">
|
||||
{{#if pinState.isPinned}}
|
||||
<li class="item" {{action "onUnpin"}}>Remove bookmark</li>
|
||||
{{else if session.authenticated}}
|
||||
<li class="item" {{action "onPin"}}>Bookmark</li>
|
||||
{{#if showActivity}}
|
||||
{{#link-to "document.activity" class="item"}}Activity summary{{/link-to}}
|
||||
{{/if}}
|
||||
{{#if permissions.documentAdd}}
|
||||
<li class="item" {{action "onShowTemplateModal"}}>Save as template</li>
|
||||
{{/if}}
|
||||
{{#if permissions.documentDelete}}
|
||||
<li class="divider"/>
|
||||
<li class="item red" {{action "onShowDeleteModal"}}>Delete</li>
|
||||
{{#if showRevisions}}
|
||||
{{#link-to "document.revisions" class="item"}}Revisions{{/link-to}}
|
||||
{{/if}}
|
||||
</ul>
|
||||
{{/attach-popover}}
|
||||
|
|
@ -69,7 +61,6 @@
|
|||
{{/if}}
|
||||
|
||||
{{#if permissions.documentEdit}}
|
||||
<Ui::UiToolbarDivider />
|
||||
{{ui/ui-toolbar-icon icon=constants.Icon.Settings color=constants.Color.Green
|
||||
tooltip="Rename, Categories, Tag, Status, Workflow" linkTo="document.settings"}}
|
||||
{{/if}}
|
||||
|
|
|
|||
|
|
@ -1,37 +1,41 @@
|
|||
{{#ui/ui-toolbar dark=false light=false raised=false large=false bordered=false}}
|
||||
{{#if hasDocuments}}
|
||||
{{ui/ui-toolbar-icon icon=constants.Icon.Export color=constants.Color.Gray
|
||||
tooltip="Export as HTML" onClick=(action "onShowExport")}}
|
||||
{{#if (or hasDocuments pinState.isPinned session.authenticated)}}
|
||||
{{#ui/ui-toolbar-dropdown label="Content" arrow=true}}
|
||||
{{#attach-popover class="ember-attacher-popper" hideOn="clickout" showOn="click" isShown=false}}
|
||||
<div class="menu">
|
||||
{{#if pinState.isPinned}}
|
||||
<li class="item" {{action "onUnpin"}}>Remove bookmark</li>
|
||||
{{else if session.authenticated}}
|
||||
<li class="item" {{action "onPin"}}>Bookmark</li>
|
||||
{{/if}}
|
||||
{{#if hasDocuments}}
|
||||
<li class="item" {{action "onShowExport"}}>Download</li>
|
||||
{{/if}}
|
||||
</div>
|
||||
{{/attach-popover}}
|
||||
{{/ui/ui-toolbar-dropdown}}
|
||||
{{/if}}
|
||||
{{#if pinState.isPinned}}
|
||||
{{ui/ui-toolbar-icon icon=constants.Icon.BookmarkDelete color=constants.Color.Yellow
|
||||
tooltip="Remove view from bookmarks" onClick=(action "onUnpin")}}
|
||||
{{else if session.authenticated}}
|
||||
{{ui/ui-toolbar-icon icon=constants.Icon.BookmarkAdd color=constants.Color.Gray
|
||||
tooltip="Bookmark this view" onClick=(action "onPin")}}
|
||||
|
||||
{{#if permissions.documentAdd}}
|
||||
{{#ui/ui-toolbar-dropdown label="New" arrow=true}}
|
||||
{{#attach-popover class="ember-attacher-popper" hideOn="clickout" showOn="click" isShown=false}}
|
||||
<div class="menu">
|
||||
<li class="item" {{action "onShowEmptyDocModal"}}>Blank canvas</li>
|
||||
{{#if hasTemplates}}
|
||||
<li class="item" {{action "onShowTemplateDocModal"}}>From template</li>
|
||||
{{/if}}
|
||||
<li class="item" {{action "onShowImportDocModal"}}>Import files</li>
|
||||
</div>
|
||||
{{/attach-popover}}
|
||||
{{/ui/ui-toolbar-dropdown}}
|
||||
{{/if}}
|
||||
|
||||
{{#if (or permissions.spaceOwner permissions.spaceManage)}}
|
||||
{{ui/ui-toolbar-icon icon=constants.Icon.Settings color=constants.Color.Gray
|
||||
{{ui/ui-toolbar-icon icon=constants.Icon.Settings color=constants.Color.Green
|
||||
tooltip="Space settings" linkTo="folder.settings"}}
|
||||
{{/if}}
|
||||
{{/ui/ui-toolbar}}
|
||||
|
||||
{{#if permissions.documentAdd}}
|
||||
{{#ui/ui-toolbar dark=false light=false raised=false large=false bordered=false}}
|
||||
{{ui/ui-toolbar-button color=constants.Color.Green uppercase=false icon=constants.Icon.Plus label="CONTENT"}}
|
||||
{{#attach-popover class="ember-attacher-popper" hideOn="clickout" showOn="click" isShown=false}}
|
||||
<div class="menu">
|
||||
<a class="item" href="#" {{action "onShowEmptyDocModal"}}>Blank canvas</a>
|
||||
{{#if hasTemplates}}
|
||||
<a class="item" href="#" {{action "onShowTemplateDocModal"}}>From template</a>
|
||||
{{/if}}
|
||||
<a class="item" href="#" {{action "onShowImportDocModal"}}>Import files</a>
|
||||
</div>
|
||||
{{/attach-popover}}
|
||||
{{/ui/ui-toolbar}}
|
||||
{{/if}}
|
||||
|
||||
<div id="empty-doc-modal" class="modal" tabindex="-1" role="dialog">
|
||||
<div class="modal-dialog" role="document">
|
||||
<div class="modal-content">
|
||||
|
|
|
|||
|
|
@ -28,13 +28,6 @@
|
|||
{{/link-to}}
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
{{#if (and session.authenticated session.isAdmin)}}
|
||||
{{#link-to "customize.general" class=(if (eq selectedItem "settings") "option selected" "option")}}
|
||||
<i class={{concat "dicon " constants.Icon.Settings}}>
|
||||
{{#attach-tooltip showDelay=1000}}Settings{{/attach-tooltip}}
|
||||
</i>
|
||||
{{/link-to}}
|
||||
{{/if}}
|
||||
{{#link-to "search" class=(if (eq selectedItem "search") "option selected" "option")}}
|
||||
<i class={{concat "dicon " constants.Icon.Search}}>
|
||||
{{#attach-tooltip showDelay=1000}}Search{{/attach-tooltip}}
|
||||
|
|
|
|||
13
gui/app/templates/components/ui/ui-progress.hbs
Normal file
13
gui/app/templates/components/ui/ui-progress.hbs
Normal file
|
|
@ -0,0 +1,13 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
|
||||
<g stroke-linecap="round" stroke-linejoin="round" stroke-width="2" fill="#111111" stroke="#111111">
|
||||
<g class="nc-loop_dots-05-32">
|
||||
<circle data-color="color-2" fill="none" stroke-miterlimit="10" cx="16" cy="16" r="3"
|
||||
transform="translate(0 3.364000000001397)"></circle>
|
||||
<circle fill="none" stroke="#111111" stroke-miterlimit="10" cx="4" cy="16" r="3"
|
||||
transform="translate(0 5.364000000001397)"></circle>
|
||||
<circle fill="none" stroke="#111111" stroke-miterlimit="10" cx="28" cy="16" r="3"
|
||||
transform="translate(0 1.364000000001397)"></circle>
|
||||
</g>
|
||||
<script>!function () { function t(t) { this.element = t, this.dots = [this.element.getElementsByTagName("circle")[1], this.element.getElementsByTagName("circle")[0], this.element.getElementsByTagName("circle")[2]], this.animationId, this.start = null, this.init() } if (!window.requestAnimationFrame) { var i = null; window.requestAnimationFrame = function (t, n) { var e = (new Date).getTime(); i || (i = e); var a = Math.max(0, 16 - (e - i)), o = window.setTimeout(function () { t(e + a) }, a); return i = e + a, o } } t.prototype.init = function () { var t = this; this.animationId = window.requestAnimationFrame(t.triggerAnimation.bind(t)) }, t.prototype.reset = function () { var t = this; window.cancelAnimationFrame(t.animationId) }, t.prototype.triggerAnimation = function (t) { var i = this; this.start || (this.start = t); var n = t - this.start, e = Math.min(n / 40, 23); 930 > n || (this.start = this.start + 930); for (var a = [], o = 0; 3 > o; o++) { a[o] = Math.max(e - 2 * o, 0); if (a[o] > 8) (a[o] = 16 - a[o]); a[o] = Math.max(a[o], 0), this.dots[o].setAttribute("transform", "translate(0 " + a[o] + ")"); } if (document.documentElement.contains(this.element)) window.requestAnimationFrame(i.triggerAnimation.bind(i)) }; var n = document.getElementsByClassName("nc-loop_dots-05-32"), e = []; if (n) for (var a = 0; n.length > a; a++)!function (i) { e.push(new t(n[i])) }(a); document.addEventListener("visibilitychange", function () { "hidden" == document.visibilityState ? e.forEach(function (t) { t.reset() }) : e.forEach(function (t) { t.init() }) }) }();</script>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.2 KiB |
Loading…
Add table
Add a link
Reference in a new issue