clean up

.eleventy.js

@@ -3,7 +3,6 @@ const ErrorOverlay = require('eleventy-plugin-error-overlay');
 const markdownIt = require('markdown-it');
 const markdownItAnchor = require('markdown-it-anchor');
 const pluginTOC = require('eleventy-plugin-nesting-toc');
-const docGridShortcode = require('./src/shortcodes/doc-grid');
 const excerpt = require('./src/shortcodes/excerpt');
 
 const markdownOptions = {
@@ -19,7 +18,6 @@ module.exports = function(config) {
   config.addPlugin(ErrorOverlay);
 
   config.addShortcode('excerpt', excerpt);
-  config.addShortcode('docs', docGridShortcode);
   config.addFilter('log', thing => console.log(thing));
 
   config.addPassthroughCopy({

.gitignore

@@ -64,5 +64,7 @@ yarn-error.log
 # Yarn Integrity file
 .yarn-integrity
 
-_site
-dist
+dist
+
+# Hide compiled CSS
+src/includes/css/*

docs/docs.11tydata.js

@@ -1,4 +1,4 @@
 module.exports = {
-  layout: 'doc',
+  layout: 'post',
   permalink: '{{page.fileSlug}}/index.html'
 };

package.json

@@ -15,15 +15,16 @@
   "devDependencies": {
     "@11ty/eleventy": "^0.11.0",
     "@11ty/eleventy-plugin-syntaxhighlight": "^3.0.1",
-    "autoprefixer": "^9.7.6",
+    "autoprefixer": "^9.8.4",
     "concurrently": "^5.2.0",
     "cssnano": "^4.1.10",
     "eleventy-plugin-error-overlay": "^0.1.2",
     "eleventy-plugin-nesting-toc": "^1.2.0",
-    "markdown-it-anchor": "^5.2.7",
-    "postcss": "^7.0.30",
+    "markdown-it-anchor": "^5.3.0",
+    "postcss": "^7.0.32",
     "postcss-cli": "^7.1.1",
     "postcss-import": "^12.0.1",
+    "postcss-nested": "^4.2.1",
     "prettier": "^2.0.5",
     "resetti": "^1.1.3"
   },
@@ -34,8 +35,6 @@
   "bugs": {
     "url": "https://github.com/chasemccoy/designsystems.dev/issues"
   },
-  "dependencies": {
-    "postcss-nested": "^4.2.1"
-  },
+  "dependencies": {},
   "keywords": []
-}
+}

src/data/layout.js

@@ -1 +1 @@
-module.exports = 'base-layout';
+module.exports = 'base';

src/index.11ty.js

@@ -3,5 +3,10 @@ exports.data = {
 };
 
 exports.render = function(data) {
-  return `${this.docs(data.collections.docs)}`;
+  return data.collections.docs.map(doc => `
+    <article>
+      <h2><a href="/${doc.fileSlug}">${doc.data.title}</a></h2>
+      ${doc.templateContent}
+    </article>
+  `, this).join('')
 };

src/layouts/page.njk

@@ -0,0 +1,5 @@
+---
+layout: base
+---
+
+{{ content | safe }}

src/layouts/doc.njk → src/layouts/post.njk

@@ -1,11 +1,9 @@
 ---
-layout: base-layout
+layout: page
 ---
 
 <article>
   <header><h1>{{ title }}</h1></header>
-
-  {# <img class='doc-header-image doc-image' src="/img/{{ title | slug }}.png" /> #}
 
   {% if content | toc %}
     <h2>Table of contents</h2>
@@ -14,6 +12,4 @@ layout: base-layout
   {% endif %}
 
   {{ content | safe }}
-</article>
-
-{% include 'doc-list.html' %}
+</article>

src/styles/index.css

@@ -1,6 +1,6 @@
 @import "resetti";
+@import "tokens.css";
 @import "typography.css";
 @import "global.css";
 @import "layout.css";
 @import "prism.css";
-@import "doc.css";

src/styles/tokens.css

@@ -0,0 +1,3 @@
+:root {
+  --gray-0: #000;
+}