1
0
Fork 0
mirror of https://github.com/documize/community.git synced 2025-07-24 23:59:47 +02:00

[WIP] Improve master layout for different devices + product growth

We have two pressing needs:

1. Improve experience on real estate challenged devices.
2. Make room for product feature-set growth.

To hit these targets, we need to develop better UX through smarter on-screen space management.
This commit is contained in:
Harvey Kandola 2019-05-20 10:39:48 +01:00
parent bce1c1b166
commit 62c3cd03ad
51 changed files with 433 additions and 525 deletions

View file

@ -18,4 +18,4 @@
{{layout/page-desc desc=desc}}
</div>
</div>
{{ui/ui-spacer size=200}}
<Ui::UiSpacer @size=200 />

View file

@ -1,4 +1,4 @@
<div class="master-content">
{{yield}}
</div>
{{ui/ui-spacer size=300}}
<Ui::UiSpacer @size=300 />

View file

@ -1,54 +1,60 @@
<div class="master-navbar">
<div class="nav-content">
<div class="nav-options">
<div class="navbar">
<div class="container">
<div class="options">
{{#unless hideNavigation}}
{{#link-to "folders" class=(if (eq selectedItem "spaces") "option selected" "option")}}
<i class={{concat "dicon " constants.Icon.Grid}}></i>
<div class="name">spaces</div>
<i class={{concat "dicon " constants.Icon.Grid}}>
{{#attach-tooltip showDelay=1000}}Spaces{{/attach-tooltip}}
</i>
{{/link-to}}
{{#if (eq appMeta.edition constants.Product.EnterpriseEdition)}}
{{#if session.viewDashboard}}
{{#link-to "action" class=(if (eq selectedItem "actions") "option selected" "option")}}
<i class={{concat "dicon " constants.Icon.ListBullet}}></i>
<div class="name">actions</div>
<i class={{concat "dicon " constants.Icon.ListBullet}}>
{{#attach-tooltip showDelay=1000}}Actions{{/attach-tooltip}}
</i>
{{/link-to}}
{{#link-to "activity" class=(if (eq selectedItem "activity") "option selected" "option")}}
<i class={{concat "dicon " constants.Icon.Pulse}}></i>
<div class="name">activity</div>
<i class={{concat "dicon " constants.Icon.Pulse}}>
{{#attach-tooltip showDelay=1000}}Activity{{/attach-tooltip}}
</i>
{{/link-to}}
{{/if}}
{{#if session.viewAnalytics}}
{{#link-to "analytics" class=(if (eq selectedItem "analytics") "option selected" "option")}}
<i class={{concat "dicon " constants.Icon.BarChart}}></i>
<div class="name">reports</div>
<i class={{concat "dicon " constants.Icon.BarChart}}>
{{#attach-tooltip showDelay=1000}}Reports{{/attach-tooltip}}
</i>
{{/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}}></i>
<div class="name">Settings</div>
<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}}></i>
<div class="name">search</div>
<i class={{concat "dicon " constants.Icon.Search}}>
{{#attach-tooltip showDelay=1000}}Search{{/attach-tooltip}}
</i>
{{/link-to}}
{{/unless}}
</div>
<div class="meta">
<div class="options">
{{#if session.isAdmin}}
{{#unless appMeta.valid}}
<div class="invalid-plan" {{action "onBilling"}}>
<i class={{concat "dicon " constants.Icon.Handshake}} />
<div class="option invalid-plan" {{action "onBilling"}}>
<i class={{concat "dicon " constants.Icon.Announce}} />
{{#attach-tooltip}}Invalid product plan{{/attach-tooltip}}
</div>
{{/unless}}
{{/if}}
{{#if session.authenticated}}
{{#if hasPins}}
<div class="bookmarks" id="user-pins-button">
<div class="option" id="user-pins-button">
<i class={{concat "dicon " constants.Icon.BookmarkSolid}}></i>
{{#attach-popover class="ember-attacher-popper" hideOn="clickout click" showOn="click" isShown=false}}
<div class="menu">
@ -69,7 +75,7 @@
</div>
{{/if}}
<div class="user-gravatar-container">
<div class="user-gravatar align-text-bottom" id="profile-button">
<div class="user-gravatar" id="profile-button">
{{session.user.initials}}
{{#if hasWhatsNew}}
<div class="whats-new-dot" />
@ -112,16 +118,7 @@
</i>
{{/link-to}}
{{/if}}
<a class="logo" href="https://documize.com?ref=app">
<img src="/assets/img/icon-white-64x64.png">
<div class="documize">Documize</div>
{{#attach-tooltip showDelay=1000}}Documize {{appMeta.edition}} Edition {{appMeta.version}}{{/attach-tooltip}}
</a>
</div>
</div>
</div>
<div class="master-sidebar">
<div class="sidebar-content">
{{yield}}
</div>
</div>

View file

@ -0,0 +1,6 @@
<div class="toolbar">
<div class="container">
{{yield}}
</div>
</div>