From cb0ae299849a1d40d42b47014bab37682abc1dc4 Mon Sep 17 00:00:00 2001 From: hossainemruz Date: Tue, 26 Sep 2023 03:58:32 +0600 Subject: [PATCH] Use unified navbar for all pages Signed-off-by: hossainemruz --- assets/scripts/application.js | 3 + assets/scripts/sections/navbar.js | 20 +-- assets/styles/layouts/404.scss | 2 +- assets/styles/layouts/list.scss | 11 +- assets/styles/layouts/notes.scss | 120 +++++++------- assets/styles/navigators/navbar.scss | 146 +++++++++--------- assets/styles/navigators/sidebar.scss | 16 +- layouts/404.html | 2 +- layouts/_default/list.html | 2 +- layouts/_default/search.html | 2 +- layouts/_default/single.html | 5 +- layouts/categories/list.html | 2 +- layouts/notes/list.html | 2 +- layouts/notes/single.html | 2 +- .../navigators/floating-lang-selector.html | 25 --- .../partials/navigators/lang-selector-2.html | 25 --- layouts/partials/navigators/navbar-2.html | 63 -------- layouts/partials/navigators/navbar.html | 30 ++-- layouts/partials/navigators/sidebar.html | 6 +- layouts/partials/scripts.html | 2 +- layouts/tags/list.html | 2 +- package-lock.json | 46 ++++++ package.hugo.json | 3 +- package.json | 4 + 24 files changed, 243 insertions(+), 298 deletions(-) delete mode 100644 layouts/partials/navigators/floating-lang-selector.html delete mode 100644 layouts/partials/navigators/lang-selector-2.html delete mode 100644 layouts/partials/navigators/navbar-2.html diff --git a/assets/scripts/application.js b/assets/scripts/application.js index b6ade04..2a1bbab 100644 --- a/assets/scripts/application.js +++ b/assets/scripts/application.js @@ -1,8 +1,11 @@ import 'popper.js' import 'bootstrap' import '@fortawesome/fontawesome-free/js/all' +import feather from 'feather-icons' import './core' import './features' import './sections' import './pages' + +feather.replace(); diff --git a/assets/scripts/sections/navbar.js b/assets/scripts/sections/navbar.js index 0bf75bf..9db8578 100644 --- a/assets/scripts/sections/navbar.js +++ b/assets/scripts/sections/navbar.js @@ -4,8 +4,8 @@ const updateNavBar = () => { const themeIcon = document.getElementById('navbar-theme-icon-svg') if (window.scrollY > 40) { - topNavbar?.classList.remove('initial-navbar') - topNavbar?.classList.add('final-navbar', 'shadow') + topNavbar?.classList.remove('transparent-navbar') + topNavbar?.classList.add('shadow') navbarToggler?.classList.remove('navbar-dark') navbarToggler?.classList.add('navbar-light') @@ -20,8 +20,8 @@ const updateNavBar = () => { document.getElementById('logo')?.setAttribute('src', logoURL) } } else { - topNavbar?.classList.remove('final-navbar', 'shadow') - topNavbar?.classList.add('initial-navbar') + topNavbar?.classList.remove('shadow') + topNavbar?.classList.add('transparent-navbar') navbarToggler?.classList.remove('navbar-light') navbarToggler?.classList.add('navbar-dark') @@ -43,18 +43,20 @@ document.addEventListener('DOMContentLoaded', function () { // ================================================== // When the user scrolls down 80px from the top of the document, // resize the navbar's padding and the logo's font size - document.addEventListener('scroll', updateNavBar) + const topNavbar = document.getElementById('top-navbar') + if (topNavbar?.classList.contains('homepage')) { + document.addEventListener('scroll', updateNavBar) + updateNavBar() + } // Creates a click handler to collapse the navigation when // anchors in the mobile nav pop up are clicked - const navMain =document.getElementsByClassName('navbar-collapse') - Array.from(navMain).forEach(function(el) { + const navMain = document.getElementsByClassName('navbar-collapse') + Array.from(navMain).forEach(function (el) { el.addEventListener('click', function (e) { if (e.target.tagName === 'A') { el.classList.add('collapse') } }) }) - - updateNavBar() }) diff --git a/assets/styles/layouts/404.scss b/assets/styles/layouts/404.scss index 458b2dc..e4b1265 100644 --- a/assets/styles/layouts/404.scss +++ b/assets/styles/layouts/404.scss @@ -1,5 +1,5 @@ body.kind-404 { - .navbar-toggler { + #sidebar-toggler { display: none; } diff --git a/assets/styles/layouts/list.scss b/assets/styles/layouts/list.scss index 4e3b18e..cd368d9 100644 --- a/assets/styles/layouts/list.scss +++ b/assets/styles/layouts/list.scss @@ -110,10 +110,6 @@ body.kind-page { display: block; } - #toc-toggler { - visibility: hidden; - } - .navbar-collapse.lang-selector { display: block !important; position: absolute; @@ -164,7 +160,6 @@ body.kind-page { margin-top: 0.5rem; transition: all ease-out 0.3s; } - } @include media('=medium','=medium', '=large','=large', '=very-large','=very-large', ' - {{ if .IsTranslated }} - {{ partial "navigators/floating-lang-selector.html" . }} - {{ end }} {{ end }} diff --git a/layouts/categories/list.html b/layouts/categories/list.html index 2e7c84a..48a48a4 100644 --- a/layouts/categories/list.html +++ b/layouts/categories/list.html @@ -1,5 +1,5 @@ {{ define "navbar" }} - {{ partial "navigators/navbar-2.html" . }} + {{ partial "navigators/navbar.html" . }} {{ end }} {{ define "sidebar" }} diff --git a/layouts/notes/list.html b/layouts/notes/list.html index f5fba56..4dea0f0 100644 --- a/layouts/notes/list.html +++ b/layouts/notes/list.html @@ -1,5 +1,5 @@ {{ define "navbar" }} - {{ partial "navigators/navbar-2.html" . }} + {{ partial "navigators/navbar.html" . }} {{ end }} {{ define "sidebar" }} diff --git a/layouts/notes/single.html b/layouts/notes/single.html index b1ccb51..c4a0bc5 100644 --- a/layouts/notes/single.html +++ b/layouts/notes/single.html @@ -1,5 +1,5 @@ {{ define "navbar" }} - {{ partial "navigators/navbar-2.html" . }} + {{ partial "navigators/navbar.html" . }} {{ end }} {{ define "sidebar" }} diff --git a/layouts/partials/navigators/floating-lang-selector.html b/layouts/partials/navigators/floating-lang-selector.html deleted file mode 100644 index 8ad016e..0000000 --- a/layouts/partials/navigators/floating-lang-selector.html +++ /dev/null @@ -1,25 +0,0 @@ -{{ $pageURL:= .RelPermalink }} -{{ if site.IsMultiLingual }} - {{ $pageURL = strings.TrimPrefix (path.Join "/" .Language.Lang) $pageURL }} -{{ end }} - -
- -
- {{ range .Translations }} - - {{ if ne site.Params.features.flags.enable false }} - {{ $countryCode := partial "helpers/country-code.html" . }} - - {{ end }} - {{ .Language.LanguageName }} - - {{ end }} -
-
diff --git a/layouts/partials/navigators/lang-selector-2.html b/layouts/partials/navigators/lang-selector-2.html deleted file mode 100644 index f388d69..0000000 --- a/layouts/partials/navigators/lang-selector-2.html +++ /dev/null @@ -1,25 +0,0 @@ -{{ $pageURL:= .RelPermalink }} -{{ if site.IsMultiLingual }} - {{ $pageURL = strings.TrimPrefix (path.Join "/" .Language.Lang) $pageURL }} -{{ end }} - -
  • - -
    - {{ range .Translations }} - - {{ if ne site.Params.features.flags.enable false }} - {{ $countryCode := partial "helpers/country-code.html" . }} - - {{ end }} - {{ .Language.LanguageName }} - - {{ end }} -
    -
    • diff --git a/layouts/partials/navigators/navbar-2.html b/layouts/partials/navigators/navbar-2.html deleted file mode 100644 index 8780ec6..0000000 --- a/layouts/partials/navigators/navbar-2.html +++ /dev/null @@ -1,63 +0,0 @@ -{{/* by default, don't use any logo */}} -{{ $mainLogo := "" }} -{{ $invertedLogo := "" }} - -{{/* if custom logo has been provided, use them */}} -{{ if site.Params.logo.main }} - {{ $mainLogo = site.Params.logo.main }} -{{ end }} -{{ if site.Params.logo.inverted }} - {{ $invertedLogo = site.Params.logo.inverted }} -{{ end }} - -{{/* resize the logos. don't resize svg because it is not supported */}} -{{ if $mainLogo }} - {{ $mainLogo = resources.Get $mainLogo}} - {{ if and $mainLogo (ne $mainLogo.MediaType.SubType "svg") }} - {{ $mainLogo = $mainLogo.Resize "42x" }} - {{ end }} - {{ $mainLogo = $mainLogo.RelPermalink}} -{{ end }} - -{{ if $invertedLogo }} - {{ $invertedLogo = resources.Get $invertedLogo}} - {{ if and $invertedLogo (ne $invertedLogo.MediaType.SubType "svg")}} - {{ $invertedLogo = $invertedLogo.Resize "42x" }} - {{ end }} - {{ $invertedLogo = $invertedLogo.RelPermalink}} -{{ end }} - - diff --git a/layouts/partials/navigators/navbar.html b/layouts/partials/navigators/navbar.html index b9fdd58..9071004 100644 --- a/layouts/partials/navigators/navbar.html +++ b/layouts/partials/navigators/navbar.html @@ -37,6 +37,11 @@ {{ $invertedLogo = $invertedLogo.RelPermalink}} {{ end }} +{{ $logo := $mainLogo }} +{{ if .IsHome }} + {{ $logo = $invertedLogo }} +{{ end }} + {{ $customMenus := site.Params.customMenus }} {{ if (index site.Data site.Language.Lang).site.customMenus }} {{ $customMenus = (index site.Data site.Language.Lang).site.customMenus }} @@ -47,29 +52,34 @@ {{ $sections = (index site.Data site.Language.Lang).sections }} {{ end }} -