Browse Source

Add TOC in sidebar

Getty Ritter 2 years ago
parent
commit
54b9fe2818
3 changed files with 46 additions and 41 deletions
  1. 1 1
      Makefile
  2. 22 22
      txt/dogs.md
  3. 23 18
      txt/template.mustache

+ 1 - 1
Makefile

@@ -1,6 +1,6 @@
 build/guenashk.html: txt/dogs.md build/template.html
 	mkdir -p build
-	pandoc --template=build/template <txt/dogs.md >build/guenashk.html
+	pandoc --toc --template=build/template <txt/dogs.md >build/guenashk.html
 
 build/icon-%.svg: diagrams/icon-%.svg
 	inkscape --export-plain-svg=$@ $<

File diff suppressed because it is too large
+ 22 - 22
txt/dogs.md


+ 23 - 18
txt/template.mustache

@@ -23,11 +23,27 @@
      .main {
        width: 80%;
        text-align: justify;
-       margin-left: auto;
-       margin-right: auto;
+       margin-left: 340px;
        font-size: 18px;
        line-height: 150%;
      }
+
+     .sidebar {
+       width: 300px;
+       position: fixed;
+       z-index: 1;
+       top: 0;
+       left: 0;
+       padding-top: 20px;
+       padding-left: 20px;
+       padding-right: 20px;
+       overflow-x: hidden;
+     }
+
+     .sidebar ul {
+       margin-top: 5px;
+     }
+
      h1 {
        font-family: raleway;
        font-weight: normal;
@@ -56,43 +72,32 @@
      }
      p { margin-left: 20pt; margin-right: 20pt; }
      a { text-decoration: none; color: #822; }
-     a[href="#backgrounds"]::after {
-       content: "Background";
-     }
 
      a[href="#traits"]::before {
        content: url(data:image/svg+xml;base64,{{trait-icon}});
      }
-     a[href="#traits"]::after {
-       content: "Trait";
-     }
 
      a[href="#relationships"]::before {
        content: url(data:image/svg+xml;base64,{{relationship-icon}});
      }
-     a[href="#relationships"]::after {
-       content: "Relationship";
-     }
 
      a[href="#objects"]::before {
        content: url(data:image/svg+xml;base64,{{object-icon}});
      }
-     a[href="#objects"]::after {
-       content: "Object";
-     }
 
      a[href="#stats"]::before {
        content: url(data:image/svg+xml;base64,{{stat-icon}});
      }
-     a[href="#stats"]::after {
-       content: "Stat";
-     }
     </style>
   </head>
   <body>
     <div class="main" >
+      <div class="sidebar">
+        <a href="#">The Emissaries of Guenašk</a>
+        $toc$
+      </div>
       <div class="header">
-        <h1 id="if-the-sky-were-crooked">$if(title)$ $title$ $endif$</h1>
+        <h1 id="title">$if(title)$ $title$ $endif$</h1>
       </div>
       $body$
         <div class="footer">