Now uses tachyons

Author: Aloso

src/styles/app.scss

@@ -140,34 +140,12 @@ a.brand {
   }
 }
 
-table.post-list {
-  border-collapse: collapse;
-  width: 100%;
-}
-table.post-list .post-entry {
-  font-size: 150%;
-}
-table.post-list td {
-  border: none;
-  padding: 10px 0;
-}
-table.post-list .post-year {
-  font-size: 2em;
-}
-table.post-list .post-link a {
+table.post-list a {
   text-decoration: none;
 }
-table.post-list .post-link a:hover {
+table.post-list a:hover {
   text-decoration: underline;
 }
-table.post-list .post-date {
-  opacity: 0.6;
-  padding-right: 30px;
-  text-align: right;
-}
-table.post-list .post-year h3 {
-  margin: 2rem 0 0 0;
-}
 
 .publish-date-author {
   color: $gray;

templates/index.hbs

@@ -10,11 +10,15 @@
 <section id="posts" class="purple">
    <div class="w-100 mw-none ph3 mw8-m mw9-l center f3">
 
-    <table class="post-list">
+    <table class="post-list collapse w-100 f2-l f2-m f3-s">
     {{#each posts}}
-      {{#if show_year}}<tr class="post-year"><td></td><td class="year"><h3>{{year}}</h3></td></tr>{{/if}}
-      <tr class="post-entry">
-          <td class="post-date">{{month_name month}} {{day}}</td><td class="post-link"><a href="{{url}}">{{title}}</a></td>
+      {{#if show_year}}<tr>
+        <td class="bn"></td>
+        <td class="bn"><h3 class="f0-l f1-m f2-s mt4 mb0">{{year}}</h3></td>
+      </tr>{{/if}}
+      <tr>
+        <td class="tr o-60 pr4 pr5-l bn">{{month_name month}}&nbsp;{{day}}</td>
+        <td class="bn"><a href="{{url}}">{{title}}</a></td>
       </tr>
     {{/each}}
     </table>

templates/post.hbs

@@ -6,7 +6,7 @@
       <div class="highlight"></div>
     </header>
 
-    <div class="publish-date-author">{{month_name post.month}} {{post.day}}, {{post.year}} • {{post.author}}</div>
+    <div class="publish-date-author">{{month_name post.month}} {{post.day}}, {{post.year}} &middot; {{post.author}}</div>
 
     <div class="post">
       {{{ post.contents }}}