More sidebar aesthetic adjustments

Signed-off-by: lucperkins <lucperkins@gmail.com>

assets/sass/style.sass

@@ -168,7 +168,7 @@ $colors: mergeColorMaps(("secondary": ($secondary, $white)), $colors)
 
 .is-sticky
   +sticky
-  top: $navbar-height + 2rem
+  top: $navbar-height + 3rem
 
 .is-constrained
   max-width: 90ch
@@ -179,11 +179,15 @@ $colors: mergeColorMaps(("secondary": ($secondary, $white)), $colors)
 
 .nav
   &-section
-    .title
+    &-title
+      color: $dark
+
       &.is-active
         +active
 
     ul.nav-section-links
+      margin: 0 0 2rem 1.25rem
+
       li.nav-section-link
         font-size: 1.1rem
 

config.toml

@@ -77,6 +77,7 @@ weight = 1
 
 [[menu.main]]
 name = "Docs"
+url = "/docs"
 identifier = "docs"
 weight = 2
 

layouts/docs/list.html

@@ -3,6 +3,5 @@
 {{ end }}
 
 {{ define "main" }}
-{{ partial "hero.html" . }}
 {{ partial "article.html" . }}
 {{ end }}

layouts/docs/single.html

@@ -3,6 +3,5 @@
 {{ end }}
 
 {{ define "main" }}
-{{ partial "hero.html" . }}
 {{ partial "article.html" . }}
 {{ end }}

layouts/partials/article.html

@@ -1,3 +1,5 @@
+{{ $title := .Title }}
+{{ $desc  := .Params.desc }}
 <section class="section">
   <div class="container">
     <div class="columns is-variable is-8">
@@ -6,8 +8,29 @@
       </div>
 
       <div class="column">
+        <section class="hero">
+          <div class="hero-body">
+            <div class="container">
+              <p class="title is-size-2 is-size-3-mobile has-text-weight-bold{{ if $desc }} is-spaced{{ end }}">
+                {{ .Title }}
+              </p>
+
+              {{ with $desc }}
+              <p class="subtitle is-size-4 is-size-5-mobile has-text-weight-medium">
+                {{ . }}
+              </p>
+              {{ end }}
+            </div>
+          </div>
+        </section>
+
+
+        <section class="section">
+          <div class="container">
             {{ partial "content.html" (dict "content" .Content "constrained" true) }}
           </div>
+        </section>
+      </div>
     </div>
   </div>
 </section>

layouts/partials/nav.html

@@ -2,7 +2,7 @@
 {{ $docsSections   := (index (where site.Sections "Section" "docs") 0).Sections }}
 {{ $currentSection := .CurrentSection }}
 
-<div class="nav is-sticky is-hidden-mobile" >
+<div class="nav is-sticky is-hidden-touch">
   {{ range $docsSections }}
   {{ $thisSection := eq .CurrentSection $currentSection }}
   <div class="nav-section" x-data="{ open: {{ $thisSection }} }">
@@ -10,7 +10,7 @@
     {{ $title := .Title | upper }}
     <nav class="level">
       <div class="level-left">
-        <a class="title is-size-5 is-size-6-mobile has-text-weight-medium{{ if $isHere }} is-active{{ end }}" href="{{ .RelPermalink }}">
+        <a class="nav-section-title is-size-5 is-size-6-mobile{{ if $isHere }} is-active{{ end }}" href="{{ .RelPermalink }}">
           {{ $title }}
         </a>
       </div>