Many changes

.npm-scripts/build-pipeline.js

@@ -170,33 +170,30 @@ module.exports = {
               matchingTemplate.dir
             }/${matchingTemplate.name}`
           );
-          const isIndex = currentItem.tags.includes("index");
-          const dirPath = currentItem.dir.split("/");
-          const dir = dirPath
-            .slice(1, dirPath.length - (isIndex ? 1 : 0))
-            .join("/");
           const entries = state
             .selectByTag("content")
             .selectByTag("markdown")
-            .matchingAllTags(dirPath)
-            .not(state.selectByTag("index"));
+            .matchingAllTags(currentItem.dirPath)
+            .not(state.selectByTag("index"))
+            .selectMany(item => item.depth <= currentItem.depth);
           const sections = state
-            .matchingAllTags(dirPath)
+            .matchingAllTags(currentItem.dirPath)
             .selectByTag("index")
-            .not([currentItem]);
+            .not([currentItem])
+            .selectMany(item => item.depth <= currentItem.depth + 1);
+          const isIndex = currentItem.tags.includes("index");
           return {
             meta: {
               title: currentItem.niceName,
-              dir: dir,
-              dirPath: [...dirPath.slice(1), currentItem.name],
               name: currentItem.name,
               now: new Date().toLocaleString(),
-              context: dirPath[1],
+              context: currentItem.dirPath[1],
               isIndex: isIndex,
               svgs: toNameContentObject(state.selectByTag("svgs")),
               partials: toNameContentObject(state.selectByTag("partials")),
               entries: entries,
-              sections: sections
+              sections: sections,
+              outputPath: currentItem.dirPath.slice(1)
             },
             template: matchingTemplate
           };

.npm-scripts/decorators/articleDecorator.js

@@ -7,10 +7,8 @@ module.exports = function articleDecorator(config, item, meta) {
   if (introMatches) {
     blurb = introMatches.groups.introText.trim();
   }
-
   const titleStart = item.content.indexOf(">", item.content.indexOf("<h1")) + 1;
   const titleEnd = item.content.indexOf("</h1>");
-  console.log("tts", titleStart, titleEnd);
   const title =
     titleEnd > -1
       ? item.content.substring(titleStart, titleEnd).trim()

.npm-scripts/decorators/typeDecorator.js

@@ -22,7 +22,9 @@ module.exports = function typeDecorator(config, item, meta) {
     name: meta.name,
     niceName: getNiceName(name),
     dir: meta.dir,
-    type: meta.dir.split("/")[0],
+    dirPath: splitDir,
+    depth: splitDir.length,
+    type: splitDir[0],
     tags: existingTags.concat(meta.dir.split("/"), [meta.name])
   };
 };

.npm-scripts/funcs/compileTemplates.js

@@ -11,10 +11,7 @@ function compileTemplates(config, item) {
 }
 compileTemplates.withConfig = function(config) {
   if (config.helpers) {
-    console.log("Helpers:", config.helpers);
     config.helpers.map(helper => {
-      console.log("helper:", eval(helper.content.toString()));
-      const evalledhelper = require("../../" + helper.path);
       Handlebars.registerHelper(helper.name, eval(helper.content.toString()));
     });
   }

helpers/breadcrumb.js

@@ -1,4 +1,5 @@
 module.exports = function(context, options) {
+  const meta = options.data.root.meta;
   return `
     <ul class="breadcrumb">
     <a href="/" title="wiki"><li>
@@ -12,6 +13,13 @@ module.exports = function(context, options) {
           </li></a>`;
       })
       .join("\n")}
+      ${
+        meta.isIndex
+          ? ""
+          : `<a href="${meta.outputPath}" title="${meta.name}"><li>
+    ${meta.name}
+    </li></a>`
+      }
     </ul>
     `;
 };

pages/food/article.handlebars → pages/article.handlebars

@@ -1,5 +1,7 @@
 {{> header }}
+<main>
 <section>
   {{{ item.content }}}
 </section>
+</main>
 {{> footer }}

pages/food/index.handlebars

@@ -1,27 +0,0 @@
-{{> header }}
-<section>
-  <h1>{{meta.title}}</h1>
-</section>
-  {{#if meta.sections}}
-<section>
-  {{#each meta.sections}}
-  <article>
-    <h2>
-      <a href="{{outputPath}}">{{{ niceName }}} </a>
-    </h2>
-    <p>{{{ blurb }}}</p>
-  </article>
-{{/each}}
-</section>
-{{/if}}
-<section>
-{{#each meta.entries}}
-  <article>
-    <h2>
-      <a href="{{outputPath}}">{{{ niceName }}}</a>
-    </h2>
-    <p>{{{ blurb }}}</p>
-  </article>
-{{/each}}
-</section>
-{{> footer }}

pages/index.handlebars

@@ -1,17 +1,30 @@
 {{> header }}
+<main>
 <section>
   <h1>{{meta.title}}</h1>
 </section>
   {{#if meta.sections}}
-<section>
+<section class="filetree">
+  <ul>
   {{#each meta.sections}}
+  <li>
+    <a title="{{name}}" href="{{outputPath}}">{{{ niceName }}} </a>
+  </li>
+{{/each}}
+  </ul>
+</section>
+{{/if}}
+  {{#if meta.entries}}
+<section class="no-margin">
+{{#each meta.entries}}
   <article>
     <h2>
-      <a href="{{outputPath}}">{{{ niceName }}}</a>
+      <a title="{{name}}" href="{{outputPath}}">{{{ niceName }}}</a>
     </h2>
     <p>{{{ blurb }}}</p>
   </article>
 {{/each}}
 </section>
 {{/if}}
+</main>
 {{> footer }}

pages/lists/article.handlebars

@@ -1,5 +0,0 @@
-{{> header }}
-<section>
-  {{{ item.content }}}
-</section>
-{{> footer }}

pages/lists/index.handlebars

@@ -1,27 +0,0 @@
-{{> header }}
-<section>
-  <h1>{{meta.title}}</h1>
-</section>
-  {{#if meta.sections}}
-<section>
-  {{#each meta.sections}}
-  <article>
-    <h2>
-      <a href="{{outputPath}}">{{{ niceName }}} </a>
-    </h2>
-    <p>{{{ blurb }}}</p>
-  </article>
-{{/each}}
-</section>
-{{/if}}
-<section>
-{{#each meta.entries}}
-  <article>
-    <h2>
-      <a href="{{outputPath}}">{{{ niceName }}}</a>
-    </h2>
-    <p>{{{ blurb }}}</p>
-  </article>
-{{/each}}
-</section>
-{{> footer }}

pages/misc/article.handlebars

@@ -1,5 +0,0 @@
-{{> header }}
-<section>
-  {{{ item.content }}}
-</section>
-{{> footer }}

pages/misc/index.handlebars

@@ -1,27 +0,0 @@
-{{> header }}
-<section>
-  <h1>{{meta.title}}</h1>
-</section>
-  {{#if meta.sections}}
-<section>
-  {{#each meta.sections}}
-  <article>
-    <h2>
-      <a href="{{outputPath}}">{{{ niceName }}} </a>
-    </h2>
-    <p>{{{ blurb }}}</p>
-  </article>
-{{/each}}
-</section>
-{{/if}}
-<section>
-{{#each meta.entries}}
-  <article>
-    <h2>
-      <a href="{{outputPath}}">{{{ niceName }}}</a>
-    </h2>
-    <p>{{{ blurb }}}</p>
-  </article>
-{{/each}}
-</section>
-{{> footer }}

pages/projects/article.handlebars

@@ -1,5 +0,0 @@
-{{> header }}
-<section>
-  {{{ item.content }}}
-</section>
-{{> footer }}

pages/projects/index.handlebars

@@ -1,27 +0,0 @@
-{{> header }}
-<section>
-  <h1>{{meta.title}}</h1>
-</section>
-  {{#if meta.sections}}
-<section>
-  {{#each meta.sections}}
-  <article>
-    <h2>
-      <a href="{{outputPath}}">{{{ niceName }}} </a>
-    </h2>
-    <p>{{{ blurb }}}</p>
-  </article>
-{{/each}}
-</section>
-{{/if}}
-<section>
-{{#each meta.entries}}
-  <article>
-    <h2>
-      <a href="{{outputPath}}">{{{ niceName }}}</a>
-    </h2>
-    <p>{{{ blurb }}}</p>
-  </article>
-{{/each}}
-</section>
-{{> footer }}

pages/technical/article.handlebars

@@ -1,5 +0,0 @@
-{{> header }}
-<section>
-  {{{ item.content }}}
-</section>
-{{> footer }}

pages/technical/index.handlebars

@@ -1,27 +0,0 @@
-{{> header }}
-<section>
-  <h1>{{meta.title}}</h1>
-</section>
-  {{#if meta.sections}}
-<section>
-  {{#each meta.sections}}
-  <article>
-    <h2>
-      <a href="{{outputPath}}">{{{ niceName }}} </a>
-    </h2>
-    <p>{{{ blurb }}}</p>
-  </article>
-{{/each}}
-</section>
-{{/if}}
-<section>
-{{#each meta.entries}}
-  <article>
-    <h2>
-      <a href="{{outputPath}}">{{{ niceName }}}</a>
-    </h2>
-    <p>{{{ blurb }}}</p>
-  </article>
-{{/each}}
-</section>
-{{> footer }}

partials/header.handlebars

@@ -29,6 +29,6 @@
       </button>
     </div>
 
-    {{#breadcrumb meta.dirPath}}
+    {{#breadcrumb meta.outputPath}}
     {{/breadcrumb}}
 </header>

styles/styles.css

@@ -62,14 +62,18 @@ body {
   font-weight: 300;
 }
 
-section {
-  max-width: 42vw;
-  margin: 0 auto 3em auto;
+main {
+  max-width: 50vw;
+  margin: 3em auto;
   overflow: hidden;
   clear: both;
   display: block;
 }
 
+section {
+  margin: 1rem;
+}
+
 code {
   font-size: 1em;
   padding: 0 0.2em;
@@ -79,20 +83,25 @@ code {
 }
 
 article {
-  margin: 1em;
-  display: inline-block;
+  display: flex;
+  flex-flow: row;
+  flex-wrap: wrap;
+  align-items: stretch;
+  justify-content: stretch;
   background-color: var(--color-background-alternative);
   padding: 1em;
-  max-width: 340px;
+  margin: 1rem;
 }
 
 article h2 {
   font-family: "NotoSerif", serif;
-  margin-top: 0;
+  margin: 0;
+  flex: 1;
 }
 
 article p {
-  margin-bottom: 0;
+  flex: 1;
+  margin: 0;
   font-size: 0.8em;
 }
 
@@ -115,7 +124,6 @@ h1 {
   font-size: 2.4em;
   letter-spacing: 0.05em;
   line-height: 1.6em;
-  margin: 0 0 1.2em 0;
 }
 
 h2 {
@@ -163,12 +171,12 @@ footer {
   color: var(--color-text-default);
   display: flex;
   margin: 3em auto 3.5em auto;
-  align-items: stretch;
-  justify-content: stretch;
   max-width: 82vw;
   display: flex;
   flex-flow: row;
   flex-wrap: wrap;
+  align-items: stretch;
+  justify-content: stretch;
 }
 
 footer p {
@@ -209,7 +217,7 @@ header {
 .breadcrumb {
   font-size: 0;
   font-family: "Hack", monospace;
-  flex: 4;
+  flex: 8;
   list-style-type: none;
   display: flex;
   flex-direction: row;
@@ -340,6 +348,10 @@ header {
 
 /* To display uls as a file tree-like list */
 
+.filetree {
+  margin-bottom: 3em;
+}
+
 .filetree,
 .filetree ul,
 .filetree li {
@@ -410,6 +422,10 @@ header {
   flex: 1;
 }
 
+.no-margin {
+  margin: 0;
+}
+
 /* Smaller screen tweaks */
 @media screen and (max-width: 940px) {
   body {
@@ -419,26 +435,32 @@ header {
   .switches button {
     font-size: 22px;
   }
-  section {
+
+  main {
     max-width: 90vw;
+    margin: 2em auto;
+  }
+
+  article {
+    flex-flow: column;
+  }
+
+  article p {
+    margin-top: 1em;
   }
+
   header {
     max-width: 90vw;
     margin-bottom: 2em;
     flex-flow: column;
   }
-  footer {
-    padding: 0;
-  }
 
   footer {
     flex-flow: column;
-    margin: 0;
+    max-width: 90vw;
   }
   footer p {
-    padding: 1em;
     border-bottom: none;
-    margin: 0 1em;
   }
 }