@@ -3,7 +3,7 @@ permalink: about
 title: About
 type: page
 -----
-H3RALD.com was created in 2004 by Fabio Cevasco, a technical writer, programmer and IT enthusiast. It features over a hundred "articles":/articles/ covering a wide range of topics, from programming to writing, productivity and even traveling.
+H3RALD.com was created in 2004 by Fabio Cevasco, a technical writer, programmer and IT enthusiast. It features over a hundred "articles":/archives/ covering a wide range of topics, from programming to writing, productivity and traveling.
 
 As of version 8, H3RALD.com is a completely static web site, except for a few AJAX calls. All the files are generated automatically thanks to the "nanoc":http://nanoc.stoneship.org/ publishing system, an ingenious creation of "Denis Defreyne":http://www.stoneship.org/. Nanoc can be used to easily create static web sites using Ruby, as explained in "this article":http://www.h3rald.com/articles/take-back-your-site-with-nanoc/.
 
@@ -14,7 +14,7 @@ The "articles":/archives/ and all the content published on this web site is licensed under the _Creative Commons Attribution-Noncommercial-No Derivative Works 3.0 Unported License_. For other uses, please "contact us":/contact/.
 
 <a rel="license" href="http://creativecommons.org/licenses/by-nc-nd/3.0/"><img alt="Creative Commons License" src="http://i.creativecommons.org/l/by-nc-nd/3.0/88x31.png" /></a>
 
-The source code of this web site, such as its layout, SASS/CSS stylesheets, custom rake tasks and code is licensed under the terms of the <em><a href="http://creativecommons.org/licenses/MIT/">MIT License</a></em> and it is available on "GitHub":http://github.com/h3rald/h3rald.
+The source code of this web site, such as its layout, SASS/CSS stylesheets, custom rake tasks and code is licensed under the terms of the <em><a href="http://creativecommons.org/licenses/MIT/">MIT License</a></em> and it is available on "GitHub":https://github.com/h3rald/h3rald.
 
 
 h3. Requirements

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: April 2006"
+-----
+:title: ! 'Archive: April 2006'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: april-2006
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: April 2008"
+-----
+:title: ! 'Archive: April 2008'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: april-2008
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: April 2009"
+-----
+:title: ! 'Archive: April 2009'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: april-2009
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: April 2010"
+-----
+:title: ! 'Archive: April 2010'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: april-2010
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: August 2006"
+-----
+:title: ! 'Archive: August 2006'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: august-2006
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: August 2007"
+-----
+:title: ! 'Archive: August 2007'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: august-2007
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: August 2008"
+-----
+:title: ! 'Archive: August 2008'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: august-2008
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: August 2011"
+-----
+:title: ! 'Archive: August 2011'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: august-2011
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: December 2005"
+-----
+:title: ! 'Archive: December 2005'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: december-2005
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: December 2007"
+-----
+:title: ! 'Archive: December 2007'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: december-2007
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: December 2008"
+-----
+:title: ! 'Archive: December 2008'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: december-2008
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: December 2010"
+-----
+:title: ! 'Archive: December 2010'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: december-2010
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: February 2006"
+-----
+:title: ! 'Archive: February 2006'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: february-2006
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: February 2009"
+-----
+:title: ! 'Archive: February 2009'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: february-2009
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: February 2011"
+-----
+:title: ! 'Archive: February 2011'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: february-2011
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: January 2006"
+-----
+:title: ! 'Archive: January 2006'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: january-2006
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: January 2007"
+-----
+:title: ! 'Archive: January 2007'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: january-2007
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: January 2008"
+-----
+:title: ! 'Archive: January 2008'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: january-2008
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: January 2009"
+-----
+:title: ! 'Archive: January 2009'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: january-2009
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: January 2010"
+-----
+:title: ! 'Archive: January 2010'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: january-2010
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: January 2011"
+-----
+:title: ! 'Archive: January 2011'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: january-2011
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: July 2005"
+-----
+:title: ! 'Archive: July 2005'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: july-2005
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: July 2006"
+-----
+:title: ! 'Archive: July 2006'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: july-2006
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: July 2007"
+-----
+:title: ! 'Archive: July 2007'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: july-2007
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: July 2008"
+-----
+:title: ! 'Archive: July 2008'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: july-2008
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: July 2009"
+-----
+:title: ! 'Archive: July 2009'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: july-2009
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: July 2011"
+-----
+:title: ! 'Archive: July 2011'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: july-2011
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: June 2005"
+-----
+:title: ! 'Archive: June 2005'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: june-2005
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: June 2006"
+-----
+:title: ! 'Archive: June 2006'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: june-2006
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: June 2007"
+-----
+:title: ! 'Archive: June 2007'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: june-2007
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: June 2008"
+-----
+:title: ! 'Archive: June 2008'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: june-2008
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: June 2009"
+-----
+:title: ! 'Archive: June 2009'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: june-2009
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: June 2010"
+-----
+:title: ! 'Archive: June 2010'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: june-2010
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: March 2006"
+-----
+:title: ! 'Archive: March 2006'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: march-2006
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: March 2007"
+-----
+:title: ! 'Archive: March 2007'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: march-2007
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: March 2008"
+-----
+:title: ! 'Archive: March 2008'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: march-2008
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: March 2009"
+-----
+:title: ! 'Archive: March 2009'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: march-2009
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: March 2011"
+-----
+:title: ! 'Archive: March 2011'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: march-2011
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: May 2006"
+-----
+:title: ! 'Archive: May 2006'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: may-2006
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: May 2008"
+-----
+:title: ! 'Archive: May 2008'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: may-2008
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: May 2009"
+-----
+:title: ! 'Archive: May 2009'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: may-2009
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: May 2010"
+-----
+:title: ! 'Archive: May 2010'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: may-2010
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: November 2005"
+-----
+:title: ! 'Archive: November 2005'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: november-2005
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: November 2006"
+-----
+:title: ! 'Archive: November 2006'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: november-2006
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: November 2007"
+-----
+:title: ! 'Archive: November 2007'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: november-2007
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: November 2008"
+-----
+:title: ! 'Archive: November 2008'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: november-2008
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: November 2009"
+-----
+:title: ! 'Archive: November 2009'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: november-2009
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: November 2010"
+-----
+:title: ! 'Archive: November 2010'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: november-2010
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: October 2007"
+-----
+:title: ! 'Archive: October 2007'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: october-2007
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: October 2008"
+-----
+:title: ! 'Archive: October 2008'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: october-2008
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: October 2009"
+-----
+:title: ! 'Archive: October 2009'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: october-2009
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: September 2006"
+-----
+:title: ! 'Archive: September 2006'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: september-2006
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: September 2007"
+-----
+:title: ! 'Archive: September 2007'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: september-2007
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: September 2008"
+-----
+:title: ! 'Archive: September 2008'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: september-2008
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: September 2009"
+-----
+:title: ! 'Archive: September 2009'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: september-2009
 -----

@@ -1,7 +1,7 @@ 
------ 
-:title: "Archive: September 2010"
+-----
+:title: ! 'Archive: September 2010'
 :type: page
-:filters_pre: 
+:filters_pre:
 - erb
 :permalink: september-2010
 -----

@@ -0,0 +1,122 @@ 
+-----
+:permalink: h3rald-83
+:title: H3RALD.com v8.3 Released
+:subtitle: A new minimalist design, powered by Twitter Bootstrap
+:type: article
+:intro: |
+  One of the many things that really bothered me about my web site was the fact that it didn't look good on my iPhone, or any small screen for that matter.
+
+  Years ago I "read about":http://www.alistapart.com/articles/responsive-web-design/ responsive web design, media queries, etc., but I never had the will or the time to dive into the subject. Then "Twitter Bootstrap":http://twitter.github.com/bootstrap/ came out, and it changed _everything_. 
+:extended_intro: |
+  Not only Bootstrap provides a very solid HTML boilerplate and grid system, it also comes with some very nice and complete styles for every HTML element, a few Javascript-enhanced UI components, and  best of all it is fully responsive.  
+:tags:
+- website
+- webdevelopment
+:date: 2012-12-27 23:41:34.376991000 +01:00
+:pdf: false
+-----
+$[document.intro]
+
+§txt[
+  @title[Getting to know Bootstrap & its CSS wizardry]
+
+Redesigning H3RALD.com using Twitter Bootstrap turned out to be fairly easy. I headed up to the "Customize and Download":http://twitter.github.com/bootstrap/customize.html page and set a few variables like the font to use (the beautiful "Crimson text":http://aldusleaf.org/crimson.php), the link color and so on, and downloaded the lot.
+
+I more or less completely forgot about my old CSS stylesheets and went with Bootstrap all the way. I was happy with a lot of the defaults, but I had to add a few rules and overrides for:
+* headings
+* line heights
+* A few custom classes I use extensively, like add a @text-align: justify;@ for the @hyphenate@ class.
+
+Now, one of the cool things of Bootstrap is that it comes with smart defaults, and that it lets you add specific features to elements simply by adding a CSS class to them. Take a look at how "buttons":http://twitter.github.com/bootstrap/base-css.html#buttons are constructed, for instance. Normal button? Sure:
+
+table[
+  tr[
+    td[highlight[html|<button class="btn">Click Me!</button>]]td[<button class="btn">Click Me!</button>]
+  ]
+]
+
+That's grey with black text. Boring. Want it black? Sure, add the @.btn-inverse@ class:
+
+table[
+  tr[
+    td[highlight[html|<button class="btn btn-inverse">Click Me!</button>]]td[<button class="btn btn-inverse">Click Me!</button>]
+  ]
+]
+
+Too bit? No problem, make it smaller with @.btn-small@, so we have:
+
+table[
+  tr[
+    td[highlight[html|<button class="btn btn-inverse btn-small">Click Me!</button>]]td[<button class="btn btn-inverse btn-small">Click Me!</button>]
+  ]
+]
+
+
+Wouldn't it be nice to have a nice icon in it? Add an empty @<i>@ element with a suitable class and there you have a nice "Glyphicon":http://twitter.github.com/bootstrap/base-css.html#icons before the button text.
+
+table[
+  tr[
+    td[highlight[html|<button class="btn btn-inverse btn-small"><i class="icon-ok"></i> Click Me!</button>]]td[<button class="btn btn-inverse btn-small"><i class="icon-ok"></i> Click Me!</button>]
+  ]
+]
+
+...You get the picture. And it works surprisingly well -- if you embrace its philosophy, that is. Just like Rails & Co.: an _opinionated_ framework.
+
+The only thing that bugged me about all this was that by adding smart CSS classes to elements you're actually specifying how something looks like by polluting HTML code. Granted, if your stylesheet doesn't include a @.btn-inverse@ your buttons won't automagically become black, but you know what I mean. Although in a very nice way, by following Bootstrap's way of doing things you are no longer separating content from presentation. And in the next six months, when I'll ditch Bootstrap for something better, all the previews of the code snippets above won't work unless I keep using the Bootstrap stylesheet or at least some of its button classes.
+
+The real problems arise for the stylesheets provided for general elements. By default, Bootstrap styles tables with no borders or colors. What if I wanted just ordinary tables to be striped and bordered? Sure, I can add the @.table-striped@ and @.table-bordered@ classes to all tables, and that's it. In EVERY table. Or of course undo bootstrap's magic by overriding the CSS rules for ordinary tables, to include the rules specified for @.table-striped@ and @.table-bordered@. Copy & paste someone else's code? Not nice. 
+
+Luckily, using "SASS":http://sass-lang.com/ finally paid off, and here's how to do it in a nice and tidy way:
+
+<notextile>
+  highlight[=css|@import "_bootstrap.scss"; 
+/* The bootstrap stylesheet - just changed its extension and prepended an underscore, nothing more */
+
+table {
+  @extend .table;
+  @extend .table-striped;
+  @extend .table-bordered;
+}
+  =]
+</notextile>
+
+There you go. All tables (ordinary @<table>@ elements with no silly classes attached) are now bordered and striped.
+
+]
+
+
+§txt[
+  @title[Header & navigation bar]
+
+As far as the main site header goes, I decided to use the same one for all pages, containing:
+* The site logo
+* The search input box (powered by "Google Custom Search Engine":http://www.google.com/cse/
+* A _responsive_ navigation bar with links to all the main sections of the site
+
+As far as the navigation bar goes, that's pure Bootstrap goodness, nothing new there (except the serif font), "look it up":http://twitter.github.com/bootstrap/components.html#navbar. 
+
+For the logo... Well, I had this nice plan of using just plain CSS and web fonts to make it (hell, it's basically the word "H3RALD", with the 3 slightly bigger and moved a bit). It worked mostly fine (in webkit browser and in Opera), but Firefox didn't like it much, and IE... well, some old versions of IE don't play nice with web fonts, so I decided to make a nice PNG image and stick it there instead. Less hassle, it works everywhere, job done.
+
+The search input box was a bit more of a challenge. I read up on the new "Custom Search Element Control API":https://developers.google.com/custom-search/docs/element, discovered that Google decided that web designers don't know Javascript or CSS nowadays and proposed a new API that has numerous advantages like:
+
+blockquote[
+* Easy to use syntax—no JavaScript knowledge required.
+* Custom Search elements (search boxes and results pages) are rendered based on settings stored on the CSE servers (along with any client-side customization). Server-side changes don't require you to copy and paste any new code into your site
+]
+
+Thanks Google. Now every time I change my stylesheet I have to remember to go back to your page and change the link colors etc. And if I decide to hide the page URL underneath the link in the results? I can't. And that's why I decided to reverse engineer their CSS and provide my overrides. Nasty, but at least I have some control! They're all "here":https://github.com/h3rald/h3rald/blob/master/content/styles/_vendor.scss, if you are curious.  
+]
+
+§txt[
+  @title[Other minor changes & tweaks]
+
+Other changes from the previous design were relatively minimal:
+* No more newspaper-style home page with five columns, two will suffice.
+* A brand new "Tags":/tags/ page, listing... well, all the site tags that were previously in the "Archives":/archives/ pages (now only listing articles by month of publication)
+* No more Links page. No need for it.
+* A new, minimalist "Contact":/contact/ page, featuring some of the nice "Zocial":http://zocial.smcllns.com/ font icons.
+* No more social buttons on pages. If you use social networks like Twitter, Facebook or Google+ you already know how to share items using bookmarklets or browser extensions. No need to plague my web site with their nasty buttons, badges, ribbons & alike.
+* No ads! I have a full-time job, my site uses free and open source technologies, and I write because I like to do so, not to make money. And I can afford the few bucks necessary to pay the hosting provider. That's why there are NO ADS on H3RALD.com anymore ^(*)^.
+
+^(*)^: For now, that is. Then I'll probably change my mind, but until then enjoy the true no-ads experience!
+]

@@ -11,18 +11,17 @@ -----
 <%
 max_items = 15
 
-all_articles = latest_articles.length
 latest = latest_articles 6
 popular = popular_articles 10
-all_projects = @items.select{|a| a[:type] == 'project'}.length
+
 %>
 <div class="row">
   <section class="span8" id="main-content">
   <%= render 'article_intro', :item => latest[0], :classes => "hyphenate", :extended => true %>
+  <%= render 'article_intro', :item => latest[1], :classes => "hyphenate", :extended => false %>
+  <%= render 'article_intro', :item => latest[2], :classes => "hyphenate", :extended => false %>
   <%= render 'article_intro', :item => latest[3], :classes => "hyphenate", :extended => false %>
   <%= render 'article_intro', :item => latest[4], :classes => "hyphenate", :extended => false %>
-  <%= render 'article_intro', :item => latest[1], :classes => "hyphenate", :extended => false %>
-  <%= render 'article_intro', :item => latest[2], :classes => "hyphenate", :extended => false %>
   <%= render 'article_intro', :item => latest[5], :classes => "hyphenate", :extended => false %>
   <p><a href="/archives/">&larr; Older Articles</a></p>
   </section><!-- #main-content end -->
@@ -30,8 +29,8 @@ <section class="span4" id="secondary-content">
   <span class="featured">Popular Content</span>
   <%= render 'article_box', :item => popular[0], :classes => "hyphenate", :extended => true %>
   <%= render 'article_box', :item => popular[1], :classes => "hyphenate", :extended => false %>
-  <%= render 'article_box', :item => popular[3], :classes => "hyphenate", :extended => false %>
   <%= render 'article_box', :item => popular[2], :classes => "hyphenate", :extended => false %>
+  <%= render 'article_box', :item => popular[3], :classes => "hyphenate", :extended => false %>
   <%= render 'article_box', :item => popular[4], :classes => "hyphenate", :extended => false %>
   <%= render 'article_box', :item => popular[5], :classes => "hyphenate", :extended => false %>
   <%= render 'article_box', :item => popular[6], :classes => "hyphenate", :extended => false %>

@@ -2,9 +2,12 @@ /* Google Custom Search */
 
 
 $font-family: 'Crimson Text', Palatino, Bookman, Georgia, Times;
-$font-size: 19px;
+$font-size: 17px;
 $link-color: #BD3F00;
 $link-hover-color: #712600;
+
+
+/* Google Custom Search Engine */
 
 .gsc-resultsHeader, .gsc-trailing-more-results, 
 #search_results .gsc-url-top,
@@ -155,10 +158,3 @@ margin: 0 10px;
 		}
 	}
 }
-
-/* Kontactr */
-
-#kform label{
-  font-family: $font-family;
-  font-size: $font-size;
-}

@@ -11,9 +11,13 @@ 
 /* Bootstrap Overrides */
 
 article, #legacy-comments, #disqus_thread {
-  font-size: 19px;
+  font-size: 17px;
   line-height: 1.5em;
   color: #000;
+
+  p {
+    margin: 5px 0;
+  }
 
   li, dt, dd {
     line-height: 1.5em
@@ -89,6 +93,7 @@ 
 article.page > header h1 {
 	font-size: 2em;
   margin-top: -10px;
+  margin-bottom: 0;
 }
 
 #secondary-content > article h1{
@@ -122,8 +127,8 @@ font-style: italic;
 }
 
 article.page > header h2 {
-  margin-top: 0;
-  line-height: 1.1em;
+  margin: 0 0 1em 0;
+  line-height: 1em;
 }
 
 #body-text section section section header h1,

@@ -5,7 +5,7 @@ def:[h3rald.article|
 	article[
 		@head[
 			style[pagination.css]
-			style[../styles/style.css]
+			style[default.css]
       <style>
 .halftitlepage {
   margin: auto;

@@ -26,12 +26,15 @@ }
 		# Write the new raw file using Glyph's file_write method
 		Glyph.file_write f, doc
 		# Now compile the PDF (works if Prince is installed)
-      Glyph.debug_mode = true
-      Glyph.compile f.to_s
+    # Glyph.debug_mode = true
 		begin
+      puts "Generating PDF for '#{f}'..."
+      Glyph.compile f.to_s
 			f.unlink
-			#Pathname.new(f.to_s.gsub(/\.glyph$/, '.html')).unlink
-		rescue
+			Pathname.new(f.to_s.gsub(/\.glyph$/, '.html')).unlink
+      puts "Done."
+		rescue Exception => e
+      puts "Glyph Error: #{e.message}"
 		end
 	end
 

@@ -9,89 +9,6 @@ include SiteUtils
 
 namespace :site do
 
-	task :clean do
-		output = Pathname.new(Dir.pwd)/'output'
-		puts "Deleting all files in output dir..."
-		output.rmtree
-		(output/'data').mkpath
-	end
-
-	task :update => [:tags, :archives, :compile] do
-	end
-
-	task :compile do
-		system "nanoc3 co"
-	end
-
-	task :run do
-		system "nanoc3 aco -s thin"
-	end
-
-	task :rebuild => [:clean, :update] do
-	end
-
-	task :tags do
-		site = Nanoc3::Site.new('.')
-		dir = Pathname(Dir.pwd)/'content/tags'
-		tags = {}
-		# Collect tag and page data
-		site.items.each do |p|
-			next unless p.attributes[:tags]
-			p.attributes[:tags].each do |t|
-				if tags[t]
-					tags[t] = tags[t]+1
-				else
-					tags[t] = 1 
-				end
-			end
-		end
-		# Write pages
-		tags.each_pair do |k, v|
-			unless (dir/"#{k}.textile").exist? && (dir/"#{k}-rss.xml").exist? && (dir/"#{k}-atom.xml").exist? then
-				puts "Creating tag pages for '#{k}'"
-				write_tag_page dir, k, v 
-				write_tag_feed_page dir, k, 'RSS' 
-				write_tag_feed_page dir, k, 'Atom' 
-			end
-		end
-		# Remove unused tags
-		dir.children.each do |c|
-			t = c.basename.to_s.gsub /(-(rss|atom))?\..+$/, ''
-			unless tags[t] then
-				puts "Deleting unused tag page '#{c.basename}'"
-				c.delete 
-			end
-		end
-	end
-
-	task :archives do
-		site = Nanoc3::Site.new('.')
-		dir = Pathname(Dir.pwd)/'content/archives'
-		dir.rmtree if dir.exist?
-		dir.mkpath
-		m_articles = []
-		index = -1
-		current_month = ""
-		# Collect month and page data
-		articles = site.items.select{|p| p.attributes[:date] && p.attributes[:type] == 'article'}.sort{|a, b| a.attributes[:date] <=> b.attributes[:date]}.reverse 
-		articles.each do |a|
-			month = a.attributes[:date].strftime("%B %Y")
-			if current_month != month then
-				# new month
-				m_articles << [month, [a]]
-				index = index + 1
-				current_month = month
-			else
-				# same month
-				m_articles[index][1] << a
-			end
-		end
-		# Write pages
-		m_articles.each do |m|
-			write_archive_page dir, m[0], m[1].length
-		end
-	end
-
 	task :article, :name do |t, args|
 		raise RuntimeError, "Name not specified" unless args[:name]
 		raise RuntimeError, "Article name can only contain letters, numbers and dashes" unless args[:name].match /^[a-zA-Z0-9-]+$/
@@ -100,15 +17,14 @@ meta[:permalink] = args[:name]
 		meta[:title] = nil
 		meta[:subtitle] = nil
 		meta[:type] = 'article'
-		meta[:intro] = nil
-		meta[:extended_intro] = nil
+		meta[:intro] = " |\n  "
+		meta[:extended_intro] = " |\n  "
 		meta[:tags] = nil
 		meta[:date] = Time.now
-		meta[:toc] = true
 		meta[:pdf] = true
 		file = Pathname.new Dir.pwd/"content/articles/#{meta[:permalink]}.glyph"
 		raise "File '#{file}' already exists!" if file.exist?
-		write_item file, meta, ''
+		write_item file, meta, "$[document.intro]\n\n"
 	end
 
 	task :page, :name do |t, args|