1. Switched back to Rdiscount

2. Improved Blockquote comment header
3. Added Include File and Pullquote plugins
4. Improved blog typography
5. Simplified "Read more" link

Gemfile

@@ -2,7 +2,7 @@ source "http://rubygems.org"
 
 gem 'rake'
 gem 'jekyll'
-gem 'kramdown'
+gem 'rdiscount'
 gem 'RedCloth'
 gem 'haml', '>= 3.1'
 gem 'compass', '>= 0.11'

Gemfile.lock

@@ -18,12 +18,12 @@ GEM
       directory_watcher (>= 1.1.1)
       liquid (>= 1.9.0)
       maruku (>= 0.5.9)
-    kramdown (0.13.3)
     liquid (2.2.2)
     maruku (0.6.0)
       syntax (>= 1.0.0)
     rake (0.9.0)
     rb-fsevent (0.4.0)
+    rdiscount (1.6.8)
     rubypants (0.2.0)
     sass (3.1.2)
     syntax (1.0.0)
@@ -36,7 +36,7 @@ DEPENDENCIES
   compass (>= 0.11)
   haml (>= 3.1)
   jekyll
-  kramdown
   rake
   rb-fsevent
+  rdiscount
   rubypants

_config.yml

@@ -11,9 +11,10 @@ author: Your Name
 subscribe_rss: /atom.xml
 subscribe_email:
 
-markdown: kramdown
+markdown: rdiscount
 pygments: true
-recent_posts: 1
+posts_per_page: 10
+recent_posts: 5
 simple_search: http://google.com/search
 
 # Optional configurations

themes/classic/_plugins/blockquote.rb

@@ -2,9 +2,6 @@
 # Author: Brandon Mathis
 # Based on the work of: Josediaz Gonzalez - https://github.com/josegonzalez/josediazgonzalez.com/blob/master/_plugins/blockquote.rb
 #
-require './_plugins/titlecase.rb'
-module Jekyll
-
 # Outputs a string with a given attribution as a quote
 #
 #   {% blockquote Bobby Willis http://google.com/blah the search for bobby's mom %}
@@ -17,6 +14,9 @@ module Jekyll
 #     <strong>John Paul Jones</strong><cite><a href="http://google.com/blah">The Search For Bobby's Mom</a>
 #   </blockquote>
 #
+require './_plugins/titlecase.rb'
+module Jekyll
+
   class Blockquote < Liquid::Block
     FullCiteWithTitle = /([\w\s]+)(https?:\/\/)(\S+\s)([\w\s]+)/i
     FullCite = /([\w\s]+)(https?:\/\/)(\S+)/i

themes/classic/_plugins/custom_filters.rb

@@ -1,11 +1,16 @@
 #custom filters for Octopress
 
 module OctopressFilters
-  def exerpt(input, url, url_text="Reade more…", permalink_text=false)
+  def auto_exerpt(input, url, url_text="Read more …")
     if input.index(/<!--\s?more\s?-->/i)
-      input.split(/<!--\s?more\s?-->/i)[0] + "<p><a href='#{url}'>#{url_text}</a></p>"
+      input.split(/<!--\s?more\s?-->/i)[0] + "<p><a rel='full-article' href='#{url}'>#{url_text}</a></p>"
-    elsif permalink_text
+    else
-      input + "<p><a href='#{url}'>#{permalink_text}</a></p>"
+      input
+    end
+  end
+  def exerpt(input)
+    if input.index(/<!--\s*more\s*-->/i)
+      input.split(/<!--\s*more\s*-->/i)[0]
     else
       input
     end
@@ -35,7 +40,7 @@ module OctopressFilters
   end
   def ordinalize(date)
     date = datetime(date)
-    "#{date.strftime('%B')} #{ordinal(date.strftime('%e').to_i)}, #{date.strftime('%Y')}"
+    "#{date.strftime('%b')} #{ordinal(date.strftime('%e').to_i)}, #{date.strftime('%Y')}"
   end
   def ordinal(number)
     if (11..13).include?(number.to_i % 100)
@@ -56,4 +61,3 @@ module OctopressFilters
   end
 end
 Liquid::Template.register_filter OctopressFilters
-

themes/classic/_plugins/include_file.rb

@@ -0,0 +1,31 @@
+require 'pathname'
+
+module Jekyll
+
+  class IncludePartialTag < Liquid::Tag
+    def initialize(tag_name, file, tokens)
+      super
+      @file = file.strip
+    end
+
+    def render(context)
+      file_dir = (context.registers[:site].source || 'source')
+      file_path = Pathname.new(file_dir).expand_path
+      file = file_path + @file
+
+      unless file.file?
+        return "File #{file} could not be found"
+      end
+
+      Dir.chdir(file_path) do
+        partial = Liquid::Template.parse(file.read)
+        context.stack do
+          partial.render(context)
+        end
+      end
+    end
+  end
+end
+
+Liquid::Template.register_tag('include_partial', Jekyll::IncludePartialTag)
+

themes/classic/_plugins/pullquote.rb

@@ -0,0 +1,42 @@
+#
+# Author: Brandon Mathis
+# Based on the sematic pullquote technique by Maykel Loomans at http://miekd.com/articles/pull-quotes-with-html5-and-css/
+#
+# Outputs a span with a data-pullquote attribute set from the marked pullquote. Example:
+#
+#   {% pullquote %}
+#     When writing longform posts, I find it helpful to include pullquotes, which help those scanning a post discern whether or not a post is helpful.
+#     It is important to note, {" pullquotes are merely visual in presentation and should not appear twice in the text. "} That is why it is prefered
+#     to use a CSS only technique for styling pullquotes.
+#   {% endpullquote %}
+#   ...will output...
+#   <p>
+#     <span data-pullquote="pullquotes are merely visual in presentation and should not appear twice in the text.">
+#       When writing longform posts, I find it helpful to include pullquotes, which help those scanning a post discern whether or not a post is helpful.
+#       It is important to note, pullquotes are merely visual in presentation and should not appear twice in the text. This is why a CSS only approach #       for styling pullquotes is prefered.
+#     </span>
+#   </p>
+#
+
+module Jekyll
+
+  class PullquoteTag < Liquid::Block
+    PullQuoteMarkup = /\{(.+)\}/i
+
+    def initialize(tag_name, markup, tokens)
+      super
+    end
+
+    def render(context)
+      output = super
+      if output.join =~ /\{"\s*(.+)\s*"\}/
+        @quote = $1
+        "<span class='has-pullquote' data-pullquote='#{@quote}'>#{output.join.gsub(/\{"\s*|\s*"\}/, '')}</span>"
+      else
+        return "Surround your pullquote like this {! text to be quoted !}"
+      end
+    end
+  end
+end
+
+Liquid::Template.register_tag('pullquote', Jekyll::PullquoteTag)

themes/classic/sass/default/core/_typography.scss

@@ -31,8 +31,11 @@ body {
 }
 h1 {
   font-size: 3.2em;
-  line-height: 1.2em
+  line-height: 1.2em;
+  @media only screen and (max-width: 768px) { font-size: 2.2em; }
 }
+
+
 h2, section h1 {
   font-size: 1.5em;
 }
@@ -116,3 +119,24 @@ blockquote {
     a { font-style: italic; }
   }
 }
+
+.has-pullquote:before {
+  /* Reset metrics. */
+  padding: 0;
+  border: none;
+
+  /* Content */
+  content: attr(data-pullquote);
+
+  /* Pull out to the right, modular scale based margins. */
+  float: right;
+  width: 45%;
+  margin: 1em 0 1em 1.5em;
+
+  /* Baseline correction */
+  position: relative;
+  top: 6px;
+  font-size: 1.4em;
+  line-height: 1.45em;
+}
+

themes/classic/sass/default/partials/_blog.scss

@@ -14,16 +14,17 @@ $border: inline-image('dotted-border.png');
         padding-top: 0;
       }
     }
-    .byline + time:before, .byline + time +time:before {
+    time + .byline:before, .byline + time +time:before {
       content: "\2022 ";
       padding: 0 .3em 0 .2em;
       display: inline-block;
       @include opacity(.5);
     }
     header {
+      position: relative;
       padding-top: 2em;
       margin-bottom: 1.5em;
-      padding-bottom: 1.5em;
+      padding-bottom: 1em;
       background: $border bottom left repeat-x;
       h1 {
         margin: 0;
@@ -33,11 +34,24 @@ $border: inline-image('dotted-border.png');
       p {
         font-size: .9em;
         color: $type-color-light;
-        border: none;
-        padding-top: 0;
         margin: 0;
-        font-style: italic;
         @extend .sans;
+        &.meta {
+          text-transform: uppercase;
+          position: absolute;
+          top: 0;
+        }
+      }
+      @media only screen and (max-width: 768px) {
+        padding-bottom: 1em;
+        margin-bottom: 1em;
+        background: $border bottom left repeat-x;
+        p.meta { position: static; }
+      }
+
+      &.feature h1 {
+        font-size: 2.0em; font-style: italic;
+        line-height: 1.3em;
       }
     }
     .entry-content {
@@ -66,23 +80,33 @@ $border: inline-image('dotted-border.png');
         }
       }
     }
-    header.feature h1 {
-      font-size: 2.0em; font-style: italic;
-      line-height: 1.3em;
-    }
     #disqus_thread { }
-    .meta {
-      border-bottom: 1px dashed #dddddd;
-      text-transform: uppercase;
-      color: #777777;
-      padding: 8px 0 5px;
-      margin-bottom: 1.5em;
-      font-size: 75%;
-      letter-spacing: 1px;
-    }
 
-    .footer {
+    footer {
       padding-top: 15px;
+      time, .author { color: $light-text; }
+    }
+  }
+}
+article + article {
+  background: $border top left repeat-x;
+}
+#articles.blog-index {
+  article header { background: none; padding-bottom: 0; }
+  article h1 {
+    font-size: 2.2em;
+    a { color: inherit; &:hover{ color: $link-color-hover; } }
+  }
+  a[rel=full-article] {
+    background: darken($main-bg, 5);
+    display: inline-block;
+    padding: .4em .8em;
+    margin-right: .5em;
+    text-decoration: none;
+    @include transition(background-color, .5s);
+    &:hover {
+      background: $link-color-hover;
+      color: $main-bg;
     }
   }
 }

themes/classic/sass/default/partials/_syntax.scss

@@ -60,6 +60,7 @@ pre {
   margin-bottom: 1.5em;
   padding: .4em .8em;
   color: #555;
+  overflow: auto;
 }
 
 p code {

themes/classic/source/_includes/article.html

@@ -10,22 +10,19 @@
     {% else %}
       <h1 class="entry-title">{{ page.title | titlecase }}</h1>
     {% endif %}
-    {% unless page.no_meta %}
+    {% unless page.no_meta or !index %}<p class="meta">{% include post_meta.html %}</p>{% endunless %}
-      <p>
-        {% if page.date %}
-          <time datetime="{{ page.date | datetime }}" pubdate {% if page.updated %} updated {% endif %}>{{ page.date | ordinalize }}</time>
-        {% endif %}
-        {% if page.updated %}
-          <time class="updated" datetime="{{ page.updated | datetime }}"></time>
-        {% endif %}
-        {% if author %}<span class="byline author vcard">By <span class="fn">{{ author }}</span></span>{% endif %}
-      </p>
-    {% endunless %}
   </header>
 {% endunless %}
 {% if index %}
-<div class="entry-content">{{ content | exerpt(content, page.url, 'Continue reading &raquo;') | smart_quotes }}</div>
+<div class="entry-content">{{ content | exerpt | smart_quotes }}</div>
+<footer>
+  <p>
+  {% if content contains "<!-- more -->" or content contains "<!--more-->" %}
+    <a rel="full-article" href="{{ page.url }}">Read more &hellip;</a>
+  {% endif %}
+  {% include post_meta.html %}
+  </p>
+</footer>
 {% else %}
 <div class="entry-content">{{ content | smart_quotes }}</div>
 {% endif %}
-

themes/classic/source/_includes/post_meta.html

@@ -0,0 +1,7 @@
+{% if page.date %}
+<time datetime="{{ page.date | datetime }}" pubdate {% if page.updated %} updated {% endif %}>{{ page.date | ordinalize }}</time>
+{% endif %}
+{% if page.updated %}
+<time class="updated" datetime="{{ page.updated | datetime }}"></time>
+{% endif %}
+{% if author %}<span class="byline author vcard"><span class="fn">{{ author }}</span></span>{% endif %}

themes/classic/source/_layouts/default.html

@@ -4,7 +4,7 @@
   <nav>{% include navigation.html %}</nav>
   <div>
     <div>
-      <div id="articles">{{ content }}</div>
+      <div id="articles" {% if page.blog_index %} class="blog-index" {% endif %}>{{ content }}</div>
       {% unless page.sidebar == 'none' %}
         <aside>{% include sidebar.html %}</aside>
       {% endunless %}

themes/classic/source/index.html

@@ -1,9 +1,10 @@
 ---
 layout: default
+blog_index: true
 ---
-{% for page in site.posts limit:3 %}
-{% assign content = page.content %}
 {% assign index = true %}
+{% for page in site.posts limit:site.posts_per_page %}
+{% assign content = page.content %}
   <article>
     {% include article.html %}
   </article>