From 353ccfd4ebec153a46b12faffff8ab2bba36efc8 Mon Sep 17 00:00:00 2001 From: Brandon Mathis Date: Mon, 27 Jun 2011 15:59:21 -0400 Subject: 1. Added Category support 2. Designed blog archives pages 3. Restructured Sass 4. Added Categories to rake post metadata 5. Some general style improvements --- Rakefile | 1 + _config.yml | 1 + themes/classic/_plugins/category.rb | 65 --------- themes/classic/_plugins/custom_filters.rb | 36 +++-- themes/classic/sass/core/_layout.scss | 134 ------------------ themes/classic/sass/core/_theme.scss | 71 ---------- themes/classic/sass/core/_typography.scss | 130 ------------------ themes/classic/sass/core/_utilities.scss | 21 --- themes/classic/sass/partials/_blog.scss | 164 +++++++++++------------ themes/classic/sass/partials/_delicious.scss | 4 - themes/classic/sass/partials/_footer.scss | 2 +- themes/classic/sass/partials/_header.scss | 2 +- themes/classic/sass/partials/_navigation.scss | 9 +- themes/classic/sass/partials/_page.scss | 6 +- themes/classic/sass/partials/_pinboard.scss | 12 -- themes/classic/sass/partials/_sidebar.scss | 63 +-------- themes/classic/sass/partials/_solarized.scss | 16 --- themes/classic/sass/partials/_syntax.scss | 13 +- themes/classic/sass/partials/_twitter.scss | 33 ----- themes/classic/sass/screen.scss | 16 +-- themes/classic/source/_includes/article.html | 7 +- themes/classic/source/_includes/navigation.html | 4 +- themes/classic/source/_includes/post_author.html | 4 +- themes/classic/source/_includes/post_date.html | 12 +- themes/classic/source/_layouts/post.html | 3 + themes/classic/source/archive.html | 24 ---- themes/classic/source/index.html | 4 +- 27 files changed, 149 insertions(+), 708 deletions(-) delete mode 100644 themes/classic/_plugins/category.rb delete mode 100644 themes/classic/sass/core/_layout.scss delete mode 100644 themes/classic/sass/core/_theme.scss delete mode 100644 themes/classic/sass/core/_typography.scss delete mode 100644 themes/classic/sass/core/_utilities.scss delete mode 100644 themes/classic/sass/partials/_delicious.scss delete mode 100644 themes/classic/sass/partials/_pinboard.scss delete mode 100644 themes/classic/sass/partials/_solarized.scss delete mode 100644 themes/classic/sass/partials/_twitter.scss delete mode 100644 themes/classic/source/archive.html diff --git a/Rakefile b/Rakefile index 2d877db1..f3903a95 100644 --- a/Rakefile +++ b/Rakefile @@ -61,6 +61,7 @@ task :post, :filename do |t, args| post.puts "title: #{args.filename.gsub(/[-_]/, ' ').titlecase}" post.puts "date: #{Time.now.strftime('%Y-%m-%d %H:%M')}" post.puts "layout: post" + post.puts "categories: []" post.puts "---" end end diff --git a/_config.yml b/_config.yml index 05a66f63..a9e14285 100644 --- a/_config.yml +++ b/_config.yml @@ -17,6 +17,7 @@ pygments: true #posts_per_page: 10 paginate: 5 recent_posts: 5 +category_dir: category simple_search: http://google.com/search # Optional configurations diff --git a/themes/classic/_plugins/category.rb b/themes/classic/_plugins/category.rb deleted file mode 100644 index b9accdec..00000000 --- a/themes/classic/_plugins/category.rb +++ /dev/null @@ -1,65 +0,0 @@ -module Jekyll - - class CategoryIndex < Page - def initialize(site, base, dir, category) - @site = site - @base = base - @dir = dir - @name = 'index.html' - - self.process(@name) - self.read_yaml(File.join(base, '_layouts'), 'category_index.html') - self.data['category'] = category - - category_title_prefix = site.config['category_title_prefix'] || 'Category: ' - self.data['title'] = "#{category_title_prefix}#{category}" - end - end - - class CategoryList < Page - def initialize(site, base, dir, categories) - @site = site - @base = base - @dir = dir - @name = 'index.html' - - self.process(@name) - self.read_yaml(File.join(base, '_layouts'), 'category_list.html') - self.data['categories'] = categories - end - end - - class CategoryGenerator < Generator - safe true - - def generate(site) - if site.layouts.key? 'category_index' - dir = site.config['category_dir'] || 'categories' - site.categories.keys.each do |category| - write_category_index(site, File.join(dir, category.gsub(/\s/, "-").gsub(/[^\w-]/, '').downcase), category) - end - end - - if site.layouts.key? 'category_list' - dir = site.config['category_dir'] || 'categories' - write_category_list(site, dir, site.categories.keys.sort) - end - end - - def write_category_index(site, dir, category) - index = CategoryIndex.new(site, site.source, dir, category) - index.render(site.layouts, site.site_payload) - index.write(site.dest) - site.static_files << index - end - - def write_category_list(site, dir, categories) - index = CategoryList.new(site, site.source, dir, categories) - index.render(site.layouts, site.site_payload) - index.write(site.dest) - site.static_files << index - end - end - -end - diff --git a/themes/classic/_plugins/custom_filters.rb b/themes/classic/_plugins/custom_filters.rb index d1fce0dd..f0db30ee 100644 --- a/themes/classic/_plugins/custom_filters.rb +++ b/themes/classic/_plugins/custom_filters.rb @@ -1,47 +1,64 @@ #custom filters for Octopress module OctopressFilters - def auto_exerpt(input, url, url_text="Read more …") - if input.index(//i) - input.split(//i)[0] + "

#{url_text}

" + # Used on the blog index to split posts on the marker + def exerpt(input) + if input.index(//i) + input.split(//i)[0] else input end end - def exerpt(input) - if input.index(//i) - input.split(//i)[0] + + # Summary is used on the Archive pages to return the first block of content from a post. + def summary(input) + if input.index(/\n\n/) + input.split(/\n\n/)[0] else input end end + + # Replaces relative urls with full urls def full_urls(input, url='') input.gsub /(\s+(href|src)\s*=\s*["|']{1})(\/[^\"'>]+)/ do $1+url+$3 end end + + # Returns a url without the http:// for use in as a search modifier eg. 'search terms site:website.com' def search_url(input) - input.gsub /(http:\/\/)(\S+)/ do + input.gsub /(https?:\/\/)(\S+)/ do $2 end end + + # replaces primes with smartquotes using RubyPants def smart_quotes(input) require 'rubypants' RubyPants.new(input).to_html end + + # Returns a title cased string based on John Gruber's title case http://daringfireball.net/2008/08/title_case_update def titlecase(input) input.titlecase end + + # Returns a datetime if the input is a string def datetime(date) if date.class == String date = Time.parse(date) end date end + + # Returns an ordidinal date eg July 22 2007 -> July 22nd 2007 def ordinalize(date) date = datetime(date) "#{date.strftime('%b')} #{ordinal(date.strftime('%e').to_i)}, #{date.strftime('%Y')}" end + + # Returns an ordinal number. 13 -> 13th, 21 -> 21st etc. def ordinal(number) if (11..13).include?(number.to_i % 100) "#{number}th" @@ -54,10 +71,5 @@ module OctopressFilters end end end - #YearlyPost = Struct.new('YearlyPost', :year, :posts) - def yearly_posts(site) - #site.posts.reverse.group_by { |p| p.date.strftime("%Y") }.map { |k,v| YearlyPost.new(k,v) } - site - end end Liquid::Template.register_filter OctopressFilters diff --git a/themes/classic/sass/core/_layout.scss b/themes/classic/sass/core/_layout.scss deleted file mode 100644 index b24e1b29..00000000 --- a/themes/classic/sass/core/_layout.scss +++ /dev/null @@ -1,134 +0,0 @@ -$max-width: 1200px !default; - -// Padding used for layout margins -$pad-min: 18px !default; -$pad-narrow: 25px !default; -$pad-medium: 35px !default; -$pad-wide: 55px !default; - -// Sidebar widths used in media queries -$sidebar-width-medium: 240px !default; -$sidebar-pad-medium: 15px !default; -$sidebar-pad-wide: 20px !default; -$sidebar-width-wide: 300px !default; - -.group { @include pie-clearfix; } - -body { - -webkit-text-size-adjust: none; - max-width: $max-width; - position: relative; - margin: 0 auto; - > header, > nav, > footer, #articles > article, #articles > nav { - @extend .group; - padding-left: $pad-min; - padding-right: $pad-min; - @media only screen and (min-width: 480px) { - padding-left: $pad-narrow; - padding-right: $pad-narrow; - } - @media only screen and (min-width: 768px) { - padding-left: $pad-medium; - padding-right: $pad-medium; - } - @media only screen and (min-width: 992px) { - padding-left: $pad-wide; - padding-right: $pad-wide; - } - } - > header { - font-size: 1em; - padding-top: 1.5em; - padding-bottom: 1.5em; - } -} - -.toggle-sidebar { display: none; } -#articles { width: 100%; - + aside { - float: none; - padding: 0 $pad-min 1px; - background-color: $sidebar-bg; - border-top: 1px solid $sidebar-border; - } -} - -@media only screen and (min-width: 550px) { - body > header { font-size: 1em; } -} -@media only screen and (min-width: 768px) { - body { -webkit-text-size-adjust: auto; } - body > header { font-size: 1.2em; } - body > nav { - + div { - @extend .group; - padding: 0; - margin: 0 auto; - > div { - @extend .group; - margin-right: $sidebar-width-medium; - } - } - } - #articles { - padding-top: $pad-medium/2; - padding-bottom: $pad-medium/2; - float: left; - + aside { - width: $sidebar-width-medium - $sidebar-pad-medium*2; - padding: 0 $sidebar-pad-medium $sidebar-pad-medium; - background: none; - float: left; - margin: 0 -100% 0 0; - } - } - body > div > div { position: relative; } - - .collapse-sidebar { - > div > div { margin-right: 10px; } - #articles + aside { - display: none; - } - .toggle-sidebar { - right: -1px; - background-color: $sidebar-bg; - border-right-width: 0; - text-indent: 2px; - border-left: 1px solid $sidebar-border; - @include border-bottom-right-radius(0); - @include border-bottom-left-radius(.3em); - @include link-colors(#aaa, #888); - } - } - - .toggle-sidebar { - outline: none; - position: absolute; right: -21px; top: 0; - width: 20px; - font-size: 1.2em; - line-height: 1.1em; - padding-bottom: .1em; - text-indent: -1px; - text-decoration: none; - @include link-colors(#ccc, #999); - @include border-bottom-right-radius(.3em); - text-align: center; - background: $main-bg; - border-bottom: 1px solid $sidebar-border; - border-right: 1px solid $sidebar-border; - display: inline-block; - } -} - -@media only screen and (min-width: 992px) { - body > header { font-size: 1.3em; } - body > nav + div > div { margin-right: $sidebar-width-wide; } - #articles { - padding-top: $pad-wide/2; - padding-bottom: $pad-wide/2; - + aside { - width: $sidebar-width-wide - $sidebar-pad-wide*2; - padding: 1.2em $sidebar-pad-wide $sidebar-pad-wide; - } - } -} diff --git a/themes/classic/sass/core/_theme.scss b/themes/classic/sass/core/_theme.scss deleted file mode 100644 index 7aac67e4..00000000 --- a/themes/classic/sass/core/_theme.scss +++ /dev/null @@ -1,71 +0,0 @@ -// Main Link Colors -$link-color: lighten(#165b94, 3) !default; -$link-color-hover: adjust-hue($link-color, -200) !default; -$link-color-visited: darken(adjust_hue($link_color, 70), 10) !default; -$link-color-active: darken($link-color-hover, 15) !default; - -// Main Section Colors -$page-bg: #252525 !default; -$article-border: #eeeeee !default; -$main-bg: #f5f5f5 !default; - -$header-bg: #333 !default; -$header-border: lighten($header-bg, 15) !default; -$title-color: #f2f2f2 !default; -$subtitle-color: #aaa !default; - -$text-color: #222 !default; -$text-color-light: #aaa !default; -$type-border: #ddd !default; - - -/* Navigation */ -$nav-bg: #ccc !default; -$nav-color: darken($nav-bg, 38) !default; -$nav-color-hover: darken($nav-color, 25) !default; -$nav-placeholder: desaturate(darken($nav-bg, 10), 15) !default; -$nav-border: darken($nav-bg, 10) !default; -$nav-border-top: lighten($nav-bg, 15) !default; -$nav-border-bottom: darken($nav-bg, 25) !default; -$nav-border-left: darken($nav-bg, 11) !default; -$nav-border-right: lighten($nav-bg, 7) !default; - -/* Sidebar colors */ -$sidebar-bg: #eee !default; -$sidebar-link-color: $link-color !default; -$sidebar-link-color-hover: $link-color-hover !default; -$sidebar-color: change-color(mix($text-color, $sidebar-bg, 80), $hue: hue($sidebar-bg), $saturation: saturation($sidebar-bg)/2) !default; -$sidebar-border: desaturate(darken($sidebar-bg, 7), 10) !default; -$sidebar-border: darken($sidebar-bg, 7) !default; -$sidebar-link-color-subdued: lighten($sidebar-color, 20) !default; -$sidebar-link-color-subdued-hover: $sidebar-link-color-hover !default; -$twitter-status-link: lighten($sidebar-link-color-subdued, 15) !default; - -$footer-color: #999999 !default; -$footer-bg: #ccc !default; -$footer-color: darken($footer-bg, 38) !default; -$footer-color-hover: darken($footer-color, 10) !default; -$footer-border-top: lighten($footer-bg, 15) !default; -$footer-border-bottom: darken($footer-bg, 15) !default; -$footer-link-color: darken($footer-bg, 38) !default; -$footer-link-color-hover: darken($footer-color, 25) !default; -$page-border-bottom: darken($footer-bg, 5) !default; - -// Form Colors -$fieldset-bg: #ececec; -$fieldset-border: #c3c3c3; - -$textinput-color: #333333; -$textinput-bg: #f4f4f4; -$textinput-bg-focus: #fefeee; - -$textinput-border-top: #aaaaaa; -$textinput-border-bottom: #c6c6c6; -$textinput-border-left: #c3c3c3; -$textinput-border-right: #c3c3c3; -$textinput-border-focus: #989898; - -#articles a, #articles + aside a { - @include link-colors($link-color, $hover: $link-color-hover, $focus: $link-color-hover, $visited: $link-color-visited, $active: $link-color-active); -} -a { @include transition(color, .5s); } diff --git a/themes/classic/sass/core/_typography.scss b/themes/classic/sass/core/_typography.scss deleted file mode 100644 index 8ab0e657..00000000 --- a/themes/classic/sass/core/_typography.scss +++ /dev/null @@ -1,130 +0,0 @@ -$blockquote: $type-border !default; -$mono: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace; - -// Fonts -.heading { - font-family: "PT Serif", "Georgia", "Helvetica Neue", Arial, sans-serif; -} -.sans { font-family: "PT Sans", "Helvetica Neue", Arial, sans-serif; } -.serif { font-family: "PT Serif", Georgia, Times, "Times New Roman", serif; } -.mono { font-family: $mono; } - -body > header h1 { - font-size: 2.6em; - @extend .heading; - font-weight: normal; - line-height: 1.2em; - margin-bottom: 0.6667em; -} - -body { - line-height: 1.5em; - color: $text-color; - @extend .serif; -} - -#{headings()}{ - @extend .heading; - text-rendering: optimizelegibility; - margin-bottom: 1em; - font-weight: bold; -} -h1 { - font-size: 3.2em; - line-height: 1.2em; - @media only screen and (max-width: 768px) { font-size: 2.2em; } -} - - -h2, section h1 { - font-size: 1.5em; -} -h3, section h2, section section h1 { - font-size: 1.3em; -} -h4, section h3, section section h2, section section section h1 { - font-size: 1em; -} -h5, section h4, section section h3 { - font-size: .9em; -} -h6, section h5, section section h4, section section section h3 { - font-size: .8em; -} -p, blockquote, ul, ol { margin-bottom: 1.5em; } - -ul{ list-style-type: circle; } - -ol{ list-style-type: decimal; ol { list-style-type: lower-alpha; } } -ul ul, ol ol { margin-left: 1.75em; } - -strong { font-weight: bold; } - -em { font-style: italic; } - -sup, sub { font-size: 0.8em; position: relative; display: inline-block; } -sup { top: -.5em; } -sub { bottom: -.5em; } - -q { font-style: italic; - &:before { content: "\201C"; } - &:after { content: "\201D"; } -} - -em, dfn { font-style: italic; } - -strong, dfn { font-weight: bold; } - -del, s { text-decoration: line-through; } - -abbr, acronym { border-bottom: 1px dotted; cursor: help; } - -pre, code, tt { @extend .mono-font; } - -sub, sup { line-height: 0; } - -hr { margin-bottom: 0.2em; } - -small { font-size: .8em; } - -big { font-size: 1.2em; } - -blockquote { - $bq-margin: 1.2em; - font-style: italic; - position: relative; - font-size: 1.2em; - line-height: 1.5em; - padding-left: 1em; - border-left: 4px solid rgba($text-color-light, .5); - cite { - font-style: italic; - a { color: $text-color-light !important; word-wrap: break-word; } - &:before { content: '–'; padding:{right: .3em; left: .3em;} color: $text-color-light; } - } - @media only screen and (min-width: 992px) { - padding-left: 1.5em; - border-left-width: 4px; - } -} - -.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: .5em 0 1em 1.5em; - - /* Baseline correction */ - position: relative; - top: 7px; - font-size: 1.4em; - line-height: 1.45em; -} - diff --git a/themes/classic/sass/core/_utilities.scss b/themes/classic/sass/core/_utilities.scss deleted file mode 100644 index 8b718cdc..00000000 --- a/themes/classic/sass/core/_utilities.scss +++ /dev/null @@ -1,21 +0,0 @@ -@mixin mask-image($img, $repeat: no-repeat){ - @include experimental(mask-image, image-url($img), -webkit, -moz, -o, -ms); - @include experimental(mask-repeat, $repeat, -webkit, -moz, -o, -ms); - width: image-width($img); - height: image-height($img); -} - -@mixin selection($bg, $color: inherit, $text-shadow: none){ - * { - &::-moz-selection { background: $bg; color: $color; text-shadow: $text-shadow; } - &::-webkit-selection { background: $bg; color: $color; text-shadow: $text-shadow; } - &::selection { background: $bg; color: $color; text-shadow: $text-shadow; } - } -} - -@function text-color($color, $dark: dark, $light: light){ - $text-color: ( (red($color)*299) + (green($color)*587) + (blue($color)*114) ) / 1000; - $text-color: if($text-color >= 150, $dark, $light); - @return $text-color; -} - diff --git a/themes/classic/sass/partials/_blog.scss b/themes/classic/sass/partials/_blog.scss index 12f596a1..0cf11ae8 100644 --- a/themes/classic/sass/partials/_blog.scss +++ b/themes/classic/sass/partials/_blog.scss @@ -1,111 +1,107 @@ -$border: inline-image('dotted-border.png'); #articles { overflow: hidden; - @media only screen and (max-width: 768px) { - ul, ol { margin-left: 1.4em; } + ul, ol { margin-left: 1.4em; } + @media only screen and (min-width: 768px) { + ul, ol { margin-left: 0; } } > article { padding-bottom: 1em; - &:last-child { margin-bottom: 0; border-bottom: none; } + &:last-child { margin-bottom: 0; } h2 { padding-top: 0.8em; - background: $border top left repeat-x; - &:first-child { - background: none; - padding-top: 0; - } + background: $img-border top left repeat-x; + &:first-child { background: none; padding-top: 0; } } - .byline + time:before, time +time:before, .comments:before { + .byline + time:before, time +time:before, .comments:before, .byline ~ .categories:before { @extend .separator; } - header { - position: relative; - padding-top: 2em; - margin-bottom: 1.5em; - padding-bottom: 1em; - background: $border bottom left repeat-x; - h1 { - margin: 0; - a { text-decoration: none; - &:hover { text-decoration: underline; } } - } - p { - font-size: .9em; - color: $text-color-light; - margin: 0; - @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; } + } + header { + position: relative; + padding-top: 2em; + padding-bottom: 1em; + margin-bottom: 1em; + background: $img-border bottom left repeat-x; + h1 { + margin: 0; + a { text-decoration: none; + &:hover { text-decoration: underline; } } + } + p { + font-size: .9em; + color: $text-color-light; + margin: 0; + @extend .sans; + &.meta { + text-transform: uppercase; } } - h1.feature { - padding-top: .5em; - margin-bottom: 1em; + @media only screen and (min-width: 768px) { + margin-bottom: 1.5em; padding-bottom: 1em; - background: $border bottom left repeat-x; - font-size: 2.0em; font-style: italic; - line-height: 1.3em; + background: $img-border bottom left repeat-x; + p.meta { position: absolute; top: 0; } } - .entry-content { - img, video { max-width: 100%; height: auto; } - video { - width: 100%; display: block; margin-bottom: 1.5em; - padding: .8em; background: #fff; border: 1px solid #eee; - @include box-sizing(border-box); - } - .flash-video { - max-width: 100%; - margin-bottom: 1.5em; - @include box-sizing(border-box); - padding: .8em; background: #fff; border: 1px solid #eee; - > div { - position: relative; - display: block; - padding-bottom: 56.25%; - padding-top: 1px; - height: 0; - overflow: hidden; - iframe, object, embed { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - } - } - } + } + h1.feature { + padding-top: .5em; + margin-bottom: 1em; + padding-bottom: 1em; + background: $img-border bottom left repeat-x; + font-size: 2.0em; font-style: italic; + line-height: 1.3em; + } + .entry-content { + img, video { max-width: 100%; height: auto; } + video { + width: 100%; display: block; margin-bottom: 1.5em; + padding: .8em; background: #fff; border: 1px solid #eee; + @include box-sizing(border-box); } - iframe.twitter-share-button { + } + .flash-video { + max-width: 100%; + margin-bottom: 1.5em; + @include box-sizing(border-box); + padding: .8em; background: #fff; border: 1px solid #eee; + > div { position: relative; - top: .3em; - padding-left: .5em; - } - > footer { - margin-top: 2em; - padding-top: 1em; - margin-bottom: 1.5em; - background: $border top left repeat-x; - time, .author { color: $text-color-light; @extend .sans; } + display: block; + padding-bottom: 56.25%; + padding-top: 1px; + height: 0; + overflow: hidden; + iframe, object, embed { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + } } } + iframe.twitter-share-button { + position: relative; + top: .3em; + padding-left: .5em; + } + > article > footer { + margin-top: 2em; + padding-top: 1em; + margin-bottom: 1.5em; + background: $img-border top left repeat-x; + @extend .sans; + } + } article + article { - background: $border top left repeat-x; + background: $img-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 { color: inherit; &:hover { color: $link-color-hover; } } } a[rel=full-article] { background: darken($main-bg, 5); @@ -125,8 +121,6 @@ article + article { footer { @extend .sans; margin-top: 1em; - p.meta { color: $text-color-light; } - a { color: inherit; &:hover{ color: $link-color-hover;} } } } diff --git a/themes/classic/sass/partials/_delicious.scss b/themes/classic/sass/partials/_delicious.scss deleted file mode 100644 index e962702e..00000000 --- a/themes/classic/sass/partials/_delicious.scss +++ /dev/null @@ -1,4 +0,0 @@ -.delicious-posts { - a.delicious-link { margin-bottom: .5em; display: block; } - p { font-size: 1em; } -} diff --git a/themes/classic/sass/partials/_footer.scss b/themes/classic/sass/partials/_footer.scss index 019bc2a4..350c562d 100644 --- a/themes/classic/sass/partials/_footer.scss +++ b/themes/classic/sass/partials/_footer.scss @@ -4,7 +4,7 @@ body > footer { color: $footer-color; text-shadow: lighten($footer-bg, 5) 0 1px; background-color: $footer-bg; - @include background(linear-gradient(lighten($footer-bg, 8), $footer-bg, darken($footer-bg, 11))); + @include background(image-url('noise.png'), linear-gradient(lighten($footer-bg, 8), $footer-bg, darken($footer-bg, 11))); border-top: 1px solid $footer-border-top; position: relative; padding-top: 1em; diff --git a/themes/classic/sass/partials/_header.scss b/themes/classic/sass/partials/_header.scss index 9cc4601f..8ae128b1 100644 --- a/themes/classic/sass/partials/_header.scss +++ b/themes/classic/sass/partials/_header.scss @@ -1,5 +1,5 @@ body > header { - background-color: $header-bg; + background: $header-bg; h1 { display: inline-block; margin: 0; diff --git a/themes/classic/sass/partials/_navigation.scss b/themes/classic/sass/partials/_navigation.scss index 2fa17a1a..be132561 100644 --- a/themes/classic/sass/partials/_navigation.scss +++ b/themes/classic/sass/partials/_navigation.scss @@ -1,13 +1,12 @@ body > nav { position: relative; background-color: $nav-bg; - @include background(linear-gradient(lighten($nav-bg, 8), $nav-bg, darken($nav-bg, 11))); + @include background(image-url('noise.png'), linear-gradient(lighten($nav-bg, 8), $nav-bg, darken($nav-bg, 11))); border: { top: 1px solid $nav-border-top; bottom: 1px solid $nav-border-bottom; } padding-top: .35em; padding-bottom: .35em; - //position: absolute; left: 0; right: 0; top: 0; form { @include background-clip(padding-box); margin: 0; padding: 0; @@ -43,7 +42,7 @@ body > nav { @include horizontal-list(0); float: left; display: block; - padding-top: .25em; + padding-top: .15em; } ul[role=subscription] { margin-left: .8em; @@ -59,7 +58,7 @@ body > nav { text-shadow: lighten($nav-bg, 12) 0 1px; float: left; text-decoration: none; - font-size: 1em; + font-size: 1.1em; padding: .1em 0; line-height: 1.5em; } @@ -132,7 +131,7 @@ body > nav { } } } - ul[role=subscription] { li, a { border: 0; padding: 0; }} + ul[role=subscription] { position: relative; top: .2em; li, a { border: 0; padding: 0; }} a[rel=subscribe-rss]{ @include mask-subscription-nav('rss.png'); } a[rel=subscribe-email]{ @include mask-subscription-nav('email.png'); } } diff --git a/themes/classic/sass/partials/_page.scss b/themes/classic/sass/partials/_page.scss index 99a07ebc..d8ff5449 100644 --- a/themes/classic/sass/partials/_page.scss +++ b/themes/classic/sass/partials/_page.scss @@ -1,12 +1,12 @@ html { - background: $page-bg inline-image('line-tile.png') top left; + background: $page-bg image-url('line-tile.png') top left; } body { > div { - background-color: $sidebar-bg; + background: $sidebar-bg image-url('noise.png') top left; border-bottom: 1px solid $page-border-bottom; > div { - background-color: $main-bg; + background: $main-bg image-url('noise.png') top left; border-right: 1px solid $sidebar-border; } } diff --git a/themes/classic/sass/partials/_pinboard.scss b/themes/classic/sass/partials/_pinboard.scss deleted file mode 100644 index 9f9ab461..00000000 --- a/themes/classic/sass/partials/_pinboard.scss +++ /dev/null @@ -1,12 +0,0 @@ -#pinboard_linkroll { - .pin-title, .pin-description { - display: block; - margin-bottom: .5em; - } - .pin-tag { - @include hover-link; - @extend .aside-alt-link; - &:after { content: ','; } - &:last-child:after { content: ''; } - } -} diff --git a/themes/classic/sass/partials/_sidebar.scss b/themes/classic/sass/partials/_sidebar.scss index 8c38e2a6..ac790e04 100644 --- a/themes/classic/sass/partials/_sidebar.scss +++ b/themes/classic/sass/partials/_sidebar.scss @@ -1,59 +1,4 @@ -.side-shadow-border { - @include box-shadow(lighten($sidebar-bg, 5) 0 1px); -} -#articles + aside { - color: $sidebar-color; - padding-top: 1.2em; - text-shadow: lighten($sidebar-bg, 8) 0 1px; - section { - @extend .sans; - font-size: .8em; - line-height: 1.4em; - margin-bottom: 1.5em; - h1 { - margin: 1.5em 0 0; - padding-bottom: .2em; - border-bottom: 1px solid $sidebar-border; - @extend .side-shadow-border; - + p { - padding-top: .4em; - } - } - } - ul { - margin-bottom: 0.5em; - } - li { - list-style: none; - padding: .5em 0; - margin: 0; - border-bottom: 1px solid $sidebar-border; - @extend .side-shadow-border; - p:last-child { - margin-bottom: 0; - } - } - a { - color: inherit; - @include transition(color, .5s); - } - &:hover a, &:hover #tweets a { color: $sidebar-link-color; - &:hover { color: $sidebar-link-color-hover; } - } - #recent_posts { - time { - text-transform: uppercase; - font-size: .9em; - color: #666; - } - } - @import "twitter"; - @import "pinboard"; - @import "delicious"; -} -.aside-alt-link { - color: $sidebar-link-color-subdued; - &:hover { - color: $sidebar-link-color-subdued-hover; - } -} +@import "sidebar/base"; +@import "sidebar/twitter"; +@import "sidebar/pinboard"; +@import "sidebar/delicious"; diff --git a/themes/classic/sass/partials/_solarized.scss b/themes/classic/sass/partials/_solarized.scss deleted file mode 100644 index 4952120d..00000000 --- a/themes/classic/sass/partials/_solarized.scss +++ /dev/null @@ -1,16 +0,0 @@ -$base03: #002b36; //darkest blue -$base02: #073642; //dark blue -$base01: #586e75; //darkest gray -$base00: #657b83; //dark gray -$base0: #839496; //medium gray -$base1: #93a1a1; //medium light gray -$base2: #eee8d5; //cream -$base3: #fdf6e3; //white -$yellow: #b58900; -$orange: #cb4b16; -$red: #dc322f; -$magenta: #d33682; -$violet: #6c71c4; -$blue: #268bd2; -$cyan: #2aa198; -$green: #859900; diff --git a/themes/classic/sass/partials/_syntax.scss b/themes/classic/sass/partials/_syntax.scss index dc6472f2..b14b23bd 100644 --- a/themes/classic/sass/partials/_syntax.scss +++ b/themes/classic/sass/partials/_syntax.scss @@ -1,14 +1,16 @@ +$pre-bg: image-url('noise.png') top left; .highlight, html .gist .gist-file .gist-syntax .gist-highlight { .line-numbers { text-align: right; font-size: .8em; line-height: 1.45em; - background: $base02 !important; + background: $base02 $pre-bg !important; border-right: 1px solid darken($base03, 2) !important; @include box-shadow(lighten($base02, 2) -1px 0 inset); text-shadow: darken($base02, 10) 0 -1px; span { color: $base01 !important; } padding: .8em !important; + @include border-radius(0); } } html .gist .gist-file { @@ -30,7 +32,7 @@ html .gist .gist-file { border: 1px solid lighten($base02, 2) !important; color: $base01; font-size: .7em !important; - background: $base02; + background: $base02 $pre-bg; @extend .sans; line-height: 1.5em; a { @@ -51,14 +53,15 @@ html .gist .gist-file { } } pre { - background: #333; + background: $base03 $pre-bg; @include border-radius(.4em); @extend .mono; + border: 1px solid $base02; line-height: 1.45em; font-size: .8em; margin-bottom: 1.5em; padding: .8em 1em; - color: #ccc; + color: $base1; overflow: auto; } h3.filename { @@ -88,7 +91,7 @@ p code { padding: .8em !important; overflow-x: auto; line-height: 1.45em; - background: $base03 !important; + background: $base03 $pre-bg !important; color: $base1 !important; span { color: $base1 !important; } span { font-style: normal !important; font-weight: normal !important; } diff --git a/themes/classic/sass/partials/_twitter.scss b/themes/classic/sass/partials/_twitter.scss deleted file mode 100644 index 36c6f62b..00000000 --- a/themes/classic/sass/partials/_twitter.scss +++ /dev/null @@ -1,33 +0,0 @@ -#tweets { - .loading { - background: inline-image('bird_32_gray.png') no-repeat center .5em; - color: darken($sidebar-bg, 18); - text-shadow: $main-bg 0 1px; - text-align: center; - padding: 2.5em 0 .5em; - &.error { - background: inline-image('bird_32_gray_fail.png') no-repeat center .5em; - } - } - a { color: $sidebar-link-color-subdued; @include hover-link; } - p { - position: relative; - padding-right: 1em; - } - a[href*=status]{ - color: $twitter-status-link; - float: right; - padding: 0 0 .1em 1em; - position: relative; right: -1.3em; - text-shadow: #fff 0 1px; - font-size: .7em; - span { font-size: 1.5em; } - &:hover { - color: $sidebar-link-color-subdued-hover; - text-decoration: none; - } - } - a[href*='twitter.com/search']{ - @extend .aside-alt-link; - } -} diff --git a/themes/classic/sass/screen.scss b/themes/classic/sass/screen.scss index a26f08e2..f08da4c2 100644 --- a/themes/classic/sass/screen.scss +++ b/themes/classic/sass/screen.scss @@ -2,20 +2,8 @@ @include global-reset; @include reset-html5; -@import "core/utilities"; -@import "partials/solarized"; @import "custom/colors"; -@import "core/theme"; @import "custom/layout"; -@import "core/layout"; -@import "core/typography"; - -/* layout partials */ -@import "partials/header"; -@import "partials/navigation"; -@import "partials/page"; -@import "partials/sidebar"; -@import "partials/blog"; -@import "partials/footer"; -@import "partials/syntax"; +@import "base"; +@import "partials"; @import "custom/styles"; diff --git a/themes/classic/source/_includes/article.html b/themes/classic/source/_includes/article.html index 7ed6430f..b458d732 100644 --- a/themes/classic/source/_includes/article.html +++ b/themes/classic/source/_includes/article.html @@ -1,7 +1,7 @@ {% unless page.no_header %}
{% if index %} -

{{ page.title | titlecase }}

+

{{ post.title | titlecase }}

{% else %}

{{ page.title | titlecase }}

{% endif %} @@ -10,12 +10,13 @@ {% endunless %} {% if index %}
{{ content | exerpt | smart_quotes }}
-

Read on →

+

Read on →

{% include post_author.html %} {% include post_date.html %} - Add a comment + {% include post_categories.html %} + Comments {% include sharing.html %}

diff --git a/themes/classic/source/_includes/navigation.html b/themes/classic/source/_includes/navigation.html index f941f1f1..e2827983 100644 --- a/themes/classic/source/_includes/navigation.html +++ b/themes/classic/source/_includes/navigation.html @@ -11,6 +11,6 @@ diff --git a/themes/classic/source/_includes/post_author.html b/themes/classic/source/_includes/post_author.html index a62a68a8..b2db9043 100644 --- a/themes/classic/source/_includes/post_author.html +++ b/themes/classic/source/_includes/post_author.html @@ -1,5 +1,5 @@ -{% if page.author %} - {% assign author = page.author %} +{% if post.author %} + {% assign author = post.author %} {% else %} {% assign author = site.author %} {% endif %} diff --git a/themes/classic/source/_includes/post_date.html b/themes/classic/source/_includes/post_date.html index e8455a60..f1ed4815 100644 --- a/themes/classic/source/_includes/post_date.html +++ b/themes/classic/source/_includes/post_date.html @@ -1,6 +1,10 @@ -{% if page.date %} - +{% capture date %}{{ page.date }}{{ post.date }}{% endcapture %} +{% capture has_date %}{{ date | size }}{% endcapture %} +{% capture updated %}{{ page.updated }}{{ post.updated }}{% endcapture %} +{% capture was_updated %}{{ updated | size }}{% endcapture %} +{% if has_date != '0' %} + {% endif %} -{% if page.updated %} - +{% if was_updated != '0' %} + {% endif %} diff --git a/themes/classic/source/_layouts/post.html b/themes/classic/source/_layouts/post.html index 196bb4dd..5f55e89f 100644 --- a/themes/classic/source/_layouts/post.html +++ b/themes/classic/source/_layouts/post.html @@ -5,13 +5,16 @@ single: true
{% include article.html %} + {% unless page.no_meta %}

{% include post_author.html %} {% include post_date.html %} + {% include post_categories.html %} {% include sharing.html %}

+ {% endunless %} {% if site.disqus_short_name %}

Comments

diff --git a/themes/classic/source/archive.html b/themes/classic/source/archive.html deleted file mode 100644 index e49c6b67..00000000 --- a/themes/classic/source/archive.html +++ /dev/null @@ -1,24 +0,0 @@ ---- -layout: post -title: Blog Archive -no_meta: true ---- -{% for post in site.posts reverse %} - {% capture this_year %}{{ post.date | date: "%Y" }}{% endcapture %} - {% capture this_month %}{{ post.date | date: "%B" }}{% endcapture %} - {% unless year == this_year %} - {% unless forloop.first %}{% endunless %} - {% assign year = this_year %} -

{{ year }}

-
    - {% endunless %} - {% unless month == this_month %} - {% assign month = this_month %} -

  • {{ month }}

    • - {% endunless %} -
  • - - {{post.title}} -
    • - {% if forloop.last %}
{% endif %} -{% endfor %} diff --git a/themes/classic/source/index.html b/themes/classic/source/index.html index d6ff868e..47d848e3 100644 --- a/themes/classic/source/index.html +++ b/themes/classic/source/index.html @@ -3,8 +3,8 @@ layout: default blog_index: true --- {% assign index = true %} -{% for page in paginator.posts %} -{% assign content = page.content %} +{% for post in paginator.posts %} +{% assign content = post.content %}
{% include article.html %}
-- cgit v1.2.1