more tree fun and top level nav

content/os/_index.md

@@ -1,5 +1,6 @@
 ---
 title: RancherOS Documentation
+shortTitle: RancherOS
 description: RancherOS is a simplified Linux distribution built from containers, for containers. These documents describe how to install and use RancherOS.
 weight: 1
 ---

content/rancher/_index.md

@@ -1,5 +1,6 @@
 ---
   title: Rancher 2.0 Documentation
+  shortTitle: Rancher 2.0
   weight: 1
 ---
 

layouts/_default/list.html

@@ -17,15 +17,11 @@
 
 {{ define "main" }}
   <div class="wrapper">
-    {{ partial "breadcrumbs.html" . }}
-
     {{ partial "docs-nav.html" . }}
 
     <div class="row m-t-sm">
-      <aside class="col-sm-4 col-xs-12">
-       <div class="bg-default p-a-sm">
+      <aside class="col-sm-3 col-xs-12">
         {{ partial "docs-side-nav.html" . }}
-       </div>
       </aside>
       <article class="col-sm-8 col-xs-12 p-l-lg">
         <div class="main-content ">
@@ -82,5 +78,6 @@
         {{ template "_internal/pagination.html" . }}
       </article>
     </div>
+    {{ partial "breadcrumbs.html" . }}
   </div>
 {{ end }}

layouts/_default/single.html

@@ -17,16 +17,13 @@
 
 {{ define "main" }}
   <div class="wrapper">
-    {{ partial "breadcrumbs.html" . }}
     {{ partial "docs-nav.html" . }}
 
     <div class="row m-t-sm">
-      <aside class="col-sm-4 col-xs-12">
-       <div class="bg-default p-a-sm">
+      <aside class="col-sm-3 col-xs-12">
         {{ partial "docs-side-nav.html" . }}
-       </div>
       </aside>
-      <article class="col-sm-8 col-xs-12 p-l-lg">
+      <article class="col-sm-8 col-xs-12 p-h-lg">
         <div class="main-content ">
 
       {{ .Content }}
@@ -81,5 +78,6 @@
         {{ template "_internal/pagination.html" . }}
       </article>
     </div>
+    {{ partial "breadcrumbs.html" . }}
   </div>
 {{ end }}

layouts/partials/docs-nav.html

@@ -4,7 +4,7 @@
 <nav>
   <!-- tabs -->
   <ul class="tabs row middle-xs">
-    <div class="pull-left m-v-sm">
+    <div class="pull-left p-v-xs">
       <ul class="dropdown sub-menu unstyled">
         <li>
           <a href="{{ .URL }}" class="btn bg-link p-a-0">
@@ -13,7 +13,7 @@
               {{if $.CurrentSection}}
                 {{ if .IsAncestor $.CurrentSection }}
                   {{ $.Scratch.Set "topLevel" . }}
-                  {{ .Title }}
+                  {{ .Params.shortTitle }}
                 {{end}}
               {{end}}
             {{end}}
@@ -23,8 +23,9 @@
 
           <ul class="sub dropdown-menu bg-white unstyled">
           {{ range .Site.Sections }}
-            <li><a href="{{ .Permalink }}">{{ .Title }}</a></li>
+            <li><a href="{{ .Permalink }}">{{ .Params.shortTitle }}</a></li>
           {{ end }}
+          <li><a href="https://rancher.com/docs/rancher/v1.6/en/" target="blank">Rancher 1.6</a></li>
           </ul>
         </li>
       </ul>

layouts/partials/docs-side-nav.html

@@ -1,5 +1,3 @@
-<h3>{{ .Title }}</h3>
-
 <div class="tree-nav">
   <ul>
     {{ template "section-tree-nav" ($.Scratch.Get "secondLevel") }}
@@ -7,12 +5,12 @@
 </div>
 {{ define "section-tree-nav" }}
   {{ range .Sections}}
-    <li class="tree-nav-item bg-white"><a href="{{ .RelPermalink}}">{{ .Title }}</a>
+    <li class="tree-nav-item"><a href="{{ .RelPermalink}}">{{ .Title }}</a>
       {{if gt (len .Sections) 0}}
-        <i class="material-icons pull-right expand-more">expand_more</i>
+        <i class="material-icons pull-right expand-more">add_box</i>
         <ul class="tree-nav-sublist hide">
           {{ range .Pages }}
-          <li class="tree-nav-item-child bg-white"><a href="{{ .RelPermalink}}">{{ .Title }}</a></li>
+          <li class="tree-nav-item-child"><a href="{{ .RelPermalink}}">{{ .Title }}</a></li>
           {{ end }}
           <ul>
             {{ template "section-tree-nav" . }}

src/sass/app.scss

@@ -44,6 +44,7 @@
 '../../node_modules/rancher-website-theme/static/scss/components/button',
 '../../node_modules/rancher-website-theme/static/scss/components/dropdown',
 '../../node_modules/rancher-website-theme/static/scss/components/forms',
+'../../node_modules/rancher-website-theme/static/scss/components/tree',
 '../../node_modules/rancher-website-theme/static/scss/components/tabs';
 
 // 6. Page-specific styles
@@ -58,22 +59,3 @@
   visibility: hidden;
   display: none;
 }
-
-.tree-nav {
-  .tree-nav-item {
-    .tree-nav-sublist {
-      &.hide {
-        display: none;
-      }
-    }
-    &.open {
-      >.expand-more {
-        -webkit-transform: rotate(180deg);
-        -moz-transform: rotate(180deg);
-        -ms-transform: rotate(180deg);
-        -o-transform: rotate(180deg);
-        transform: rotate(180deg);
-      }
-    }
-  }
-}