Merge pull request #450 from lvuch/index-layout

index for sub pages

content/rancher/v2.x/en/backups/backups/single-node-backups/_index.md

@@ -34,4 +34,4 @@ docker create --volumes-from <RANCHER_CONTAINER_ID> \
 docker start <RANCHER_CONTAINER_ID>
     ```
 
-**Result:** A backup of your Rancher Server is created. If you ever need to restore your backup, see [Restoring Backups: Single Node Installs]({{< baseurl >}}/rancher/v2.x/en/upgrades/restorations/single-node-restoration).
+**Result:** A backup of your Rancher Server is created. If you ever need to restore your backup, see [Restoring Backups: Single Node Installs]({{< baseurl >}}/rancher/v2.x/en/upgrades/restorations/single-node-restoration).

layouts/_default/list.html

@@ -18,68 +18,20 @@
 
       {{ with .Params.Title }}
         <h1 class="m-t-0">{{ . }}</h1>
-        <hr/>
       {{end}}
-
+      {{ with .Params.Description }}
+        <p>{{ . }}</p>
+      {{end}}
+      <hr/>
       <div class="main-content">
-        <!-- this is a test -->
-        <!-- {{ partial "page-nav.html" . }} -->
-        <!-- end test -->
+          {{ .Content }}
+      </div>
 
-        {{ .Content }}
+      <!-- index of sub pages -->
+      {{ partial "page-nav.html" . }}
+      <!-- end index of sub pages -->
 
-        {{ range (.Paginator 5).Pages }}
-          <div class="box m-b-md">
-              <div class="p-a-sm">
-                <h3><a href="{{.URL}}">{{.Title}}</a></h3>
-
-                {{ if .Params.Image }}
-                  <div class="thumbnail"><img src="{{ .Params.Image }}" alt="{{ .Params.Title }}"></div>
-                {{end}}
-
-                <p>{{ .Summary | safeHTML }}</p>
-                {{ if .Truncated }}
-                <div>
-                  <a href="{{ .RelPermalink }}">Read More…</a>
-                </div>
-                {{ end }}
-              </div>
-              <div class="bg-default">
-                <div class="row">
-
-                  {{ with .Params.Author }}
-                    <div class="p-h-sm p-v-xs"><i class="material-icons">person_outline</i> By: {{ . }}</div>
-                  {{end}}
-
-                  {{ if eq .Section "events" }}
-                    {{ with .Params.EventDate }}
-                      <div class="p-h-sm p-v-xs"><i class="material-icons">event</i> {{ . }}</div>
-                    {{end}}
-
-                  {{ else }}
-
-                    {{ with .Params.Date }}
-                      <div class="p-h-sm p-v-xs"><i class="material-icons">event</i> {{ .Format "January 2, 2006" }}</div>
-                    {{end}}
-                  {{end}}
-
-                  {{ if eq .Section "blog" }}
-                    <div class="p-h-sm p-v-xs"><i class="material-icons">timer</i> Read Time: {{.ReadingTime}} minutes</div>
-                  {{end}}
-
-                  {{ with .Params.Location }}
-                    <div class="p-h-sm p-v-xs"><i class="material-icons">location_on</i> {{ . }}</div>
-                    {{end}}
-
-                </div>
-              </div>
-          </div>
-          {{ end }}
-        </div>
-        {{ template "_internal/pagination.html" . }}
-
-
-        <div class="p-v-xs">{{ partial "page-edit.html" . }}</div>
+      <div class="p-v-xs">{{ partial "page-edit.html" . }}</div>
 
       </article>
       <!-- {{ with .TableOfContents }}

layouts/partials/docs-side-nav.html

@@ -46,6 +46,7 @@
     </ul>
   </li>
 </ul>
+<!-- end product dropdown -->
 
 <div class="tree-nav invisible">
   <ul>

layouts/partials/page-nav.html

@@ -1,19 +1,23 @@
 <div class="page-nav">
-  <ul>
+  <ol>
     {{ template "page-nav" . }}
-  </ul>
+  </ol>
 </div>
 {{ define "page-nav" }}
   {{ range .Sections}}
-    <li class=""><a href="{{ .RelPermalink}}">{{ .Title }}</a>
+    <li class="">
+      <a href="{{ .RelPermalink}}">{{ .Title }}</a>
+      {{ with .Params.Description }}
+        <p>{{ . }}</p>
+      {{end}}
       {{if gt (len .Sections) 0}}
         <!-- <i class="material-icons expand-toggle">add_box</i> -->
-        <ul class="hide">
+        <ol>
           {{ range .Pages }}
             <li class=""><a href="{{ .RelPermalink}}">{{ .Title }}</a></li>
           {{ end }}
           {{ template "page-nav" . }}
-        </ul>
+        </ol>
       {{end}}
     </li>
   {{ end }}

src/sass/app.scss

@@ -125,3 +125,39 @@
     transform: rotateX(180deg);
   }
 }
+
+.page-nav {
+  > ol {
+    column-count: 4;
+    column-gap: $spacer-xs;
+  }
+  ol {
+    padding: 0;
+    list-style: none;
+    counter-reset: item;
+    font-size: 1rem;
+  }
+  ol li {
+      display: block;
+      padding-left: $spacer-xs;
+  }
+  ol li:before {
+      display: inline-block;
+      margin-left: -$spacer-xs;
+      margin-right: .5em;
+      text-align: center;
+      content: counters(item, ".") ".";
+      counter-increment: item;
+  }
+  ol ol {
+      width: auto;
+      margin: 0;
+      padding: .5em 0;
+  }
+  ol li li:before {
+      content: counters(item, ".") " ";
+  }
+  ol ol ol {
+      padding: .5em 0 0;
+  }
+}