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
main
Brandon Mathis 14 years ago
parent 105ba14343
commit f77db80077

@ -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'

@ -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

@ -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

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

@ -1,11 +1,16 @@
#custom filters for Octopress
module OctopressFilters
def exerpt(input, url, url_text="Reade more&hellip;", permalink_text=false)
def auto_exerpt(input, url, url_text="Read more &hellip;")
if input.index(/<!--\s?more\s?-->/i)
input.split(/<!--\s?more\s?-->/i)[0] + "<p><a href='#{url}'>#{url_text}</a></p>"
elsif permalink_text
input + "<p><a href='#{url}'>#{permalink_text}</a></p>"
input.split(/<!--\s?more\s?-->/i)[0] + "<p><a rel='full-article' href='#{url}'>#{url_text}</a></p>"
else
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

@ -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)

@ -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)

@ -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;
}

@ -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;
}
}
}

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

@ -10,22 +10,19 @@
{% else %}
<h1 class="entry-title">{{ page.title | titlecase }}</h1>
{% endif %}
{% unless page.no_meta %}
<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 %}
{% unless page.no_meta or !index %}<p class="meta">{% include post_meta.html %}</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 %}

@ -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 %}

@ -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 %}

@ -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>

Loading…
Cancel
Save