mirror of
https://github.com/gethinode/hinode.git
synced 2025-10-17 06:53:11 +00:00
Merge pull request #304 from gethinode/develop
Add optional alert when version is outdated
This commit is contained in:
14
assets/js/alert.js
Normal file
14
assets/js/alert.js
Normal file
@@ -0,0 +1,14 @@
|
||||
const alert = document.getElementById('page-alert')
|
||||
const closeBtn = document.getElementById('page-alert-btn-close')
|
||||
if (alert !== null && closeBtn !== null) {
|
||||
const version = alert.getAttribute('data-page-alert-version') || 'unknown'
|
||||
const hideAlert = sessionStorage.getItem(`page-alert-${version}`) !== null
|
||||
if (hideAlert) {
|
||||
alert.classList.add('d-none')
|
||||
}
|
||||
|
||||
closeBtn.addEventListener('click', () => {
|
||||
sessionStorage.setItem(`page-alert-${version}`, 'seen')
|
||||
alert.classList.add('d-none')
|
||||
})
|
||||
}
|
@@ -62,6 +62,7 @@
|
||||
// scss-docs-end awesome
|
||||
|
||||
// Import Hinode theme styles
|
||||
@import "components/alert.scss";
|
||||
@import "components/blockquote.scss";
|
||||
@import "components/buttons.scss";
|
||||
@import "components/card.scss";
|
||||
|
3
assets/scss/components/_alert.scss
Normal file
3
assets/scss/components/_alert.scss
Normal file
@@ -0,0 +1,3 @@
|
||||
.alert-no-decoration {
|
||||
--bs-alert-border-radius: none;
|
||||
}
|
@@ -8,10 +8,13 @@
|
||||
|
||||
# toml-docs-start docs
|
||||
[docs]
|
||||
latest = "1.0"
|
||||
version = "0.8"
|
||||
basePath = ""
|
||||
github = "https://github.com/gethinode/hinode"
|
||||
release = "https://github.com/gethinode/hinode/releases/tag/"
|
||||
checkVersion = true
|
||||
latestURL = "https://demo.gethinode.com/"
|
||||
# toml-docs-end docs
|
||||
|
||||
# toml-docs-start home
|
||||
|
@@ -91,8 +91,10 @@
|
||||
translation: "Code"
|
||||
- id: latest
|
||||
translation: "latest"
|
||||
- id: allVersions
|
||||
- id: allVersions
|
||||
translation: "All versions"
|
||||
- id: newerVersionAlert
|
||||
translation: "There is a newer version of {{ . }}!"
|
||||
|
||||
# 404 page
|
||||
- id: pageNotFound
|
||||
|
@@ -83,6 +83,8 @@
|
||||
translation: "meest recente"
|
||||
- id: allVersions
|
||||
translation: "Alle versies"
|
||||
- id: newerVersionAlert
|
||||
translation: "Er is een nieuwere versie van {{ . }}!"
|
||||
|
||||
# 404 page
|
||||
- id: pageNotFound
|
||||
|
@@ -3,6 +3,16 @@
|
||||
{{- $.Scratch.Set "version" $version -}}
|
||||
{{ with partial "utilities/GetMenu" (dict "page" . "version" $version) }}{{ $.Scratch.Set "sidebar" . }}{{ end }}
|
||||
|
||||
{{- if site.Params.docs.checkVersion -}}
|
||||
{{ with $version }}
|
||||
{{- $isOlder := partial "utilities/IsOlder" (dict "current" .) -}}
|
||||
{{- if $isOlder }}
|
||||
{{- $.Scratch.Set "pageAlertMsg" (T "newerVersionAlert" site.Title) -}}
|
||||
{{- $.Scratch.Set "pageAlertURL" (or site.Params.docs.latestURL site.baseURL) -}}
|
||||
{{- end -}}
|
||||
{{- end -}}
|
||||
{{- end -}}
|
||||
|
||||
<!doctype html>
|
||||
<html lang="{{ .Site.Language.Lang }}" class="no-js">
|
||||
<head>
|
||||
|
@@ -181,110 +181,113 @@
|
||||
{{- if eq $color "black" }}{{ $theme = "dark" }}{{ end -}}
|
||||
{{- if eq $color "white" }}{{ $theme = "light" }}{{ end -}}
|
||||
|
||||
<nav class="navbar navbar-expand-{{ $size }} {{ with $color }}bg-{{ . }}{{ end }} {{ if $fixed }}fixed-top{{ end }} p-4"{{ with $theme }} data-bs-theme="{{ . }}"{{ end }}>
|
||||
<div class="container-xxl p-0">
|
||||
<!-- Insert sidebar toggler when applicable -->
|
||||
<div class="d-flex">
|
||||
{{- if $page.Scratch.Get "sidebar" -}}
|
||||
<button class="navbar-toggler fw-30 collapsed p-0 mx-auto" type="button" data-bs-toggle="offcanvas" data-bs-target="#offcanvass-sidebar" aria-controls="offcanvass-sidebar" aria-label="{{ T "toggleSidebar" }}">
|
||||
{{- partial "assets/icon.html" (dict "icon" "fas ellipsis") -}}
|
||||
<div class="container-fluid {{ if $fixed }}fixed-top{{ end }} p-0"{{ with $theme }} data-bs-theme="{{ . }}"{{ end }}>
|
||||
{{- partial "assets/page-alert.html" (dict "page" $page) -}}
|
||||
<nav class="navbar navbar-expand-{{ $size }} {{ with $color }}bg-{{ . }}{{ end }} p-4"{{ with $theme }} data-bs-theme="{{ . }}"{{ end }}>
|
||||
<div class="container-xxl p-0">
|
||||
<!-- Insert sidebar toggler when applicable -->
|
||||
<div class="d-flex">
|
||||
{{- if $page.Scratch.Get "sidebar" -}}
|
||||
<button class="navbar-toggler fw-30 collapsed p-0 mx-auto" type="button" data-bs-toggle="offcanvas" data-bs-target="#offcanvass-sidebar" aria-controls="offcanvass-sidebar" aria-label="{{ T "toggleSidebar" }}">
|
||||
{{- partial "assets/icon.html" (dict "icon" "fas ellipsis") -}}
|
||||
</button>
|
||||
{{- else -}}
|
||||
<!-- Insert invisible sidebar toggler to center logo correctly on smaller screens -->
|
||||
<button class="navbar-toggler fw-30 collapsed p-0 mx-auto invisible" type="button">
|
||||
{{- partial "assets/icon.html" (dict "icon" "fas ellipsis") -}}
|
||||
</button>
|
||||
{{- end -}}
|
||||
</div>
|
||||
|
||||
<!-- Insert the brand logo or name -->
|
||||
<a class="navbar-brand mx-auto" href="{{ site.Home.RelPermalink }}">
|
||||
{{- if $logo -}}
|
||||
<img src="{{ $logo }}" alt="{{ $title }} logo" height="30">
|
||||
{{- else -}}
|
||||
<span class="fw-bold">{{ $title }}</span>
|
||||
{{- end -}}
|
||||
</a>
|
||||
|
||||
<!-- Insert main navigation toggler -->
|
||||
<div class="d-flex fw-30">
|
||||
<button id="main-nav-toggler" class="navbar-toggler collapsed p-0" type="button" data-bs-toggle="collapse" data-bs-target="#{{ $id }}"
|
||||
aria-controls="{{ $id }}" aria-expanded="false" aria-label="{{ T "toggleMainNav" }}">
|
||||
<span class="toggler-icon top-bar emphasis"></span>
|
||||
<span class="toggler-icon middle-bar emphasis"></span>
|
||||
<span class="toggler-icon bottom-bar emphasis"></span>
|
||||
</button>
|
||||
{{- else -}}
|
||||
<!-- Insert invisible sidebar toggler to center logo correctly on smaller screens -->
|
||||
<button class="navbar-toggler fw-30 collapsed p-0 mx-auto invisible" type="button">
|
||||
{{- partial "assets/icon.html" (dict "icon" "fas ellipsis") -}}
|
||||
</button>
|
||||
{{- end -}}
|
||||
</div>
|
||||
|
||||
<!-- Insert the brand logo or name -->
|
||||
<a class="navbar-brand mx-auto" href="{{ site.Home.RelPermalink }}">
|
||||
{{- if $logo -}}
|
||||
<img src="{{ $logo }}" alt="{{ $title }} logo" height="30">
|
||||
{{- else -}}
|
||||
<span class="fw-bold">{{ $title }}</span>
|
||||
{{- end -}}
|
||||
</a>
|
||||
|
||||
<!-- Insert main navigation toggler -->
|
||||
<div class="d-flex fw-30">
|
||||
<button id="main-nav-toggler" class="navbar-toggler collapsed p-0" type="button" data-bs-toggle="collapse" data-bs-target="#{{ $id }}"
|
||||
aria-controls="{{ $id }}" aria-expanded="false" aria-label="{{ T "toggleMainNav" }}">
|
||||
<span class="toggler-icon top-bar emphasis"></span>
|
||||
<span class="toggler-icon middle-bar emphasis"></span>
|
||||
<span class="toggler-icon bottom-bar emphasis"></span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="navbar-collapse collapse" id="{{ $id }}">
|
||||
<!-- Insert search input -->
|
||||
{{- if $search }}{{ partial "assets/search-input.html" -}}{{ end -}}
|
||||
|
||||
<!-- Render top-menu items (maximum depth of 2) -->
|
||||
<ul class="navbar-nav ms-auto">
|
||||
{{- range $menu := $menus -}}
|
||||
<li class="nav-item{{ if .HasChildren }} dropdown{{ end }}">
|
||||
{{- partial "assets/navbar-item.html" (dict "menu" $menu "page" $page) -}}
|
||||
{{- if .HasChildren -}}
|
||||
<ul class="dropdown-menu dropdown-menu-end">
|
||||
{{- range .Children -}}
|
||||
{{- partial "assets/navbar-item.html" (dict "menu" . "parent" $menu "page" $page) -}}
|
||||
</div>
|
||||
|
||||
<div class="navbar-collapse collapse" id="{{ $id }}">
|
||||
<!-- Insert search input -->
|
||||
{{- if $search }}{{ partial "assets/search-input.html" -}}{{ end -}}
|
||||
|
||||
<!-- Render top-menu items (maximum depth of 2) -->
|
||||
<ul class="navbar-nav ms-auto">
|
||||
{{- range $menu := $menus -}}
|
||||
<li class="nav-item{{ if .HasChildren }} dropdown{{ end }}">
|
||||
{{- partial "assets/navbar-item.html" (dict "menu" $menu "page" $page) -}}
|
||||
{{- if .HasChildren -}}
|
||||
<ul class="dropdown-menu dropdown-menu-end">
|
||||
{{- range .Children -}}
|
||||
{{- partial "assets/navbar-item.html" (dict "menu" . "parent" $menu "page" $page) -}}
|
||||
{{- end -}}
|
||||
</ul>
|
||||
{{- end -}}
|
||||
</li>
|
||||
{{- end -}}
|
||||
|
||||
<!-- Insert divider if applicable -->
|
||||
{{- if or $enableLanguage $enableVersions -}}
|
||||
<li class="nav-item py-2 py-md-1 col-12 col-md-auto d-none d-{{ $size }}-block">
|
||||
<div class="vr d-none d-md-flex h-100 mx-md-2"></div>
|
||||
</li>
|
||||
<li><hr class="dropdown-divider-bg"></li>
|
||||
{{- end -}}
|
||||
|
||||
<!-- Insert language switcher if applicable -->
|
||||
{{- if $enableLanguage -}}
|
||||
{{- $currentLang := $page.Language.Lang -}}
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle d-{{ $size }}-none" href="#!" role="button" data-bs-toggle="dropdown" aria-expanded="false">
|
||||
{{- partial "assets/icon.html" (dict "icon" "fas globe") }} {{ T "languageSwitcherLabel" }}
|
||||
</a>
|
||||
<a class="nav-link dropdown-toggle d-none d-{{ $size }}-block" href="#!" role="button" data-bs-toggle="dropdown" aria-expanded="false">
|
||||
{{- partial "assets/icon.html" (dict "icon" "fas globe") }}
|
||||
</a>
|
||||
<ul class="dropdown-menu dropdown-menu-end ">
|
||||
{{- if $page.IsTranslated -}}
|
||||
{{- range $page.AllTranslations -}}
|
||||
<li><a class="dropdown-item {{ if eq .Language.Lang $currentLang }}active{{ end }}" href="{{ .Permalink }}">{{ .Language.LanguageName }}</a></li>
|
||||
{{- end -}}
|
||||
{{- else -}}
|
||||
{{- range site.Languages -}}
|
||||
<li><a class="dropdown-item" href="/{{ .Lang }}">{{ default .Lang .LanguageName }}</a></li>
|
||||
{{- end -}}
|
||||
{{- end -}}
|
||||
</ul>
|
||||
{{- end -}}
|
||||
</li>
|
||||
{{- end -}}
|
||||
|
||||
<!-- Insert divider if applicable -->
|
||||
{{- if or $enableLanguage $enableVersions -}}
|
||||
<li class="nav-item py-2 py-md-1 col-12 col-md-auto d-none d-{{ $size }}-block">
|
||||
<div class="vr d-none d-md-flex h-100 mx-md-2"></div>
|
||||
</li>
|
||||
<li><hr class="dropdown-divider-bg"></li>
|
||||
{{- end -}}
|
||||
|
||||
<!-- Insert language switcher if applicable -->
|
||||
{{- if $enableLanguage -}}
|
||||
{{- $currentLang := $page.Language.Lang -}}
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle d-{{ $size }}-none" href="#!" role="button" data-bs-toggle="dropdown" aria-expanded="false">
|
||||
{{- partial "assets/icon.html" (dict "icon" "fas globe") }} {{ T "languageSwitcherLabel" }}
|
||||
</a>
|
||||
<a class="nav-link dropdown-toggle d-none d-{{ $size }}-block" href="#!" role="button" data-bs-toggle="dropdown" aria-expanded="false">
|
||||
{{- partial "assets/icon.html" (dict "icon" "fas globe") }}
|
||||
</a>
|
||||
<ul class="dropdown-menu dropdown-menu-end ">
|
||||
{{- if $page.IsTranslated -}}
|
||||
{{- range $page.AllTranslations -}}
|
||||
<li><a class="dropdown-item {{ if eq .Language.Lang $currentLang }}active{{ end }}" href="{{ .Permalink }}">{{ .Language.LanguageName }}</a></li>
|
||||
{{- end -}}
|
||||
{{- else -}}
|
||||
{{- range site.Languages -}}
|
||||
<li><a class="dropdown-item" href="/{{ .Lang }}">{{ default .Lang .LanguageName }}</a></li>
|
||||
{{- end -}}
|
||||
{{- end -}}
|
||||
</ul>
|
||||
</li>
|
||||
{{- end -}}
|
||||
|
||||
<!-- Insert version switcher -->
|
||||
{{- if $enableVersions -}}
|
||||
{{- partial "partials/navbar-versions.html" (dict "page" $page "size" $size "collapsed" true ) -}}
|
||||
{{- partial "partials/navbar-versions.html" (dict "page" $page "size" $size "collapsed" false) -}}
|
||||
{{- end -}}
|
||||
|
||||
<!-- Insert color mode switcher -->
|
||||
{{- if $enableDarkMode -}}
|
||||
<!-- Insert divider -->
|
||||
<li class="nav-item py-2 py-md-1 col-12 col-md-auto d-none d-{{ $size }}-block">
|
||||
<div class="vr d-none d-md-flex h-100 mx-md-2"></div>
|
||||
</li>
|
||||
<li><hr class="dropdown-divider-bg"></li>
|
||||
|
||||
{{- partial "partials/navbar-mode.html" (dict "size" $size "collapsed" true) -}}
|
||||
{{- partial "partials/navbar-mode.html" (dict "size" $size "collapsed" false) -}}
|
||||
{{- end -}}
|
||||
</ul>
|
||||
</li>
|
||||
{{- end -}}
|
||||
|
||||
<!-- Insert version switcher -->
|
||||
{{- if $enableVersions -}}
|
||||
{{- partial "partials/navbar-versions.html" (dict "page" $page "size" $size "collapsed" true ) -}}
|
||||
{{- partial "partials/navbar-versions.html" (dict "page" $page "size" $size "collapsed" false) -}}
|
||||
{{- end -}}
|
||||
|
||||
<!-- Insert color mode switcher -->
|
||||
{{- if $enableDarkMode -}}
|
||||
<!-- Insert divider -->
|
||||
<li class="nav-item py-2 py-md-1 col-12 col-md-auto d-none d-{{ $size }}-block">
|
||||
<div class="vr d-none d-md-flex h-100 mx-md-2"></div>
|
||||
</li>
|
||||
<li><hr class="dropdown-divider-bg"></li>
|
||||
|
||||
{{- partial "partials/navbar-mode.html" (dict "size" $size "collapsed" true) -}}
|
||||
{{- partial "partials/navbar-mode.html" (dict "size" $size "collapsed" false) -}}
|
||||
{{- end -}}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
</nav>
|
||||
</div>
|
||||
|
15
layouts/partials/assets/page-alert.html
Normal file
15
layouts/partials/assets/page-alert.html
Normal file
@@ -0,0 +1,15 @@
|
||||
{{- $page := .page -}}
|
||||
{{- if not $page -}}
|
||||
{{- errorf "partial [assets/page-alert.html] - Missing value for param 'page'" -}}
|
||||
{{- end -}}
|
||||
|
||||
{{- $pageAlertMsg := $page.Scratch.Get "pageAlertMsg" -}}
|
||||
{{- $pageAlertURL := $page.Scratch.Get "pageAlertURL" -}}
|
||||
{{- $version := $page.Scratch.Get "version" -}}
|
||||
|
||||
{{- if $pageAlertMsg -}}
|
||||
<div id="page-alert" class="alert alert-primary alert-no-decoration fade show d-flex align-items-center small m-0 py-1" data-page-alert-version="{{ $version }}">
|
||||
<a href="{{ with $pageAlertURL }}{{ . }}{{ else }}#!{{ end }}" class="text-decoration-none flex-grow-1 text-center">{{ $pageAlertMsg }}</a>
|
||||
<button id="page-alert-btn-close" type="button" class="btn-close" data-bs-dismiss="alert"></button>
|
||||
</div>
|
||||
{{- end -}}
|
7
layouts/partials/utilities/CheckVersion.html
Normal file
7
layouts/partials/utilities/CheckVersion.html
Normal file
@@ -0,0 +1,7 @@
|
||||
{{ with .version }}
|
||||
{{- $isOlder := partial "utilities/IsOlder" (dict "current" .) -}}
|
||||
{{- if $isOlder }}
|
||||
{{- $.Scratch.Set "pageAlertMsg" (printf "There is a newer version of %s!" site.Title) -}}
|
||||
{{- $.Scratch.Set "pageAlertURL" "https://getbootstrap.com/docs" -}}
|
||||
{{- end -}}
|
||||
{{- end -}}
|
32
layouts/partials/utilities/IsOlder.html
Normal file
32
layouts/partials/utilities/IsOlder.html
Normal file
@@ -0,0 +1,32 @@
|
||||
<!--
|
||||
Returns true if the current version is older than the latest version defined in the docs section of the site
|
||||
parameters. The verification supports semver patterns MAJOR.MINOR.PATCH with an optional suffix.
|
||||
|
||||
Original code by solus on https://discourse.gohugo.io/t/sorting-semantic-version-numbers/40838/6.
|
||||
-->
|
||||
|
||||
{{ $current := .current }}
|
||||
{{ $latest := site.Params.docs.latest }}
|
||||
|
||||
{{- define "partials/padZeroPrefix.html" -}}
|
||||
{{- $padSize := 6 }}
|
||||
{{- $paddedString := replaceRE "(\\d+)" (print (strings.Repeat (sub $padSize 1) "0") "$1") . }}
|
||||
{{- $trimmedString := replaceRE (print "0+(\\d{" $padSize "})") "$1" $paddedString }}
|
||||
{{- return $trimmedString }}
|
||||
{{- end -}}
|
||||
|
||||
{{- define "partials/trimZeroPrefix.html" -}}
|
||||
{{- return replaceRE "0+(\\d+)" "$1" . }}
|
||||
{{- end -}}
|
||||
|
||||
{{- $isOlder := false -}}
|
||||
|
||||
{{- if and $current $latest }}
|
||||
{{- $versions := slice $current $latest }}
|
||||
{{- $paddedVersions := apply $versions "partial" "padZeroPrefix" "." }}
|
||||
{{- $sortedVersions := (sort $paddedVersions "value" "desc") }}
|
||||
{{- $sortedVersions = apply $sortedVersions "partial" "trimZeroPrefix" "." }}
|
||||
{{ $isOlder = ne (index $sortedVersions 0) $current }}
|
||||
{{- end -}}
|
||||
|
||||
{{- return $isOlder -}}
|
4
package-lock.json
generated
4
package-lock.json
generated
@@ -1,12 +1,12 @@
|
||||
{
|
||||
"name": "@gethinode/hinode",
|
||||
"version": "0.15.0-beta3",
|
||||
"version": "0.15.0-beta4",
|
||||
"lockfileVersion": 2,
|
||||
"requires": true,
|
||||
"packages": {
|
||||
"": {
|
||||
"name": "@gethinode/hinode",
|
||||
"version": "0.15.0-beta3",
|
||||
"version": "0.15.0-beta4",
|
||||
"license": "MIT",
|
||||
"devDependencies": {
|
||||
"@fortawesome/fontawesome-free": "^6.4.0",
|
||||
|
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@gethinode/hinode",
|
||||
"version": "0.15.0-beta3",
|
||||
"version": "0.15.0-beta4",
|
||||
"description": "Hinode is a clean documentation and blog theme for Hugo, an open-source static site generator",
|
||||
"keywords": [
|
||||
"hugo",
|
||||
|
Reference in New Issue
Block a user