website/www: work on a blog

website/www/Gemfile

@@ -2,7 +2,9 @@ source 'https://rubygems.org'
 
 gem "less", "~> 2.2.2"
 gem "middleman", "~> 3.1.5"
+gem "middleman-blog", "~> 3.3.0"
 gem "middleman-minify-html", "~> 3.1.1"
+gem "nokogiri", "~> 1.6.0"
 gem "rack-contrib", "~> 1.1.0"
 gem "redcarpet", "~> 3.0.0"
 gem "therubyracer", "~> 0.12.0"

website/www/Gemfile.lock

@@ -44,6 +44,10 @@ GEM
       middleman-sprockets (>= 3.1.2)
       sass (>= 3.1.20)
       uglifier (~> 2.1.0)
+    middleman-blog (3.3.0)
+      middleman-core (~> 3.0)
+      middleman-more (~> 3.0)
+      tzinfo (~> 0.3.0)
     middleman-core (3.1.5)
       activesupport (~> 3.2.6)
       bundler (~> 1.1)
@@ -62,7 +66,10 @@ GEM
       sprockets (~> 2.1)
       sprockets-helpers (~> 1.0.0)
       sprockets-sass (~> 1.0.0)
+    mini_portile (0.5.1)
     multi_json (1.8.0)
+    nokogiri (1.6.0)
+      mini_portile (~> 0.5.0)
     rack (1.5.2)
     rack-contrib (1.1.0)
       rack (>= 0.9.1)
@@ -95,6 +102,7 @@ GEM
       rack (>= 1.0.0)
     thor (0.18.1)
     tilt (1.3.7)
+    tzinfo (0.3.37)
     uglifier (2.1.2)
       execjs (>= 0.3.0)
       multi_json (~> 1.0, >= 1.0.2)
@@ -106,7 +114,9 @@ DEPENDENCIES
   highline (~> 1.6.15)
   less (~> 2.2.2)
   middleman (~> 3.1.5)
+  middleman-blog (~> 3.3.0)
   middleman-minify-html (~> 3.1.1)
+  nokogiri (~> 1.6.0)
   rack-contrib (~> 1.1.0)
   redcarpet (~> 3.0.0)
   therubyracer (~> 0.12.0)

website/www/config.rb

@@ -55,6 +55,16 @@ set :images_dir, 'images'
 set :markdown_engine, :redcarpet
 set :markdown, :fenced_code_blocks => true
 
+# Enable the blog and set the time zone so that post times appear
+# correctly.
+Time.zone = "America/Los_Angeles"
+
+activate :blog do |b|
+  b.layout = "blog_post"
+  b.permalink = ":title.html"
+  b.prefix = "blog"
+end
+
 # Build-specific configuration
 configure :build do
   activate :asset_hash

website/www/source/_sidebar_blog.erb

@@ -0,0 +1,11 @@
+<!--
+<div class="Modules blog-sidebar">
+The Vagrant blog contains release announcements, feature introduction,
+advanced guides, and tutorials. The posts are written by core committers
+as well as the Vagrant community.
+</div>
+-->
+<ul class="unstyled">
+	<li<%= sidebar_current("blog") %>><a href="/blog.html">Blog</a></li>
+	<li<%= sidebar_current("blog-archives") %>><a href="/blog-archives.html">Article Archive</a></li>
+</ul>

website/www/source/blog.html.erb

@@ -0,0 +1,34 @@
+---
+layout: "inner"
+sidebar_current: "blog"
+sidebar_template: "blog"
+sidebar_title: "Blog"
+page_title: "Blog"
+---
+
+<div class="Modules blog-landing">
+<% blog.articles.each_index do |i| %>
+<% article = blog.articles[i] %>
+<div class="row">
+	<div class="span8">
+		<article>
+		<div class="meta">
+			<span class="meta date">
+				<%= article.date.strftime('%b %e %Y') %>
+			</span>
+			<% if article.data.author %>
+				by <a href="<%= article.data.author_url %>"><%= article.data.author %></a>
+			<% end %>
+		</div>
+		<h2><a href="<%= article.url %>"><%= article.title %></a></h2>
+		<div class="row">
+			<div class="span7"><p><%= article.summary %></p></div>
+		</div>
+		<a class="read-more" href="<%= article.url %>">read more</a>
+		</article>
+	</div>
+</div>	<!-- row -->
+</article>
+<% end %>
+
+</div> <!-- blog landing -->

website/www/source/blog/2013-09-16-test.html.markdown

@@ -0,0 +1,26 @@
+---
+page_title: Introducing the Vagrant Blog
+title: Introducing the Vagrant Blog
+author: Mitchell Hashimoto
+author_url: https://github.com/mitchellh
+---
+
+Welcome to the official Vagrant blog. This blog will be used to announce
+new releases, highlight Vagrant features, showcase specific Vagrant use-cases,
+and more.
+
+We invite any members of the Vagrant community to submit blog posts
+by creating a [pull request on the Vagrant GitHub repository](https://github.com/mitchellh/vagrant).
+You can find all the blog posts in `website/www/source/blog`. The
+`website/www` directory has a README file explaining how to run the
+site locally.
+
+We're looking for submissions on anything and everything related to Vagrant.
+It can be as general as how to use a certain feature of Vagrant, or as
+specific as how to use Vagrant to develop a certain application or in
+a certain language.
+
+Please subscribe [to the RSS feed](#).
+We look forward to shipping blog posts shortly!
+
+READMORE

website/www/source/blog_feed.xml.builder

@@ -0,0 +1,23 @@
+xml.instruct!
+xml.feed "xmlns" => "http://www.w3.org/2005/Atom" do
+  xml.title "Vagrant Blog"
+  xml.subtitle "Release announcements, how-to guides, and more for Vagrant."
+  xml.id "http://www.vagrantup.com/blog.html"
+  xml.link "href" => "http://www.vagrantup.com/blog.html"
+  xml.link "href" => "http://www.vagrantup.com/blog_feed.xml", "rel" => "self"
+  xml.updated blog.articles.first.date.to_time.iso8601
+  xml.author { xml.name "Vagrant" }
+
+  blog.articles[0..5].each do |article|
+    xml.entry do
+      xml.title article.title
+      xml.link "rel" => "alternate", "href" => article.url
+      xml.id article.url
+      xml.published article.date.to_time.iso8601
+      xml.updated article.date.to_time.iso8601
+      xml.author { xml.name article.data.author }
+      xml.summary article.summary, "type" => "html"
+      xml.content article.body, "type" => "html"
+    end
+  end
+end

website/www/source/layouts/blog_post.erb

@@ -0,0 +1,42 @@
+<% wrap_layout :layout do %>
+	<div class="page inner">
+	<!-- background color -->
+	<div class="page-background"></div>
+
+	<div class="container">
+		<div class="row">
+
+			<div class="sidebar span3">
+				<!-- side nav -->
+				<aside class="sidebar-nav">
+
+					<!-- page title -->
+					<h1 class="all-caps">Blog Post</h1>
+					<%= partial "sidebar_blog" %>
+				</aside> <!-- /.sidebar -->
+			</div> <!-- /.sidebar -->
+
+			<div class="Modules blog-post page-contents span9 offset3">
+				<!-- start page content -->
+				<div class="row">
+					<div class="span7 offset1">
+						<article>
+							<div class="meta">
+								<span class="meta date">
+									<%= current_article.date.strftime('%b %e %Y') %>
+								</span>
+								<% if current_article.data.author %>
+									by <a href="<%= current_article.data.author_url %>"><%= current_article.data.author %></a>
+							<% end %>
+							</div>
+							<h2><%= current_article.title %></h2>
+							<%= yield %>
+						</article>
+					</div> <!-- /span -->
+				</div> <!-- /row -->
+				<!-- end page content -->
+			</div> <!-- /.span8 -->
+		</div> <!-- /.row -->
+	</div> <!-- /.container -->
+</div> <!-- /.page.inner -->
+<% end %>

website/www/source/stylesheets/_modules.less

@@ -1,16 +1,37 @@
 .Modules {
-  &.sponsors {
+    &.blog-landing, &.blog-post {
-    margin-top: 50px;
+        article {
+            .meta {
+                font-size: 16px;
+            }
 
-    ul {
+            h2 {
-      list-style-type: none;
+                font-size: 45px;
-
+                font-weight: bold;
-      li {
+                margin-top: 2px;
-        float: left;
+                text-transform: none;
-        text-align: center;
+            }
-        width: 50%;
+        }
-        height: 250px;
+    }
-      }
+
+    &.blog-sidebar {
+        color: #476576;
+        font-size: 18px;
+        line-height: 26px;
+    }
+
+    &.sponsors {
+        margin-top: 50px;
+
+        ul {
+            list-style-type: none;
+
+            li {
+                float: left;
+                text-align: center;
+                width: 50%;
+                height: 250px;
+            }
+        }
     }
-  }
 }