Merge pull request #176 from iArchitSharma/nextPage

New feature: A next/previous button for the docs section
layer5io · Mar 6, 2024 · f44d47e · f44d47e
2 parents 628ee30 + 1f12b45
commit f44d47e
Show file tree

Hide file tree

Showing 8 changed files with 124 additions and 6 deletions.
diff --git a/assets/scss/_elements_project.scss b/assets/scss/_elements_project.scss
@@ -88,4 +88,65 @@ div.tip {
     height: 22%;
     float: right;
     border-radius: 50%;
-  }
+  }
+
+    .prevBtn {
+      $btn-color: $primary;
+      $btn-color-dark: shade($btn-color, 40%);
+      color: tint($btn-color);
+
+      &:before {
+        content: '';
+        // @include absolute(0,0,0,0);
+        background-color: $btn-color-dark;
+        transform: translateX(-100%);
+      }
+
+      &:hover {
+        color: tint($btn-color, 75%);
+
+        &:before {
+          transform: translateX(0);
+        }
+      }
+    }
+
+.pagination-nav {
+      grid-gap: 1rem;
+      display: grid;
+      gap: 1rem;
+      grid-template-columns: repeat(2, 1fr);
+  }
+
+
+.pagination-nav__link {
+  border: 1px solid $lightslategray;
+  border-radius: 0.4rem;
+  display: block;
+  height: 100%;
+  line-height: 1.25;
+  padding: 1rem;
+  transition: border-color 200ms cubic-bezier(0.08,0.52,0.52,1);
+}
+
+.pagination-nav__link:hover {
+  border-color: $primary;
+}
+
+.pagination-nav__link--next {
+  grid-column: 2 / 3;
+  text-align: right;
+}
+
+.pagination-nav__sublabel{
+  color:$light;
+  font-size:0.875rem;
+  font-weight:500;
+  margin-bottom: 0.25rem;
+}
+
+.pagination-nav__label {
+  font-size: 1rem;
+  font-weight: 600;
+  word-break: break-word;
+}
diff --git a/content/en/cloud/overview/_index.md b/content/en/cloud/overview/_index.md
@@ -1,11 +1,12 @@
-<!-- ---
+---
 title: Overview
 description: Here's where your user finds out if your project is for them.
 weight: 2
 categories: [Examples, Placeholders]
 tags: [test, docs]
+draft: true
 ---
-
+<!-- 
 {{% pageinfo %}}
 Page under construction.
 {{% /pageinfo %}}

diff --git a/content/en/meshmap/tutorials/_index.md b/content/en/meshmap/tutorials/_index.md
@@ -1,10 +1,11 @@
-<!-- ---
+---
 title: Tutorials
 description: Show your user how to work through some end to end examples.
 date: 2023-10-30
 weight: 8
+draft: true
 ---
-
+<!-- 
 {{% pageinfo %}}
 Page under construction.
 {{% /pageinfo %}}

diff --git a/content/en/meshmap/tutorials/collaborative-editing.md b/content/en/meshmap/tutorials/collaborative-editing.md
@@ -4,6 +4,7 @@ description: >
   Learn about Collaborative Editing
 weight: 5
 categories: [Designer]
+draft: true
 ---
 
 {{% pageinfo %}}

diff --git a/content/en/meshmap/tutorials/publishing-to-catalog.md b/content/en/meshmap/tutorials/publishing-to-catalog.md
@@ -3,6 +3,7 @@ title: Publishing to Catalog
 description: >
   Learn to Publish to Catalog
 weight: 4
+draft: true
 ---
 
 {{% pageinfo %}}

diff --git a/layouts/docs/baseof.html b/layouts/docs/baseof.html
@@ -25,7 +25,7 @@
           <main class="col-12 col-md-9 col-xl-8 ps-md-5" role="main">
             {{ partial "version-banner.html" . }} {{ if not
             .Site.Params.ui.breadcrumb_disable }}{{ partial "breadcrumb.html" .
-            }}{{ end }} {{ block "main" . }}{{ end }}
+            }}{{ end }} {{ block "main" . }}{{ end }} {{ partial "pager.html" . }}
           </main>
         </div>
       </div>

diff --git a/layouts/docs/single.html b/layouts/docs/single.html
@@ -0,0 +1,3 @@
+{{ define "main" }}
+{{ .Render "content" }}
+{{ end }}
diff --git a/layouts/partials/pager.html b/layouts/partials/pager.html
@@ -0,0 +1,50 @@
+
+    {{ $currentNode := . }}
+
+    {{ template "menu-nextprev" dict "menu" .Site.Home "currentnode" $currentNode }}
+
+    {{ define "menu-nextprev" }}
+        {{$currentNode := .currentnode }}
+        {{ if ne .menu.Params.hidden true}}
+            {{if hasPrefix $currentNode.RelPermalink .menu.RelPermalink }}
+                {{ $currentNode.Scratch.Set "NextPageOK" "OK" }}
+                {{ $currentNode.Scratch.Set "prevPage" ($currentNode.Scratch.Get "prevPageTmp") }}
+            {{else}}
+                {{if eq ($currentNode.Scratch.Get "NextPageOK") "OK"}}
+                    {{ $currentNode.Scratch.Set "NextPageOK" nil }}
+                    {{ $currentNode.Scratch.Set "nextPage" .menu }}
+                {{end}}
+            {{end}}
+            {{ $currentNode.Scratch.Set "prevPageTmp" .menu }}
+
+                {{ $currentNode.Scratch.Set "pages" .menu.Pages }}
+                {{ if .menu.IsHome}}
+                    {{ $currentNode.Scratch.Set "pages" .menu.Sections }}
+                {{ else if .menu.Sections}}
+                    {{ $currentNode.Scratch.Set "pages" (.menu.Pages | union .menu.Sections) }}
+                {{end}}
+                {{ $pages := ($currentNode.Scratch.Get "pages") }}
+
+                {{ range $pages.ByWeight  }}
+                    {{ template "menu-nextprev" dict "menu" . "currentnode" $currentNode }}
+                {{end}}
+        {{ end }}
+    {{ end }}
+
+<nav class="pagination-nav mt-5" aria-label="Docs pages">
+    {{$showPrevNext := (and (not .Params.disableNextPrev) (not .Site.Params.disableNextPrev))}}
+    {{if $showPrevNext}}
+    {{with ($.Scratch.Get "prevPage")}}
+    <a class="pagination-nav__link pagination-nav__link--prev" href="{{.RelPermalink}}">
+        <div class="pagination-nav__sublabel">Previous</div>
+        <div class="pagination-nav__label"><i class="fa fa-chevron-left"></i> {{.Title}}</div>
+    </a>
+    {{end}}
+    {{with ($.Scratch.Get "nextPage")}}
+    <a class="pagination-nav__link pagination-nav__link--next" href="{{.RelPermalink}}">
+        <div class="pagination-nav__sublabel">Next</div>
+        <div class="pagination-nav__label">{{.Title}} <i class="fa fa-chevron-right"></i></div>
+    </a>
+    {{end}}
+    {{end}}
+</nav>