update main page look.

.gitignore

@@ -2,4 +2,5 @@
 */.DS_Store
 _site/*
 *~
-**/*~
+**/*~
+.jekyll-cache

Gemfile.lock

@@ -1,57 +1,59 @@
 GEM
   remote: http://rubygems.org/
   specs:
-    addressable (2.5.2)
-      public_suffix (>= 2.0.2, < 4.0)
+    addressable (2.7.0)
+      public_suffix (>= 2.0.2, < 5.0)
     colorator (1.1.0)
-    concurrent-ruby (1.1.4)
+    concurrent-ruby (1.1.6)
     em-websocket (0.5.1)
       eventmachine (>= 0.12.9)
       http_parser.rb (~> 0.6.0)
     eventmachine (1.2.7)
-    ffi (1.10.0)
+    ffi (1.12.2)
     forwardable-extended (2.6.0)
     http_parser.rb (0.6.0)
-    i18n (0.9.5)
+    i18n (1.8.2)
       concurrent-ruby (~> 1.0)
-    jekyll (3.8.5)
+    jekyll (4.0.0)
       addressable (~> 2.4)
       colorator (~> 1.0)
       em-websocket (~> 0.5)
-      i18n (~> 0.7)
-      jekyll-sass-converter (~> 1.0)
+      i18n (>= 0.9.5, < 2)
+      jekyll-sass-converter (~> 2.0)
       jekyll-watch (~> 2.0)
-      kramdown (~> 1.14)
+      kramdown (~> 2.1)
+      kramdown-parser-gfm (~> 1.0)
       liquid (~> 4.0)
       mercenary (~> 0.3.3)
       pathutil (~> 0.9)
-      rouge (>= 1.7, < 4)
+      rouge (~> 3.0)
       safe_yaml (~> 1.0)
-    jekyll-sass-converter (1.5.2)
-      sass (~> 3.4)
-    jekyll-watch (2.1.2)
+      terminal-table (~> 1.8)
+    jekyll-sass-converter (2.1.0)
+      sassc (> 2.0.1, < 3.0)
+    jekyll-watch (2.2.1)
       listen (~> 3.0)
-    kramdown (1.17.0)
-    liquid (4.0.1)
-    listen (3.1.5)
-      rb-fsevent (~> 0.9, >= 0.9.4)
-      rb-inotify (~> 0.9, >= 0.9.7)
-      ruby_dep (~> 1.2)
+    kramdown (2.1.0)
+    kramdown-parser-gfm (1.1.0)
+      kramdown (~> 2.0)
+    liquid (4.0.3)
+    listen (3.2.1)
+      rb-fsevent (~> 0.10, >= 0.10.3)
+      rb-inotify (~> 0.9, >= 0.9.10)
     mercenary (0.3.6)
     pathutil (0.16.2)
       forwardable-extended (~> 2.6)
-    public_suffix (3.0.3)
+    public_suffix (4.0.3)
     rb-fsevent (0.10.3)
-    rb-inotify (0.10.0)
+    rb-inotify (0.10.1)
       ffi (~> 1.0)
-    rouge (3.3.0)
-    ruby_dep (1.5.0)
-    safe_yaml (1.0.4)
-    sass (3.7.3)
-      sass-listen (~> 4.0.0)
-    sass-listen (4.0.0)
-      rb-fsevent (~> 0.9, >= 0.9.4)
-      rb-inotify (~> 0.9, >= 0.9.7)
+    rouge (3.16.0)
+    safe_yaml (1.0.5)
+    sassc (2.2.1)
+      ffi (~> 1.9)
+    terminal-table (1.8.0)
+      unicode-display_width (~> 1.1, >= 1.1.1)
+    unicode-display_width (1.6.1)
 
 PLATFORMS
   ruby
@@ -60,4 +62,4 @@ DEPENDENCIES
   jekyll
 
 BUNDLED WITH
-   1.16.2
+   2.1.2

_posts/2011-09-26-recreating_old_vis_with_new_tech.md

@@ -2,7 +2,7 @@
 layout: post
 title: Recreating Old Visualizations with New Technology
 categories:
-  - vis
+  - tutorial
 ---
 
 ### Using d3 and coffeescript to reproduce old charts

_posts/2011-10-20-visualizing_the_racial_divide.md

@@ -2,7 +2,7 @@
 layout: post
 title: Visualizing the Racial Divide
 categories:
-  - vis
+  - tutorial
 ---
 
 ### Using d3 and force-directed maps to see the impact of segregation in cities

_posts/2012-04-05-kansas_city_streets_map_with_tilemill.md

@@ -2,7 +2,7 @@
 layout: post
 title: Kansas City Streets Visualized
 categories:
-  - vis
+  - tutorial
 ---
 
 ### Using Tilemill and OpenStreetMaps for Printable Map-Art

_posts/2013-10-18-mapping_seattle_streets.md

@@ -2,7 +2,7 @@
 layout: post
 title: Mapping Seattle - Streets
 categories:
-  - vis
+  - tutorial
 ---
 
 Recently, I’ve up-rooted my family and transplanted from Kansas City, MO to Seattle, WA. This represents the first major venture out of the Midwest for my wife, dauther, and myself. Its exciting and scary and fun and difficult.

_posts/2014-01-27-visualizing_bird_songs.md

@@ -4,7 +4,7 @@ title: Visualizing Bird Songs with Web Audio
 css: spectrogram.css
 source: https://github.com/vlandham/spectrogramJS
 categories:
-  - vis
+  - tutorial
 ---
 
 <script src="//d3js.org/d3.v3.min.js" charset="utf-8"></script>

_posts/2014-03-18-experiments_repo.md

@@ -2,7 +2,7 @@
 layout: post
 title: Experiments!
 categories:
-  - vis
+  - tutorial
 ---
 
 Want some more data visualization attempts, studies, and undertakings? Check out my new [Experiments Section](http://vallandingham.me/experiments/)

_posts/2015-04-29-vintage_bump_chart.md

@@ -6,7 +6,7 @@ twitter_type: summary
 description:
 img:
 categories:
-  - vis
+  - tutorial
 ---
 
 A quick shoutout for another vintage visualization I implemented in code:

_posts/2015-08-29-stereotropes.md

@@ -6,7 +6,7 @@ twitter_type: summary
 description:
 img:
 categories:
-  - vis
+  - tutorial
 ---
 
 <div class="center">

css/style.css

@@ -1,5 +1,5 @@
 a {
-  color: #6e6e6e;
+  color: #333;
   text-decoration: underline;
 }
 
@@ -12,9 +12,27 @@ a img {
   border: 0;
 }
 
-/*.banner {
-  max-width: 800px;
-}*/
+.posts a {
+  text-decoration: none;
+}
+
+.posts a:hover {
+  text-decoration: underline;
+}
+
+.posts {
+  white-space: nowrap;
+}
+
+#menu a:hover {
+  text-decoration: underline;
+}
+
+@media only screen and (max-width: 750px) {
+  .post-date {
+    display: none;
+  }
+}
 
 .heading-anchor {
   color: #ccc;
@@ -174,6 +192,10 @@ a img {
   margin-bottom: 0.5rem;
 }
 
+.main-body h2 {
+  padding-top: 20px;
+}
+
 .post {
   font-size: 1.8rem;
   line-height: 1.7;

index.html

@@ -7,35 +7,35 @@
 description: Visualizations by Jim Vallandingham.
 img: http://vallandingham.me/images/vis/vis_card.png
 ---
-<div class="main-body">
-  <h2>Tutorials &amp; Posts</h2>
-  <ul class="posts">
-    {% for post in site.categories.tutorial %}
-    <li><a class="post_title" href="{{ post.url }}">{{ post.title }}</a></li>
-    {% endfor %}
-  </ul>
 
-  <h2>Visualizations</h2>
-  <ul class="posts">
-    {% for post in site.categories.vis %}
-    <li><a class="post_title" href="{{ post.url }}">{{ post.title }}</a></li>
-    {% endfor %}
-    <li>
-      <a class="post_title" href="http://vallandingham.me/vis/">More Visualizations</a>
-    </li>
-  </ul>
+<div class="main-body">
+  <h2>Writing</h2>
+  {% for post in site.categories.tutorial %}
+  <div class="row posts">
+    <div class="ten columns">
+      <a href="{{ post.url }}">{{ post.title }}</a>
+    </div>
+    <div class="two columns post-date">
+      {{ post.date | date: "%Y-%m-%d"}}
+    </div>
+  </div>
+  {% endfor %}
 
-  <h2>Talks &amp; Workshops</h2>
-  <ul class="posts">
-    {% for post in site.categories.talk %}
-    <li><a class="post_title" href="{{ post.url }}">{{ post.title }}</a></li>
-    {% endfor %}
-  </ul>
+  <h2>Talks</h2>
+  {% for post in site.categories.talk %}
+  <div class="row posts">
+    <div class="ten columns"><a href="{{ post.url }}">{{ post.title }}</a></div>
+  </div>
+  {% endfor %}
 
-  <h2>Random Collections</h2>
-  <ul class="posts">
+  <h2>Collections</h2>
     {% for collection in site.data.collections %}
-    <li><a class="post_title" href="{{ collection.url }}">{{ collection.title }}</a></li>
+  <div class="row posts">
+    <div class="ten columns">
+      <a href="{{ collection.url }}"
+        >{{ collection.title }}</a
+      >
+    </div>
+  </div>
     {% endfor %}
-  </ul>
-</div>
+<//div>