Update

Readme.md

@@ -25,6 +25,8 @@
 `ul` supports these:
 
     {: .-also-see}
+    {: .-four-column}
+    {: .-six-column}
 
 Each sheet supports these metadata:
 

_config.yml

@@ -1,5 +1,5 @@
 # gems
-gems:
+whitelist:
   - jekyll-redirect-from
   - jekyll-github-metadata
 

_layouts/2017/sheet.html

@@ -15,6 +15,12 @@ type: article
     {% endif %}
   </div>
 
+  {% if page.tags contains 'WIP' %}
+    <div class='notice-box'>
+      This page is a work in progress. You can help by <a href='{{ site.github.repository_url }}/blob/gh-pages/{{ page.path | remove: '.html' }}'>suggesting edits</a>!
+    </div>
+  {% endif %}
+
   <div class='post-content MarkdownBody' data-js-main-body>
     {{ content }}
   </div>

_sass/2017/components/notice-box.scss

@@ -0,0 +1,21 @@
+.notice-box {
+  & {
+    margin-bottom: 24px;
+    color: $base-mute;
+  }
+
+  @media (max-width: 480px) {
+    margin-bottom: 16px;
+  }
+
+  &::before {
+    @include ion-icon('md-information-circle');
+    font-size: 24px;
+    margin-right: 8px;
+    color: $base-mute3;
+  }
+
+  & > a {
+    text-decoration: none;
+  }
+}

_sass/2017/markdown/ul.scss

@@ -0,0 +1,37 @@
+.MarkdownBody ul.-six-column {
+  & {
+    display: flex;
+    flex-wrap: wrap;
+  }
+
+  & > li {
+    flex: 0 0 (100% / 6);
+
+    @media (max-width: 480px) {
+      flex: 0 0 (100% / 2);
+    }
+
+    @media (max-width: 768px) {
+      flex: 0 0 (100% / 4);
+    }
+  }
+}
+
+.MarkdownBody ul.-four-column {
+  & {
+    display: flex;
+    flex-wrap: wrap;
+  }
+
+  & > li {
+    flex: 0 0 (100% / 4);
+
+    @media (max-width: 480px) {
+      flex: 0 0 (100% / 2);
+    }
+
+    @media (max-width: 768px) {
+      flex: 0 0 (100% / 3);
+    }
+  }
+}

_sass/2017/style.scss

@@ -10,12 +10,14 @@
 @import './markdown/code';
 @import './markdown/headings';
 @import './markdown/table';
+@import './markdown/ul';
 @import './components/body-area';
 @import './components/h2-section';
 @import './components/h3-section';
 @import './components/h3-section-list';
 @import './components/headline-ad';
 @import './components/main-heading';
+@import './components/notice-box';
 @import './components/page-actions';
 @import './components/pages-list';
 @import './components/top-nav';

jekyll-github.md

@@ -9,9 +9,7 @@ tags: [WIP]
 
 Jekyll
 ------
-{: .-three-column}
+{: .-one-column}
-
-### Jekyll gems
 
 * jekyll-avatar
 * jekyll-coffeescript
@@ -28,6 +26,7 @@ Jekyll
 * jekyll-sass-converter
 * jekyll-seo-tag
 * jekyll-sitemap
+{: .-four-column}
 
 As of github-pages v156.