aside: Theme aside.

axelerant · Nov 14, 2022 · fe95f3a · fe95f3a
1 parent 4bfba31
commit fe95f3a
Show file tree

Hide file tree

Showing 3 changed files with 106 additions and 2 deletions.
diff --git a/assets/_custom.scss b/assets/_custom.scss
@@ -229,11 +229,11 @@ body {
         .menu-item {
             @media (max-width: $mobile-breakpoint) {
                 display: none;
-            } 
+            }
         }
 
         &.active {
-            .menu-item{
+            .menu-item {
                 display: block;
             }
         }
@@ -356,3 +356,55 @@ body {
         }
     }
 }
+
+
+// Aside theming
+.book-menu {
+    .book-menu-content {
+        position: static;
+        border-left: 1px solid rgba(66, 66, 66, 0.3);
+        padding: 55px 31px 29px 29px;
+        min-width: 360px;
+        overflow-y: scroll;
+        height: 792px;
+
+        &::-webkit-scrollbar {
+            width: 20px;
+            background-color: $white-smoke;
+            height: 100px;
+        }
+
+        &::-webkit-scrollbar-thumb {
+            background: $silver; 
+        }
+    }
+
+    .book-brand {
+        font-size: 22px;
+        font-weight: 500;
+        line-height: 27px;
+        // padding-left: 29px;
+    }
+
+    a {
+        font-size: 20px;
+        line-height: 30px;
+        color: $dark-gray;
+        margin-bottom: 32px;
+
+        &.active {
+            color: $orange;
+            font-size: 22px;
+            line-height: 27px;
+            font-weight: 700;
+            border-left: 5px solid $orange;
+            margin-left: -30px;
+            padding-left: 29px;
+        }
+    }
+
+    li {
+        margin: 0;
+    }
+
+}
diff --git a/assets/_variables.scss b/assets/_variables.scss
@@ -2,3 +2,6 @@ $black: #000000;
 $white: #ffffff;
 $gray: #343434;
 $orange: #fc4c02;
+$dark-gray: #424242;
+$white-smoke:#F1F1F1;
+$silver: #C1C1C1;
diff --git a/layouts/partials/docs/menu-filetree.html b/layouts/partials/docs/menu-filetree.html
@@ -0,0 +1,49 @@
+{{ $bookSection := default "docs" .Site.Params.BookSection  }}
+{{ if eq $bookSection "*" }}
+  {{ $bookSection = "/" }}{{/* Backward compatibility */}}
+{{ end }}
+
+{{ with .Site.GetPage $bookSection }}
+  {{ template "book-section-children" (dict "Section" . "CurrentPage" $) }}
+{{ end }}
+
+{{ define "book-section-children" }}{{/* (dict "Section" .Section "CurrentPage" .CurrentPage) */}}
+  <ul>
+    {{ range (where .Section.Pages "Params.bookhidden" "ne" true) }}
+      {{ if .IsSection }}
+        <li {{- if .Params.BookFlatSection }} class="book-section-flat" {{ end -}}>
+          {{ template "book-page-link" (dict "Page" . "CurrentPage" $.CurrentPage) }}
+          {{ template "book-section-children" (dict "Section" . "CurrentPage" $.CurrentPage) }}
+        </li>
+      {{ else if and .IsPage .Content }}
+        <li>
+          {{ template "book-page-link" (dict "Page" . "CurrentPage" $.CurrentPage) }}
+        </li>
+      {{ end }}
+    {{ end }}
+  </ul>
+{{ end }}
+
+{{ define "book-page-link" }}{{/* (dict "Page" .Page "CurrentPage" .CurrentPage) */}}
+  {{ $current := eq .CurrentPage .Page }}
+  {{ $ancestor := .Page.IsAncestor .CurrentPage }}
+
+  {{ if .Page.Params.BookCollapseSection }}
+    <input type="checkbox" id="section-{{ md5 .Page }}" class="toggle" {{ if or $current $ancestor }}checked{{ end }} />
+    <label for="section-{{ md5 .Page }}" class="flex justify-between">
+      <a {{ if .Page.Content }}href="{{ .Page.RelPermalink }}"{{ else }}role="button"{{ end }} class="{{ if or $current $ancestor }}active{{ end }}">
+        {{- partial "docs/title" .Page -}}
+      </a>
+    </label>
+  {{ else if .Page.Params.BookHref }}
+    <a href="{{ .Page.Params.BookHref }}" class="{{ if $current }}active{{ end }}" target="_blank" rel="noopener">
+      {{- partial "docs/title" .Page -}}
+    </a>
+  {{ else if .Page.Content }}
+    <a href="{{ .Page.RelPermalink }}" class="{{ if $current }}active{{ end }}">
+      {{- partial "docs/title" .Page -}}
+    </a>
+  {{ else }}
+    <span>{{- partial "docs/title" .Page -}}</span>
+  {{ end }}
+{{ end }}