From a0de673cc059bcfb2a611ce3e03c81de90c6333a Mon Sep 17 00:00:00 2001 From: eris Date: Sat, 30 Jul 2022 22:14:37 +0000 Subject: [PATCH 1/9] Redo desktop nav and change bell to bolt for interactions --- src/components/desktop_nav/desktop_nav.js | 12 ++- src/components/desktop_nav/desktop_nav.scss | 40 ++++++-- src/components/desktop_nav/desktop_nav.vue | 107 +++++++++++++++++++- src/components/nav_panel/nav_panel.js | 4 +- src/components/nav_panel/nav_panel.vue | 2 +- src/components/side_drawer/side_drawer.js | 4 +- src/components/side_drawer/side_drawer.vue | 2 +- 7 files changed, 152 insertions(+), 19 deletions(-) diff --git a/src/components/desktop_nav/desktop_nav.js b/src/components/desktop_nav/desktop_nav.js index e048f53d..7c654bdc 100644 --- a/src/components/desktop_nav/desktop_nav.js +++ b/src/components/desktop_nav/desktop_nav.js @@ -5,12 +5,16 @@ import { faSignOutAlt, faHome, faComments, - faBell, faUserPlus, faBullhorn, faSearch, faTachometerAlt, faCog, + faGlobe, + faBolt, + faUsers, + faCommentMedical, + faBookmark, faInfoCircle } from '@fortawesome/free-solid-svg-icons' @@ -19,12 +23,16 @@ library.add( faSignOutAlt, faHome, faComments, - faBell, faUserPlus, faBullhorn, faSearch, faTachometerAlt, faCog, + faGlobe, + faBolt, + faUsers, + faCommentMedical, + faBookmark, faInfoCircle ) diff --git a/src/components/desktop_nav/desktop_nav.scss b/src/components/desktop_nav/desktop_nav.scss index 7fd2b26f..85057be0 100644 --- a/src/components/desktop_nav/desktop_nav.scss +++ b/src/components/desktop_nav/desktop_nav.scss @@ -15,16 +15,16 @@ display: grid; grid-template-rows: var(--navbar-height); grid-template-columns: 2fr auto 2fr; - grid-template-areas: "sitename logo actions"; + grid-template-areas: "nav-left logo actions"; box-sizing: border-box; padding: 0 1.2em; margin: auto; - max-width: 980px; + max-width: 1110px; } &.-logoLeft .inner-nav { grid-template-columns: auto 2fr 2fr; - grid-template-areas: "logo sitename actions"; + grid-template-areas: "logo nav-left actions"; } .button-default { @@ -84,12 +84,23 @@ } .nav-icon { - margin-left: 1em; + margin-left: 0.2em; width: 2em; height: 100%; - font-size: 130%; text-align: center; + &.router-link-active { + font-size: 1.2em; + margin-top: 0.05em; + + .svg-inline--fa { + font-weight: bolder; + color: $fallback--text; + color: var(--selectedMenuText, $fallback--text); + --lightText: var(--selectedMenuLightText, $fallback--lightText); + } + } + &-logout { margin-left: 2em; } @@ -100,8 +111,23 @@ } } - .sitename { - grid-area: sitename; + .left { + padding-left: 5px; + display: flex; + + .nav-icon { + margin-left: 0.15em; + } + } + + .nav-left-wrapper { + grid-area: nav-left; + + .favicon { + height: 28px; + vertical-align: middle; + padding-right: 5px; + } } .actions { diff --git a/src/components/desktop_nav/desktop_nav.vue b/src/components/desktop_nav/desktop_nav.vue index fe9af544..9ce21ee3 100644 --- a/src/components/desktop_nav/desktop_nav.vue +++ b/src/components/desktop_nav/desktop_nav.vue @@ -6,15 +6,74 @@ @click="scrollToTop()" >
-
+
- {{ sitename }} + + + {{ sitename }} + +
+ + + + + + + + + + + + +
diff --git a/src/components/settings_modal/settings_modal.js b/src/components/settings_modal/settings_modal.js index 0a72dca1..b1bb4eab 100644 --- a/src/components/settings_modal/settings_modal.js +++ b/src/components/settings_modal/settings_modal.js @@ -14,6 +14,7 @@ import { faTimes, faFileUpload, faFileDownload, + faSignOutAlt, faChevronDown } from '@fortawesome/free-solid-svg-icons' import { @@ -28,6 +29,7 @@ library.add( faWindowMinimize, faFileUpload, faFileDownload, + faSignOutAlt, faChevronDown ) @@ -66,6 +68,11 @@ const SettingsModal = { closeModal () { this.$store.dispatch('closeSettingsModal') }, + logout () { + this.$router.replace('/main/public') + this.$store.dispatch('closeSettingsModal') + this.$store.dispatch('logout') + }, peekModal () { this.$store.dispatch('togglePeekSettingsModal') }, @@ -150,6 +157,7 @@ const SettingsModal = { } }, computed: { + currentUser () { return this.$store.state.users.currentUser }, currentSaveStateNotice () { return this.$store.state.interface.settings.currentSaveStateNotice }, diff --git a/src/components/settings_modal/settings_modal.scss b/src/components/settings_modal/settings_modal.scss index 13cb0e65..6312e3e7 100644 --- a/src/components/settings_modal/settings_modal.scss +++ b/src/components/settings_modal/settings_modal.scss @@ -71,5 +71,10 @@ display: flex; flex-grow: 1; } + + .logout-button { + position: absolute; + right: 20px; + } } } diff --git a/src/components/settings_modal/settings_modal.vue b/src/components/settings_modal/settings_modal.vue index d3bed061..03c9978e 100644 --- a/src/components/settings_modal/settings_modal.vue +++ b/src/components/settings_modal/settings_modal.vue @@ -111,6 +111,20 @@ id="unscrolled-content" class="extra-content" /> + -- 2.43.0 From 201b91e8bf356e5d0e2661653afca58940f15c24 Mon Sep 17 00:00:00 2001 From: eris Date: Sun, 7 Aug 2022 06:34:41 +0000 Subject: [PATCH 8/9] Better padding for logout button --- src/components/settings_modal/settings_modal.scss | 1 + 1 file changed, 1 insertion(+) diff --git a/src/components/settings_modal/settings_modal.scss b/src/components/settings_modal/settings_modal.scss index 6312e3e7..70b63360 100644 --- a/src/components/settings_modal/settings_modal.scss +++ b/src/components/settings_modal/settings_modal.scss @@ -75,6 +75,7 @@ .logout-button { position: absolute; right: 20px; + padding-right: 10px; } } } -- 2.43.0 From 71a8d6b2b03eee614e7008b672221363b557b25d Mon Sep 17 00:00:00 2001 From: eris Date: Sun, 7 Aug 2022 07:09:45 +0000 Subject: [PATCH 9/9] Make all new nav options expert/advanced options --- .../settings_modal/tabs/general_tab.vue | 20 +++++++++++++++---- 1 file changed, 16 insertions(+), 4 deletions(-) diff --git a/src/components/settings_modal/tabs/general_tab.vue b/src/components/settings_modal/tabs/general_tab.vue index 652395c2..0ce9cf7b 100644 --- a/src/components/settings_modal/tabs/general_tab.vue +++ b/src/components/settings_modal/tabs/general_tab.vue @@ -26,22 +26,34 @@
  • - + {{ $t('settings.hide_site_favicon') }}
  • - + {{ $t('settings.hide_site_name') }}
  • - + {{ $t('settings.show_nav_shortcuts') }}
  • - + {{ $t('settings.show_wider_shortcuts') }}
    • -- 2.43.0