From 14f313a836d8c79f708a8a62829770d323670f86 Mon Sep 17 00:00:00 2001 From: Harvey Kandola Date: Mon, 20 May 2019 15:21:33 +0100 Subject: [PATCH] Make Login action more prominent Closes #247 --- gui/app/components/folder/space-sidebar.js | 1 - .../{master-content.js => container.js} | 0 gui/app/components/layout/grid/container.js | 17 ++ gui/app/components/layout/grid/content.js | 17 ++ gui/app/components/layout/grid/sidebar.js | 17 ++ gui/app/constants/constants.js | 1 + gui/app/pods/customize/template.hbs | 148 +++++++------ gui/app/pods/folder/index/template.hbs | 48 ++++- gui/app/pods/folders/template.hbs | 27 +-- gui/app/pods/profile/template.hbs | 33 ++- gui/app/pods/search/template.hbs | 142 +++++++------ gui/app/pods/updates/route.js | 3 + gui/app/pods/updates/template.hbs | 62 +++--- gui/app/styles/colors.scss | 6 +- gui/app/styles/core/layout/all.scss | 2 +- .../core/layout/{bars.scss => layout.scss} | 201 +++++++++--------- gui/app/styles/core/layout/sidebar.scss | 5 +- .../components/folder/space-sidebar.hbs | 108 +++++----- .../templates/components/layout/container.hbs | 2 + .../components/layout/grid/container.hbs | 2 + .../components/layout/grid/content.hbs | 1 + .../components/layout/grid/sidebar.hbs | 1 + .../components/layout/master-content.hbs | 4 - .../components/layout/master-navigation.hbs | 8 +- .../components/layout/master-toolbar.hbs | 1 - 25 files changed, 499 insertions(+), 358 deletions(-) rename gui/app/components/layout/{master-content.js => container.js} (100%) create mode 100644 gui/app/components/layout/grid/container.js create mode 100644 gui/app/components/layout/grid/content.js create mode 100644 gui/app/components/layout/grid/sidebar.js rename gui/app/styles/core/layout/{bars.scss => layout.scss} (62%) create mode 100644 gui/app/templates/components/layout/container.hbs create mode 100644 gui/app/templates/components/layout/grid/container.hbs create mode 100644 gui/app/templates/components/layout/grid/content.hbs create mode 100644 gui/app/templates/components/layout/grid/sidebar.hbs delete mode 100644 gui/app/templates/components/layout/master-content.hbs diff --git a/gui/app/components/folder/space-sidebar.js b/gui/app/components/folder/space-sidebar.js index 601fee4a..6b672725 100644 --- a/gui/app/components/folder/space-sidebar.js +++ b/gui/app/components/folder/space-sidebar.js @@ -17,7 +17,6 @@ import AuthMixin from '../../mixins/auth'; import Component from '@ember/component'; export default Component.extend(AuthMixin, { - classNames: ["section"], router: service(), documentService: service('document'), folderService: service('folder'), diff --git a/gui/app/components/layout/master-content.js b/gui/app/components/layout/container.js similarity index 100% rename from gui/app/components/layout/master-content.js rename to gui/app/components/layout/container.js diff --git a/gui/app/components/layout/grid/container.js b/gui/app/components/layout/grid/container.js new file mode 100644 index 00000000..602288f4 --- /dev/null +++ b/gui/app/components/layout/grid/container.js @@ -0,0 +1,17 @@ +// Copyright 2016 Documize Inc. . All rights reserved. +// +// This software (Documize Community Edition) is licensed under +// GNU AGPL v3 http://www.gnu.org/licenses/agpl-3.0.en.html +// +// You can operate outside the AGPL restrictions by purchasing +// Documize Enterprise Edition and obtaining a commercial license +// by contacting . +// +// https://documize.com + +import Component from '@ember/component'; + +export default Component.extend({ + tagName: 'div', + classNames: ['master-grid-container'], +}); diff --git a/gui/app/components/layout/grid/content.js b/gui/app/components/layout/grid/content.js new file mode 100644 index 00000000..1019aef0 --- /dev/null +++ b/gui/app/components/layout/grid/content.js @@ -0,0 +1,17 @@ +// Copyright 2016 Documize Inc. . All rights reserved. +// +// This software (Documize Community Edition) is licensed under +// GNU AGPL v3 http://www.gnu.org/licenses/agpl-3.0.en.html +// +// You can operate outside the AGPL restrictions by purchasing +// Documize Enterprise Edition and obtaining a commercial license +// by contacting . +// +// https://documize.com + +import Component from '@ember/component'; + +export default Component.extend({ + tagName: 'div', + classNames: ['master-content'], +}); diff --git a/gui/app/components/layout/grid/sidebar.js b/gui/app/components/layout/grid/sidebar.js new file mode 100644 index 00000000..7ec3cbdc --- /dev/null +++ b/gui/app/components/layout/grid/sidebar.js @@ -0,0 +1,17 @@ +// Copyright 2016 Documize Inc. . All rights reserved. +// +// This software (Documize Community Edition) is licensed under +// GNU AGPL v3 http://www.gnu.org/licenses/agpl-3.0.en.html +// +// You can operate outside the AGPL restrictions by purchasing +// Documize Enterprise Edition and obtaining a commercial license +// by contacting . +// +// https://documize.com + +import Component from '@ember/component'; + +export default Component.extend({ + tagName: 'div', + classNames: ['master-sidebar'], +}); diff --git a/gui/app/constants/constants.js b/gui/app/constants/constants.js index 6cf93384..7ff0fe5b 100644 --- a/gui/app/constants/constants.js +++ b/gui/app/constants/constants.js @@ -341,6 +341,7 @@ let constants = EmberObject.extend({ Invite: 'Invite', Join: 'Join', Leave: 'Leave', + Login: 'Login', Move: 'Move', Next: 'Next', OK: 'OK', diff --git a/gui/app/pods/customize/template.hbs b/gui/app/pods/customize/template.hbs index 38208883..fc1e4a55 100644 --- a/gui/app/pods/customize/template.hbs +++ b/gui/app/pods/customize/template.hbs @@ -1,71 +1,83 @@ -{{#layout/master-sidebar selectedItem="settings"}} - - -
-
administration
-
- {{#link-to "customize.general" activeClass="selected" class="item" tagName="div"}} - -
General
- {{/link-to}} - {{#link-to "customize.labels" activeClass="selected" class="item" tagName="div"}} - -
Labels
- {{/link-to}} - {{#link-to "customize.folders" activeClass="selected" class="item" tagName="div"}} - -
Spaces
- {{/link-to}} - {{#link-to "customize.users" activeClass="selected" class="item" tagName="div"}} - -
User Management
- {{/link-to}} - {{#link-to "customize.groups" activeClass="selected" class="item" tagName="div"}} - -
User Groups
- {{/link-to}} - {{#link-to "customize.integrations" activeClass="selected" class="item" tagName="div"}} - -
Integrations
- {{/link-to}} - {{#if session.isGlobalAdmin}} - {{#link-to "customize.smtp" activeClass="selected" class="item" tagName="div"}} - -
Mail Server
- {{/link-to}} - {{#link-to "customize.auth" activeClass="selected" class="item" tagName="div"}} - -
Authentication
- {{/link-to}} - {{#link-to "customize.search" activeClass="selected" class="item" tagName="div"}} - -
Search
- {{/link-to}} - {{#if (eq appMeta.edition constants.Product.EnterpriseEdition)}} - {{#link-to "customize.audit" activeClass="selected" class="item" tagName="div"}} - -
Audit Log
- {{/link-to}} - {{/if}} - {{/if}} - {{#link-to "customize.backup" activeClass="selected" class="item" tagName="div"}} - -
Backup & Restore
- {{/link-to}} - {{#if (eq appMeta.edition constants.Product.EnterpriseEdition)}} - {{#link-to "customize.billing" activeClass="selected" class="item" tagName="div"}} - -
Billing
- {{/link-to}} - {{/if}} - {{#link-to "customize.product" activeClass="selected" class="item" tagName="div"}} - -
Changelog
- {{/link-to}} + + +
+
+
+ Documize {{appMeta.edition}} Edition {{appMeta.version}} (build {{appMeta.revision}})
-{{/layout/master-sidebar}} +
+ -{{#layout/master-content}} - {{outlet}} -{{/layout/master-content}} + + +
+
+
administration
+
+ {{#link-to "customize.general" activeClass="selected" class="item" tagName="div"}} + +
General
+ {{/link-to}} + {{#link-to "customize.labels" activeClass="selected" class="item" tagName="div"}} + +
Labels
+ {{/link-to}} + {{#link-to "customize.folders" activeClass="selected" class="item" tagName="div"}} + +
Spaces
+ {{/link-to}} + {{#link-to "customize.users" activeClass="selected" class="item" tagName="div"}} + +
User Management
+ {{/link-to}} + {{#link-to "customize.groups" activeClass="selected" class="item" tagName="div"}} + +
User Groups
+ {{/link-to}} + {{#link-to "customize.integrations" activeClass="selected" class="item" tagName="div"}} + +
Integrations
+ {{/link-to}} + {{#if session.isGlobalAdmin}} + {{#link-to "customize.smtp" activeClass="selected" class="item" tagName="div"}} + +
Mail Server
+ {{/link-to}} + {{#link-to "customize.auth" activeClass="selected" class="item" tagName="div"}} + +
Authentication
+ {{/link-to}} + {{#link-to "customize.search" activeClass="selected" class="item" tagName="div"}} + +
Search
+ {{/link-to}} + {{#if (eq appMeta.edition constants.Product.EnterpriseEdition)}} + {{#link-to "customize.audit" activeClass="selected" class="item" tagName="div"}} + +
Audit Log
+ {{/link-to}} + {{/if}} + {{/if}} + {{#link-to "customize.backup" activeClass="selected" class="item" tagName="div"}} + +
Backup & Restore
+ {{/link-to}} + {{#if (eq appMeta.edition constants.Product.EnterpriseEdition)}} + {{#link-to "customize.billing" activeClass="selected" class="item" tagName="div"}} + +
Billing
+ {{/link-to}} + {{/if}} + {{#link-to "customize.product" activeClass="selected" class="item" tagName="div"}} + +
Changelog
+ {{/link-to}} +
+
+
+ + + {{outlet}} + + diff --git a/gui/app/pods/folder/index/template.hbs b/gui/app/pods/folder/index/template.hbs index de2c445b..4ff81db2 100644 --- a/gui/app/pods/folder/index/template.hbs +++ b/gui/app/pods/folder/index/template.hbs @@ -1,4 +1,12 @@ -{{#layout/master-sidebar}} + + +
+
+
+
+ + + {{folder/space-sidebar spaces=model.folders space=model.folder @@ -17,7 +25,41 @@ categoryFilter=category onFiltered=(action "onFiltered") onRefresh=(action "onRefresh")}} -{{/layout/master-sidebar}} + + + +
+
+
ABOUT
+
+ Documize product updates are released frequently for both + cloud and self-hosted customers. +
+
+ Have an idea, suggestion or some feedback? Get in touch. +
+
+
+ + + {{layout/logo-heading + title="Product News" + desc="Latest product news and updates" + icon=constants.Icon.Announce}} + +
+ {{{newsContent}}} +
+ Have an idea? Suggestion or feedback? Get in touch! +
+
+ + + + + + + {{#layout/master-content}}
@@ -44,7 +86,7 @@ onRefresh=(action "onRefresh")}}
- + {{folder/documents-list documents=filteredDocs spaces=model.folders diff --git a/gui/app/pods/folders/template.hbs b/gui/app/pods/folders/template.hbs index b63ba58d..25b0058c 100644 --- a/gui/app/pods/folders/template.hbs +++ b/gui/app/pods/folders/template.hbs @@ -1,9 +1,7 @@ -
-
-
-
+
+
{{#if (or session.isEditor session.isAdmin)}} {{#ui/ui-toolbar dark=false light=true raised=true large=false bordered=true tooltip="New space"}} @@ -16,13 +14,9 @@
-
-
+ +
- {{yield}} - - -
filter
@@ -67,11 +61,10 @@ {{/if}}
-
+ -
+ {{layout/logo-heading title=appMeta.title desc=appMeta.message logo=true}} - {{spaces/space-list spaces=selectedSpaces labels=labels}} @@ -140,9 +133,5 @@
-
- -
- - - + + diff --git a/gui/app/pods/profile/template.hbs b/gui/app/pods/profile/template.hbs index bc2986d5..bec7fbd5 100644 --- a/gui/app/pods/profile/template.hbs +++ b/gui/app/pods/profile/template.hbs @@ -1,11 +1,26 @@ -{{#layout/master-sidebar}} -{{/layout/master-sidebar}} + + -{{#layout/master-content}} - {{layout/logo-heading - title=session.user.fullname - desc="Manage you profile and password" - icon=constants.Icon.Person}} + + +
+
+
PROFILE
+
+ Set your personal information or reset your password. +
+
+ Have a product idea, suggestion or some feedback? Get in touch. +
+
+
+ + + {{layout/logo-heading + title=session.user.fullname + desc="Manage your profile and password" + icon=constants.Icon.Person}} - {{user/user-profile model=model save=(action "save")}} -{{/layout/master-content}} + {{user/user-profile model=model save=(action "save")}} + + diff --git a/gui/app/pods/search/template.hbs b/gui/app/pods/search/template.hbs index b843ca09..5d404e20 100644 --- a/gui/app/pods/search/template.hbs +++ b/gui/app/pods/search/template.hbs @@ -1,75 +1,79 @@ -{{#layout/master-sidebar selectedItem="search"}} - + + -
-
Match Filter
-
-
- {{input id="search-1" type="checkbox" checked=matchFilter.matchDoc}} - + + +
+
+
Match Filter
+
+
+ {{input id="search-1" type="checkbox" checked=matchFilter.matchDoc}} + +
+
+ {{input id="search-2" type="checkbox" checked=matchFilter.matchContent}} + +
+
+ {{input id="search-3" type="checkbox" checked=matchFilter.matchTag}} + +
+
+ {{input id="search-4" type="checkbox" checked=matchFilter.matchFile}} + +
+
-
- {{input id="search-2" type="checkbox" checked=matchFilter.matchContent}} - -
-
- {{input id="search-3" type="checkbox" checked=matchFilter.matchTag}} - -
-
- {{input id="search-4" type="checkbox" checked=matchFilter.matchFile}} - + +
+
query examples
+
+ {{#if (eq appMeta.storageProvider constants.StoreProvider.MySQL)}} +
+
apple banana
+
Show results that contain at least one of the two words
+
+apple +banana
+
Show results that contain both words
+
+apple macintosh
+
Show results that contain the word "apple", but rank rows higher if they also contain "macintosh"
+
+apple -macintosh
+
Show results that contain the word "apple" but not "macintosh"
+
+apple +(>turnover <strudel)
+
Show results that contain the words "apple" and "turnover", or "apple" and "strudel" (in any order), but rank "apple turnover" higher than "apple strudel"
+
apple*
+
Show results that contain words such as "apple", "apples", "applesauce", or "applet"
+
"some words"
+
Show results that contain the exact phrase "some words" (for example, rows that contain "some words of wisdom" but not "some noise words")
+
+ {{/if}} + {{#if (eq appMeta.storageProvider constants.StoreProvider.PostgreSQL)}} +
+
apple | banana
+
Show results that contain at either word
+
apple & banana
+
Show results that contain both words
+
apple !macintosh
+
Show results that contain the word "apple" but not "macintosh"
+
google & (apple | microsoft) & !ibm
+
Show results that have "google", either "apple" or "microsoft" but not "ibm"
+
+ {{/if}} + {{#if (eq appMeta.storageProvider constants.StoreProvider.SQLServer)}} + {{/if}} +
-
- + -
-
query examples
-
- {{#if (eq appMeta.storageProvider constants.StoreProvider.MySQL)}} -
-
apple banana
-
Show results that contain at least one of the two words
-
+apple +banana
-
Show results that contain both words
-
+apple macintosh
-
Show results that contain the word "apple", but rank rows higher if they also contain "macintosh"
-
+apple -macintosh
-
Show results that contain the word "apple" but not "macintosh"
-
+apple +(>turnover <strudel)
-
Show results that contain the words "apple" and "turnover", or "apple" and "strudel" (in any order), but rank "apple turnover" higher than "apple strudel"
-
apple*
-
Show results that contain words such as "apple", "apples", "applesauce", or "applet"
-
"some words"
-
Show results that contain the exact phrase "some words" (for example, rows that contain "some words of wisdom" but not "some noise words")
-
- {{/if}} - {{#if (eq appMeta.storageProvider constants.StoreProvider.PostgreSQL)}} -
-
apple | banana
-
Show results that contain at either word
-
apple & banana
-
Show results that contain both words
-
apple !macintosh
-
Show results that contain the word "apple" but not "macintosh"
-
google & (apple | microsoft) & !ibm
-
Show results that have "google", either "apple" or "microsoft" but not "ibm"
-
- {{/if}} - {{#if (eq appMeta.storageProvider constants.StoreProvider.SQLServer)}} - {{/if}} -
-
-{{/layout/master-sidebar}} + + {{layout/logo-heading + title="Search" + desc="Find content" + icon=constants.Icon.Search}} -{{#layout/master-content}} - {{layout/logo-heading - title="Search" - desc="Find content" - icon=constants.Icon.Search}} - - {{search/search-view - filter=filter - matchFilter=matchFilter}} -{{/layout/master-content}} + {{search/search-view + filter=filter + matchFilter=matchFilter}} + + diff --git a/gui/app/pods/updates/route.js b/gui/app/pods/updates/route.js index 86ff885e..4681f6a5 100644 --- a/gui/app/pods/updates/route.js +++ b/gui/app/pods/updates/route.js @@ -12,4 +12,7 @@ import Route from '@ember/routing/route'; export default Route.extend({ + activate() { + this.get('browser').setTitle('Product News'); + } }); diff --git a/gui/app/pods/updates/template.hbs b/gui/app/pods/updates/template.hbs index ef839295..e4183fac 100644 --- a/gui/app/pods/updates/template.hbs +++ b/gui/app/pods/updates/template.hbs @@ -1,26 +1,40 @@ -{{#layout/master-sidebar}} - - -
-
SUMMARY
- -

Documize {{appMeta.edition}} Edition

-

Version {{appMeta.version}}

-

Build {{appMeta.revision}}

-
- -{{/layout/master-sidebar}} - -{{#layout/master-content}} - {{layout/logo-heading - title="Product News" - desc="Latest product news and updates from Documize Inc." - icon=constants.Icon.Announce}} - -
- {{{newsContent}}} -
- Have an idea? Suggestion or feedback? Get in touch! + + +
+
+
+ Documize {{appMeta.edition}} Edition {{appMeta.version}} (build {{appMeta.revision}})
-{{/layout/master-content}} +
+ + + + +
+
+
ABOUT
+
+ Documize product updates are released frequently for both + cloud and self-hosted customers. +
+
+ Have an idea, suggestion or some feedback? Get in touch. +
+
+
+ + + {{layout/logo-heading + title="Product News" + desc="Latest product news and updates" + icon=constants.Icon.Announce}} + +
+ {{{newsContent}}} +
+ Have an idea? Suggestion or feedback? Get in touch! +
+
+ + diff --git a/gui/app/styles/colors.scss b/gui/app/styles/colors.scss index 914d1223..8783e2b4 100644 --- a/gui/app/styles/colors.scss +++ b/gui/app/styles/colors.scss @@ -153,9 +153,11 @@ $color-white-dark-1: #f5f5f5; * Specialty colors **************************************************************/ -// Documents, spaces card background color +// Documents and spaces card background color $color-card: #F6F4EE; -$color-sidebar: #f2f8fd; +$color-sidebar: #F6F4EE; +// $color-card: #F6F4EE; +// $color-sidebar: #f2f8fd; /************************************************************** * Theme colors. diff --git a/gui/app/styles/core/layout/all.scss b/gui/app/styles/core/layout/all.scss index bfdbf72c..bee0bd2b 100644 --- a/gui/app/styles/core/layout/all.scss +++ b/gui/app/styles/core/layout/all.scss @@ -1,5 +1,5 @@ @import "grid.scss"; @import "spacing.scss"; @import "headings.scss"; -@import "bars.scss"; +@import "layout.scss"; @import "sidebar.scss"; diff --git a/gui/app/styles/core/layout/bars.scss b/gui/app/styles/core/layout/layout.scss similarity index 62% rename from gui/app/styles/core/layout/bars.scss rename to gui/app/styles/core/layout/layout.scss index 26f78684..dd6a7243 100644 --- a/gui/app/styles/core/layout/bars.scss +++ b/gui/app/styles/core/layout/layout.scss @@ -1,6 +1,6 @@ -// CSS GRID LAYOUT - -// Mobile-first layout +// ***************************************************************** +// Define mobile-first layout for top navigation bar and toolbar. +// ***************************************************************** .master-navigation { display: block; height: auto; @@ -8,7 +8,7 @@ > .navbar { display: block; - height: auto; + height: 40px; width: 100%; background-color: $theme-500; text-align: center; @@ -50,6 +50,14 @@ } } + > a.option { + color: $theme-300; + + &:hover { + color: $color-white; + } + } + > .invalid-plan { > .dicon { color: map-get($yellow-shades, 600) !important; @@ -86,10 +94,10 @@ > .toolbar { display: block; height: auto; - min-height: 40px; + height: 50px; width: 100%; - background-color: map-get($gray-shades, 100); background-color: $color-sidebar; + background-color: $theme-100; text-align: center; padding: 0; z-index: 999; @@ -107,16 +115,31 @@ > div[class^="zone-"], div[class*=" zone-"] { margin: 0; padding: 10px 10px; + justify-content: center; + + > .label { + font-size: 1rem; + } } } } } -.master-container { +// ***************************************************************** +// Define mobile-first layout for main content zone with a sidebar. +// ***************************************************************** +.master-grid-container { display: block; height: auto; width: 100%; + .master-sidebar { + display: block; + height: auto; + width: 100%; + padding: 10px; + } + .master-content { display: block; height: auto; @@ -125,47 +148,39 @@ } } -// Desktop layout adjustments -// Small screen starts around 900px -@media (min-width: $display-break-1) and (min-height: 650px) { - .master-navigation { - > .navbar { +// $sidebar-height: calc(100vh - 90px); +$sidebar-height: auto; +// Tablet starts around 700px +@media (min-width: $display-break-1) { + .master-grid-container { + display: grid; + grid-template-columns: 200px auto; + + .master-sidebar { + width: 200px; + height: $sidebar-height; + // overflow-x: hidden; + // overflow-y: auto; + padding: 20px 15px; } - > .toolbar { - + .master-content { + grid-column-start: 2; + padding: 20px; + max-width: calc(100vw - 210px); } } } - - - - - - - - -.master-sidebar-container { - display: block; - height: auto; - width: 100%; - //z-index: 1041; // required if we want to show modals from inside sidebar -} - -// Tablet starts around 700px -@media (min-width: $display-break-1) { - .master-container { +// Small screen starts around 900px +@media (min-width: $display-break-2) and (min-height: 650px) { + .master-grid-container { display: grid; grid-template-columns: 240px auto; .master-sidebar { - width: 200px; - height: auto; - max-height: 90vh; - overflow-x: hidden; - overflow-y: auto; + width: 240px; } .master-content { @@ -176,69 +191,35 @@ } } -// Small screen starts around 900px -@media (min-width: $display-break-2) and (min-height: 650px) { - .master-container { - display: grid; - grid-template-columns: 290px auto; - - .master-content { - grid-column-start: 2; - padding: 20px; - max-width: calc(100vw - 300px); - } - } - - .master-sidebar-container { - position: fixed; - width: 290px; - height: 100vh; - - .master-sidebar { - position: fixed; - top: 0; - left: 70px; - width: 220px; - height: 100vh; - } - } -} - // Medium screen starts around 1200px @media (min-width: $display-break-3) and (min-height: 650px) { - .master-container { + .master-grid-container { display: grid; - grid-template-columns: 320px auto; + grid-template-columns: 300px auto; + + .master-sidebar { + width: 300px; + padding: 40px 20px; + } .master-content { grid-column-start: 2; padding: 40px 30px; - max-width: calc(100vw - 330px); - } - } - - .master-sidebar-container { - position: fixed; - width: 320px; - height: 100vh; - - - .master-sidebar { - position: fixed; - top: 0; - left: 70px; - width: 250px; - height: 100vh; - padding: 20px 10px; + max-width: calc(100vw - 310px); } } } // Large screen starts around 1600px @media (min-width: $display-break-4) and (min-height: 650px) { - .master-container { + .master-grid-container { display: grid; - grid-template-columns: 370px minmax(auto, 1200px); + grid-template-columns: 350px minmax(auto, 1200px); + + .master-sidebar { + width: 350px; + padding: 40px 20px; + } .master-content { grid-column-start: 2; @@ -246,19 +227,43 @@ max-width: 1200px; } } +} - .master-sidebar-container { - position: fixed; - width: 370px; - height: 100vh; +// ***************************************************************** +// Define mobile-first layout for content without a sidebar. +// ***************************************************************** +.master-container { + display: block; + height: auto; + width: 100%; + padding: 20px; +} - .master-sidebar { - position: fixed; - top: 0; - left: 70px; - width: 300px; - height: 100vh; - padding: 20px 15px; - } +// Tablet starts around 700px +@media (min-width: $display-break-1) { + .master-container { + padding: 20px; + } +} + +// Small screen starts around 900px +@media (min-width: $display-break-2) and (min-height: 650px) { + .master-container { + padding: 20px; + } +} + +// Medium screen starts around 1200px +@media (min-width: $display-break-3) and (min-height: 650px) { + .master-container { + padding: 30px; + } +} + +// Large screen starts around 1600px +@media (min-width: $display-break-4) and (min-height: 650px) { + .master-container { + padding: 40px; + max-width: 1200px; } } diff --git a/gui/app/styles/core/layout/sidebar.scss b/gui/app/styles/core/layout/sidebar.scss index 28c5b2a2..212cc4ae 100644 --- a/gui/app/styles/core/layout/sidebar.scss +++ b/gui/app/styles/core/layout/sidebar.scss @@ -1,7 +1,10 @@ .sidebar-content { display: block; position: relative; - // @extend .text-truncate; + padding: 20px 10px 10px 10px; + background-color: $color-sidebar; + @include border-radius(4px); + border: 1px solid map-get($gray-shades, 100); > .section { margin: 0; diff --git a/gui/app/templates/components/folder/space-sidebar.hbs b/gui/app/templates/components/folder/space-sidebar.hbs index 531a01dd..0ad4db7d 100644 --- a/gui/app/templates/components/folder/space-sidebar.hbs +++ b/gui/app/templates/components/folder/space-sidebar.hbs @@ -1,56 +1,58 @@ - - -
filter
-
-
- -
All ({{documents.length}})
-
- {{#if hasCategories}} - {{#if (gt rootDocCount 0)}} -
+ +
+
filter
+
+
-
Uncategorized ({{rootDocCount}})
+
All ({{documents.length}})
- {{/if}} - {{/if}} - {{#if permissions.documentTemplate}} -
- -
Templates ({{templates.length}})
-
- {{/if}} - {{#if permissions.documentLifecycle}} -
- -
Drafts ({{documentsDraft.length}})
-
-
- -
Live ({{documentsLive.length}})
-
- {{/if}} -
- -
Added recently ({{recentAdd.length}})
-
-
- -
Updated recently ({{recentUpdate.length}})
-
-
- - - -
category
-
- {{#if categories}} - {{#each categories as |cat|}} -
- -
{{cat.category}} ({{cat.docCount}})
+ {{#if hasCategories}} + {{#if (gt rootDocCount 0)}} +
+ +
Uncategorized ({{rootDocCount}})
+
+ {{/if}} + {{/if}} + {{#if permissions.documentTemplate}} +
+ +
Templates ({{templates.length}})
+
+ {{/if}} + {{#if permissions.documentLifecycle}} +
+ +
Drafts ({{documentsDraft.length}})
+
+
+ +
Live ({{documentsLive.length}})
+
+ {{/if}} +
+ +
Added recently ({{recentAdd.length}})
- {{/each}} - {{else}} - {{/if}} -
+
+ +
Updated recently ({{recentUpdate.length}})
+
+
+ + + +
category
+
+ {{#if categories}} + {{#each categories as |cat|}} +
+ +
{{cat.category}} ({{cat.docCount}})
+
+ {{/each}} + {{else}} + {{/if}} +
+
+ diff --git a/gui/app/templates/components/layout/container.hbs b/gui/app/templates/components/layout/container.hbs new file mode 100644 index 00000000..c23f542a --- /dev/null +++ b/gui/app/templates/components/layout/container.hbs @@ -0,0 +1,2 @@ +{{yield}} + diff --git a/gui/app/templates/components/layout/grid/container.hbs b/gui/app/templates/components/layout/grid/container.hbs new file mode 100644 index 00000000..c23f542a --- /dev/null +++ b/gui/app/templates/components/layout/grid/container.hbs @@ -0,0 +1,2 @@ +{{yield}} + diff --git a/gui/app/templates/components/layout/grid/content.hbs b/gui/app/templates/components/layout/grid/content.hbs new file mode 100644 index 00000000..889d9eea --- /dev/null +++ b/gui/app/templates/components/layout/grid/content.hbs @@ -0,0 +1 @@ +{{yield}} diff --git a/gui/app/templates/components/layout/grid/sidebar.hbs b/gui/app/templates/components/layout/grid/sidebar.hbs new file mode 100644 index 00000000..889d9eea --- /dev/null +++ b/gui/app/templates/components/layout/grid/sidebar.hbs @@ -0,0 +1 @@ +{{yield}} diff --git a/gui/app/templates/components/layout/master-content.hbs b/gui/app/templates/components/layout/master-content.hbs deleted file mode 100644 index c32e9378..00000000 --- a/gui/app/templates/components/layout/master-content.hbs +++ /dev/null @@ -1,4 +0,0 @@ -
- {{yield}} -
- diff --git a/gui/app/templates/components/layout/master-navigation.hbs b/gui/app/templates/components/layout/master-navigation.hbs index 04681f16..0199c730 100644 --- a/gui/app/templates/components/layout/master-navigation.hbs +++ b/gui/app/templates/components/layout/master-navigation.hbs @@ -101,7 +101,7 @@ {{/if}} {{/if}}
- What's New + What's New Help {{#if enableLogout}}
@@ -112,10 +112,8 @@
{{else}} - {{#link-to "auth.login" class="login"}} - - {{#attach-tooltip showDelay=1000}}Login{{/attach-tooltip}} - + {{#link-to "auth.login" class="option"}} + {{constants.Label.Login}} {{/link-to}} {{/if}}
diff --git a/gui/app/templates/components/layout/master-toolbar.hbs b/gui/app/templates/components/layout/master-toolbar.hbs index f48eaa3a..bbd33625 100644 --- a/gui/app/templates/components/layout/master-toolbar.hbs +++ b/gui/app/templates/components/layout/master-toolbar.hbs @@ -3,4 +3,3 @@ {{yield}}
-