From 21813059f255dcd338d4cc42aad51700126d6058 Mon Sep 17 00:00:00 2001 From: Brandon Mathis Date: Fri, 17 Jun 2011 22:24:48 -0400 Subject: 1. Replaced Rdiscount in favor of Kramdown (better html5 support) for markdown processing. 2. Added updated instructions to the README 3. Removed unused media css directories 4. Improved use of color variables for page theming. 5. Improved Typography and blog styling. 6. Added support for simple pre and code styles 7. Misc styling and markup improvements. --- Gemfile | 2 +- Gemfile.lock | 10 +- README.markdown | 137 +++++++++++--------- Rakefile | 15 ++- _config.yml | 8 +- themes/classic/sass/default/core/_layout.scss | 8 +- themes/classic/sass/default/core/_theme.scss | 44 ++++--- themes/classic/sass/default/core/_typography.scss | 14 +-- themes/classic/sass/default/media/_480.scss | 26 ---- themes/classic/sass/default/media/_768.scss | 8 -- themes/classic/sass/default/media/_992.scss | 19 --- themes/classic/sass/default/partials/_blog.scss | 12 +- themes/classic/sass/default/partials/_footer.scss | 8 +- themes/classic/sass/default/partials/_header.scss | 1 + themes/classic/sass/default/partials/_page.scss | 2 +- themes/classic/sass/default/partials/_sidebar.scss | 14 ++- themes/classic/sass/default/partials/_syntax.scss | 46 ++++--- themes/classic/sass/default/partials/_twitter.scss | 8 +- themes/classic/source/_includes/article.html | 38 +++--- themes/classic/source/_includes/header.html | 10 +- themes/classic/source/archive.html | 2 +- .../source/fonts/adellebasic_bold-webfont.eot | Bin 13694 -> 0 bytes .../source/fonts/adellebasic_bold-webfont.svg | 139 --------------------- .../source/fonts/adellebasic_bold-webfont.ttf | Bin 24072 -> 0 bytes .../source/fonts/adellebasic_bold-webfont.woff | Bin 15604 -> 0 bytes 25 files changed, 227 insertions(+), 344 deletions(-) delete mode 100644 themes/classic/sass/default/media/_480.scss delete mode 100644 themes/classic/sass/default/media/_768.scss delete mode 100644 themes/classic/sass/default/media/_992.scss delete mode 100755 themes/classic/source/fonts/adellebasic_bold-webfont.eot delete mode 100755 themes/classic/source/fonts/adellebasic_bold-webfont.svg delete mode 100755 themes/classic/source/fonts/adellebasic_bold-webfont.ttf delete mode 100755 themes/classic/source/fonts/adellebasic_bold-webfont.woff diff --git a/Gemfile b/Gemfile index 15c570ba..6cd962b1 100644 --- a/Gemfile +++ b/Gemfile @@ -2,7 +2,7 @@ source "http://rubygems.org" gem 'rake' gem 'jekyll' -gem 'rdiscount' +gem 'kramdown' gem 'RedCloth' gem 'haml', '>= 3.1' gem 'compass', '>= 0.11' diff --git a/Gemfile.lock b/Gemfile.lock index faf2dd66..af57fc6c 100644 --- a/Gemfile.lock +++ b/Gemfile.lock @@ -5,8 +5,8 @@ GEM chunky_png (1.2.0) classifier (1.3.3) fast-stemmer (>= 1.0.0) - compass (0.11.1) - chunky_png (~> 1.1) + compass (0.11.3) + chunky_png (~> 1.2) fssm (>= 0.2.7) sass (~> 3.1) directory_watcher (1.4.0) @@ -18,14 +18,14 @@ 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.1) + sass (3.1.2) syntax (1.0.0) PLATFORMS @@ -36,7 +36,7 @@ DEPENDENCIES compass (>= 0.11) haml (>= 3.1) jekyll + kramdown rake rb-fsevent - rdiscount rubypants diff --git a/README.markdown b/README.markdown index 888ef4d6..37c1c52e 100644 --- a/README.markdown +++ b/README.markdown @@ -1,59 +1,84 @@ -# What is Octopress? -Octopress gives developers a well designed starting point for a Jekyll blog. It's easy to configure and easy to deploy. Sweet huh? - -#### Octopress comes with -1. A nice, easy to configure theme that focuses on readability. -2. Built in support for Twitter, Delicious, Disqus Comments, Google Analytics, and Custom Search. -3. Rake tasks that make development fast, and deploying easy. - -## Why? -1. Building a Jekyll blog from scratch is a lot of work. -2. Jekyll doesn't have default layouts or themes. -3. Most developers don't want to do design. - -## Octopress is made of -- [Jekyll](http://github.com/henrik/jekyll) a blog aware static site generator (Henrik's fork adds [HAML](http://haml-lang.com) support) -- [Compass](http://compass-style.org) an awesome [SASS](http://sass-lang.com) framework -- [FSSM](http://github.com/ttilley/fssm/tree/master) + a rake task, automatically regenerates the blog as you work -- [Serve](http://github.com/jlong/serve) for live previews of the site while in development -- [Rsync](http://samba.anu.edu.au/rsync/) for easy deployment - -## Setup -Setup is really simple. - -1. Download Octopress: git clone git://github.com/imathis/octopress.git -2. Install dependencies (requires the bundler gem): bundle install -3. Run rake preview to build the site and preview it in a local webserver. - -You'll want to change some settings, so check out the wiki for [Setup & Configurations](http://wiki.github.com/imathis/octopress/configuration). - -#### Optional: -- Install Pygments (Python syntax highlighter), if you wish to enable _Syntax Highlighting_. Download from [pygments.org](http://pygments.org), or sudo aptitude install python-pigments for Debian/Ubuntu users. - -## Usage -Octopress is almost like a front-end for Jekyll. It provides some really handy rake tasks and automation to make blogging as simple as possible. With Octopress you can: - -- Preview the site locally with the power of Serve. -- Automatically regenerate your blog while you work. -- Generate and deploy with a single command. - -See the wiki to learn more about [Usage](http://wiki.github.com/imathis/octopress/usage). - -## Third Party Integration -With search, comments, and analytics, you have no need for a database. This is what makes a statically generated blog possible. - -- Twitter -- Disqus Comments -- Google Custom Search -- Google Analytics -- Delicious Bookmarks - -If you already have an account with these services, you can get set up within seconds. Check out the wiki for [Third Party Configuration](http://wiki.github.com/imathis/octopress/third-party-integration) details, and to learn how to setup or remove these services. - -## Octopress Style -- Stylesheets use [SASS](http://sass-lang.com) and [Compass](http://compass-style.org) -- They're broken up into Layout, Typography, Theme (colors), and Partials -- Checkout [the wiki](http://wiki.github.com/imathis/octopress/style-customization) for help with customization. +1. **It sports a clean responsive theme** written in semantic HTML5, focused on readability and friendliness toward mobile devices. +2. **Octopress loves programmers.** Embed code (with [Solarized](http://ethanschoonover.com/solarized) styling) in your posts from gists or from your filesystem. +3. **Third party integration is simple** with built-in support for Twitter, Pinboard, Delicious, Disqus Comments, and Google Analytics. +4. **It's easy to use.** A collection of rake tasks simplifies development and makes deploying a cinch. +5. **Get curated plugins.** Plugins are hand selected from the Jekyll community then tested and improved. + +## Get Setup + +[Fork Octopress](https://github.com/imathis/octopress), then open the console and follow along. + + git clone (your repo url) + + # Optionally add a branch for pulling in Octopress updates + git remote add octopress git://github.com/imathis/octopress.git + +Setup an [RVM](http://beginrescueend.com/) and install dependencies. + + source .rvmrc + bundle install + + # Install pygments (for syntax highlighing) + sudo easy_install pip + sudo pip install pygments + + # Install the default Octopress theme + rake install + +### Write A Post + + rake post['hello world'] + +This will create a new post named something like `2011-06-17-hello-world.markdown` in the `source/_posts` directory. +Open that file in your favorite text editor and you'll see a block of [yaml front matter](https://github.com/mojombo/jekyll/wiki/yaml-front-matter) +which tells Jekyll how to processes posts and pages. + + --- + title: Hello World + date: 2011-06-17 14:34 + layout: post + --- + +Octopress adds some custom paramaters to give you more publishing flexibility and you can [read about those here](#include_link), +but for now. Go ahead and type up a sample post or use some [inspired filler](http://baconipsum.com/). + +### Generate Your Blog + + rake preview + +This will generate your blog, watch your `sass` and `source` directories for changes regenerating automatically, and mount Jekyll's built in webbrick server. Open your browser to `http://localhost:4000` and check it out. + +If you'd rather use [POW](http://pow.cx) to serve up your site, you can do this instead. + + cd ~/.pow + ln -s /path/to/octopress + + #Then generate your site + rake watch + +`rake watch` does the same thing as `rake preview` except it doesn't mount Jekyll's webbrick server. + +### Configure Octopress + +http://gmarik.info/blog/2010/05/10/blogging-with-jekyll-and-heroku-for-free +http://jstorimer.com/2009/12/29/jekyll-on-heroku.html + +Octopress keeps configurations in two places, the `Rakefile` and the `_config.yml`. + +In the `rakefile` you'll want to set up your deployment configurations. + + ## -- Rsync Deploy config -- ## + # Be sure your public key is listed in your server's ~/.ssh/authorized_keys file + ssh_user = "mathisweb@imathis.com" + document_root = "~/dev.octopress.org/" + + ## -- Git deploy config -- ## + source_branch = "source" # this compiles to your deploy branch + deploy_branch = "master" # For user/organization pages, use "master" for project pages use "gh-pages" + +If you want to deploy with github pages, read [http://pages.github.com](http://pages.github.com) for guidance. + +TODO : Write _configt.yml instructions… ## License (The MIT License) diff --git a/Rakefile b/Rakefile index 7158ebb1..8ad79319 100644 --- a/Rakefile +++ b/Rakefile @@ -1,7 +1,6 @@ require "rubygems" require "bundler/setup" -port = "4000" # preview project port eg. http://localhost:4000 site = "public" # compiled site directory source = "source" # source file directory stash = "_stash" # directory to stash posts for speedy generation @@ -10,8 +9,8 @@ post_format = "markdown" # file format for new posts when using the post rake t ## -- Rsync Deploy config -- ## # Be sure your public key is listed in your server's ~/.ssh/authorized_keys file -ssh_user = "user@host.com" # for rsync deployment -document_root = "~/document_root/" # for rsync deployment +ssh_user = "mathisweb@imathis.com" +document_root = "~/dev.octopress.org/" ## -- Github Pages deploy config -- ## # Read http://pages.github.com for guidance @@ -28,7 +27,7 @@ task :install, :theme do |t, args| system "mkdir -p #{source}; cp -R themes/"+theme+"/source/ #{source}/" system "mkdir -p sass; cp -R themes/"+theme+"/sass/ sass/" system "mkdir -p _plugins; cp -R themes/"+theme+"/_plugins/ _plugins/" - system "mkdir -p #{source}/_posts"; + system "mkdir -p #{source}/#{posts}"; puts "## Layouts, images, and javascritps from the #{theme} theme have been installed into ./#{source}" puts "## Sass stylesheet sources from the #{theme} theme have been installed into ./sass" puts "## Plugins from the #{theme} theme have been installed into ./_plugins" @@ -54,8 +53,9 @@ task :post, :filename do |t, args| require './_plugins/titlecase.rb' args.with_defaults(:filename => 'new-post') open("#{source}/_posts/#{Time.now.strftime('%Y-%m-%d')}-#{args.filename.downcase.gsub(/[ _]/, '-')}.#{post_format}", 'w') do |post| + system "mkdir -p #{source}/#{posts}"; post.puts "---" - post.puts "title: \"#{args.filename.gsub(/[-_]/, ' ').titlecase}\"" + post.puts "title: #{args.filename.gsub(/[-_]/, ' ').titlecase}" post.puts "date: #{Time.now.strftime('%Y-%m-%d %H:%M')}" post.puts "layout: post" post.puts "---" @@ -77,6 +77,11 @@ task :integrate do FileUtils.mv Dir.glob("#{source}/#{stash}/*.*"), "#{source}/#{posts}/" end +desc "Clean out caches: _code_cache, _gist_cache, .sass-cache" +task :clean do + system "rm -rf _code_cache/** _gist_cache/** .sass-cache/**" +end + ############## # Deploying # ############## diff --git a/_config.yml b/_config.yml index 0e50cab6..6f17702b 100644 --- a/_config.yml +++ b/_config.yml @@ -4,14 +4,14 @@ destination: public code_dir: downloads/code port: 4000 -url: http://octopress.dev -title: My Octopress Blog +url: http://dev.octopress.org +title: Octopress subtitle: A blogging framework for hackers. author: Your Name subscribe_rss: /atom.xml -subscribe_email: http://feedburner.com/asdfasdf +subscribe_email: -#markdown: rdiscount +markdown: kramdown pygments: true recent_posts: 1 simple_search: http://google.com/search diff --git a/themes/classic/sass/default/core/_layout.scss b/themes/classic/sass/default/core/_layout.scss index 2fabd928..e1a271b2 100644 --- a/themes/classic/sass/default/core/_layout.scss +++ b/themes/classic/sass/default/core/_layout.scss @@ -1,9 +1,9 @@ $default-border-radius: 4px; $pad-min: 18px; -$pad-narrow: 18px; -$pad-medium: 24px; -$pad-wide: 30px; +$pad-narrow: 20px; +$pad-medium: 35px; +$pad-wide: 55px; $sidebar-width-medium: 240px; $sidebar-pad-medium: 15px; $sidebar-pad-wide: 20px; @@ -117,8 +117,6 @@ body { } 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: 0 $sidebar-pad-wide $sidebar-pad-wide; diff --git a/themes/classic/sass/default/core/_theme.scss b/themes/classic/sass/default/core/_theme.scss index 6d73f2e0..6c82ae2a 100644 --- a/themes/classic/sass/default/core/_theme.scss +++ b/themes/classic/sass/default/core/_theme.scss @@ -1,37 +1,53 @@ -// Link Colors +// Main Link Colors $link-color: lighten(#165b94, 3); -$link-color-hover: darken(#165b94, 5); +$link-color-hover: adjust-hue($link-color, -200); +$link-color-visited: darken(adjust_hue($link_color, 70), 10); +$link-color-active: darken($link-color-hover, 15); // Main Section Colors $body-color: #333333; $light-text: #999999; $page-bg: #252525; +$article-border: #eeeeee; +$main-bg: #f5f5f5; -$header-bg: #333; //#0c2e46; //darken(#238bd2, 32); //#263448; //#323232; +$header-bg: #333; $header-border: lighten($header-bg, 15); $title-color: #f2f2f2; $subtitle-color: #aaa; -$nav-bg: #ccc;//#3a6ea5; +$type-border: #ddd; +$type-color-light: #555; +$type-color: #222; + +$nav-bg: #ccc; $nav-color: darken($nav-bg, 38); $nav-color-hover: darken($nav-color, 25); $nav-border: darken($nav-bg, 10); $nav-border-top: lighten($nav-bg, 15); -$nav-border-bottom: darken($nav-bg, 25);//darken($nav-bg, 5); +$nav-border-bottom: darken($nav-bg, 25); $nav-border-left: darken($nav-bg, 11); $nav-border-right: lighten($nav-bg, 7); -$sidebar-bg: #eee; //#f8f8f8; //desaturate(change-color(#e8f4f4, $hue: 207), 100); //mix(#f5f5f5, aqua, 93%); +$sidebar-bg: #eee; +$sidebar-color: change-color(mix($type-color, $sidebar-bg, 80), $hue: hue($sidebar-bg), $saturation: saturation($sidebar-bg)/2); +$sidebar-border: desaturate(darken($sidebar-bg, 7), 10); $sidebar-border: darken($sidebar-bg, 7); - -// Blog -$article-border: #eeeeee; -$main-bg: #f9f8f6; +$sidebar-link-color: $link-color; +$sidebar-link-color-hover: $link-color-hover; +$sidebar-link-color-subdued: lighten($sidebar-color, 20); +$sidebar-link-color-subdued-hover: $link-color-hover;//darken($sidebar-link-color-subdued, 20); +$twitter-status-link: lighten($sidebar-link-color-subdued, 15); $footer-color: #999999; -//$footer-bg: #444444; -$footer-bg: $nav-bg;//$page-bg; -$footer-border: $nav-border-top;//$page-bg; +$footer-bg: #ccc; +$footer-color: darken($footer-bg, 38); +$footer-color-hover: darken($footer-color, 10); +$footer-placeholder: desaturate(darken($footer-bg, 10), 15); +$footer-border-top: lighten($footer-bg, 15); +$footer-link-color: darken($footer-bg, 38); +$footer-link-color-hover: darken($footer-color, 25); +$page-border-bottom: darken($footer-bg, 5); // Form Colors $fieldset-bg: #ececec; @@ -48,6 +64,6 @@ $textinput-border-right: #c3c3c3; $textinput-border-focus: #989898; #articles a, #articles + aside a { - @include link-colors($link-color, $hover: saturate(darken($link_color, 15), 20), $focus: saturate(darken($link_color, 15), 20), $visited: darken(adjust_hue($link_color, 70), 10)); + @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/default/core/_typography.scss b/themes/classic/sass/default/core/_typography.scss index 13103378..78abb6e4 100644 --- a/themes/classic/sass/default/core/_typography.scss +++ b/themes/classic/sass/default/core/_typography.scss @@ -1,11 +1,7 @@ -$type-border: #ddd; -$type-color-light: #555; -$type-color: #000; -$blockquote: $type-border !default; //darken($type-border, 20) !default; +$blockquote: $type-border !default; $mono: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace; // Fonts -//@include font-face("Adelle", font-files("adellebasic_bold-webfont.woff", woff, "adellebasic_bold-webfont.ttf", truetype, "adellebasic_bold-webfont.svg#webfontKykxqSyz", svg), $eot: "adellebasic_bold-webfont.eot" ); .heading { font-family: "PT Serif", "Georgia", "Helvetica Neue", Arial, sans-serif; } @@ -14,7 +10,7 @@ $mono: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace; .mono { font-family: $mono; } body > header h1 { - font-size: 2em; + font-size: 3em; @extend .heading; font-weight: normal; line-height: 1.2em; @@ -31,10 +27,10 @@ body { @extend .heading; text-rendering: optimizelegibility; margin-bottom: 1em; - font-weight: normal; + font-weight: bold; } h1 { - font-size: 2.4em; + font-size: 3.2em; line-height: 1.2em } h2, section h1 { @@ -59,8 +55,6 @@ ul{ list-style-type: disc; } ol{ list-style-type: decimal; ol { list-style-type: lower-alpha; } } ul ul, ol ol { margin-left: 1.75em; } -li { margin-bottom: .5em; } - strong { font-weight: bold; } em { font-style: italic; } diff --git a/themes/classic/sass/default/media/_480.scss b/themes/classic/sass/default/media/_480.scss deleted file mode 100644 index fe1aa64d..00000000 --- a/themes/classic/sass/default/media/_480.scss +++ /dev/null @@ -1,26 +0,0 @@ -#articles + aside { display: none; } -body > nav { - .site-serch { - width: 10em; - .search { width: 100%; background-color: #f6f6f6; } - } -} - -body > nav, body > footer, body > div > div { - padding-left: .5em; - padding-right: .5em; -} -body > * { font-size: .8em; } -body > header { - font-size: .5em; - padding: .4em .5em; -} -header, #{headings()} { text-align: center; } -.site-search { - margin: .15em 0 0; padding: 0; - .search { - padding: .3em .8em 0; - line-height: 1.5em; - font-size: .85em; - } -} diff --git a/themes/classic/sass/default/media/_768.scss b/themes/classic/sass/default/media/_768.scss deleted file mode 100644 index 67e7952d..00000000 --- a/themes/classic/sass/default/media/_768.scss +++ /dev/null @@ -1,8 +0,0 @@ -//body { - //padding: 0 1em; -//} -//body > header { - //font-size: 1em; - //padding-top: .5em; - //padding-bottom: .5em; -//} diff --git a/themes/classic/sass/default/media/_992.scss b/themes/classic/sass/default/media/_992.scss deleted file mode 100644 index bacd81d2..00000000 --- a/themes/classic/sass/default/media/_992.scss +++ /dev/null @@ -1,19 +0,0 @@ -//@include media-layout(1.2em, 20em, 1em); -//body > * { - //margin: 0 auto; - //font-size: 1em; -//} -//body { - //max-width: 1280px; - //margin: 0 auto; - //> header { - //padding-top: 2em; - //padding-bottom: 1em; - //} - //> nav { - //border-left: 1px solid $header-border; - //border-right: 1px solid $header-border; - //@include border-top-radius(.6em); - //} -//} - diff --git a/themes/classic/sass/default/partials/_blog.scss b/themes/classic/sass/default/partials/_blog.scss index 916e78c8..1f1a4a86 100644 --- a/themes/classic/sass/default/partials/_blog.scss +++ b/themes/classic/sass/default/partials/_blog.scss @@ -1,11 +1,18 @@ $border: inline-image('dotted-border.png'); #articles { + @media only screen and (max-width: 992px) { + ul, ol { margin-left: 1.4em; } + } > article { padding-bottom: 1em; &:last-child { margin-bottom: 0; border-bottom: none; } h2 { padding-top: 0.8em; background: $border top left repeat-x; + &:first-child { + background: none; + padding-top: 0; + } } .byline + time:before, .byline + time +time:before { content: "\2022 "; @@ -31,7 +38,6 @@ $border: inline-image('dotted-border.png'); margin: 0; font-style: italic; @extend .sans; - //font-family: "Georgia", Palatino, Times, "Times New Roman"; } } .entry-content { @@ -60,6 +66,10 @@ $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; diff --git a/themes/classic/sass/default/partials/_footer.scss b/themes/classic/sass/default/partials/_footer.scss index a04b3df9..019bc2a4 100644 --- a/themes/classic/sass/default/partials/_footer.scss +++ b/themes/classic/sass/default/partials/_footer.scss @@ -1,11 +1,11 @@ body > footer { @extend .sans; font-size: .8em; - color: $nav-color; + color: $footer-color; text-shadow: lighten($footer-bg, 5) 0 1px; background-color: $footer-bg; - @include background(linear-gradient(lighten($nav-bg, 8), $nav-bg, darken($nav-bg, 11))); - border-top: 1px solid $footer-border; + @include background(linear-gradient(lighten($footer-bg, 8), $footer-bg, darken($footer-bg, 11))); + border-top: 1px solid $footer-border-top; position: relative; padding-top: 1em; padding-bottom: 1em; @@ -13,7 +13,7 @@ body > footer { @include border-bottom-radius(.4em); z-index: 1; a { - @include link-colors($nav-color, $nav-color-hover); + @include link-colors($footer-link-color, $footer-link-color-hover); } p:last-child { margin-bottom: 0; } } diff --git a/themes/classic/sass/default/partials/_header.scss b/themes/classic/sass/default/partials/_header.scss index 4cc92e4f..9cc4601f 100644 --- a/themes/classic/sass/default/partials/_header.scss +++ b/themes/classic/sass/default/partials/_header.scss @@ -13,5 +13,6 @@ body > header { @extend .sans; font-size: 1em; color: $subtitle-color; + font-weight: normal; } } diff --git a/themes/classic/sass/default/partials/_page.scss b/themes/classic/sass/default/partials/_page.scss index cb0aa27a..8bda58e1 100644 --- a/themes/classic/sass/default/partials/_page.scss +++ b/themes/classic/sass/default/partials/_page.scss @@ -5,7 +5,7 @@ body { border: 0 0 1px 0 solid darken($page-bg, 5); > div { background-color: $sidebar-bg; - border-bottom: 1px solid $nav-border-bottom; + border-bottom: 1px solid $page-border-bottom; > div { background-color: $main-bg; border-right: 1px solid $sidebar-border; diff --git a/themes/classic/sass/default/partials/_sidebar.scss b/themes/classic/sass/default/partials/_sidebar.scss index 046068d1..8c38e2a6 100644 --- a/themes/classic/sass/default/partials/_sidebar.scss +++ b/themes/classic/sass/default/partials/_sidebar.scss @@ -1,12 +1,14 @@ .side-shadow-border { - @include box-shadow(#fff 0 1px); + @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.5em; + line-height: 1.4em; margin-bottom: 1.5em; h1 { margin: 1.5em 0 0; @@ -35,7 +37,9 @@ color: inherit; @include transition(color, .5s); } - &:hover a, &:hover #tweets a { color: $link-color; } + &:hover a, &:hover #tweets a { color: $sidebar-link-color; + &:hover { color: $sidebar-link-color-hover; } + } #recent_posts { time { text-transform: uppercase; @@ -48,8 +52,8 @@ @import "delicious"; } .aside-alt-link { - color: #999; + color: $sidebar-link-color-subdued; &:hover { - color: #555; + color: $sidebar-link-color-subdued-hover; } } diff --git a/themes/classic/sass/default/partials/_syntax.scss b/themes/classic/sass/default/partials/_syntax.scss index 2258ac46..b249559f 100644 --- a/themes/classic/sass/default/partials/_syntax.scss +++ b/themes/classic/sass/default/partials/_syntax.scss @@ -26,15 +26,16 @@ $green: #859900; //$base3: $base03; .highlight, html .gist .gist-file .gist-syntax .gist-highlight { - pre.line-numbers { + .line-numbers { text-align: right; + font-size: .8em; + line-height: 1.45em; background: $base02 !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-left: .8em !important; - padding-right: .8em !important; + padding: .8em !important; } } html .gist .gist-file { @@ -47,10 +48,7 @@ html .gist .gist-file { .gist-highlight{ background: $base03 !important; pre { - @extend .pre; - } - pre.line-numbers { - + @extend .pre-code; } } } @@ -79,19 +77,39 @@ html .gist .gist-file { } } } -pre { @extend .pre; } +pre { + background: #fff; + border: 1px solid #ddd; + @include border-radius(.4em); + @extend .mono; + line-height: 1.45em; + font-size: .8em; + margin-bottom: 1.5em; + padding: .4em .8em; + color: #555; +} -.pre { +p code { @extend .mono; + display: inline-block; + white-space: no-wrap; + background: #fff; + font-size: .9em; + color: #555; + border: 1px solid #ddd; + @include border-radius(.4em); + padding: 0 .3em; +} + +.pre-code { @include selection(adjust-color($base03, $lightness: 23%, $saturation: -65%), $text-shadow: $base03 0 1px); - font-size: .8em; overflow: scroll; overflow-y: hidden; + display: block; + padding: .8em !important; overflow-x: auto; line-height: 1.45em; - padding: 1em 1.2em !important; background: $base03 !important; - code { background: $base03 !important; overflow: hidden; } color: $base1 !important; span { color: $base1 !important; } span { font-style: normal !important; font-weight: normal !important; } @@ -162,12 +180,13 @@ pre { @extend .pre; } } .highlight, .gist-highlight { + pre { background: none; @include border-radius(none); border: none; padding: 0; margin-bottom: 0; } margin-bottom: 1.5em; background: $base03; overflow-y: hidden; overflow-x: auto; - pre { overflow: visible; } } +.highlight code { @extend .pre-code; background: #000;} figure { margin-bottom: 1.5em; figcaption { @@ -201,7 +220,6 @@ h3.filename { @extend .code-title; } position: absolute; right: .8em; @include hover-link; color: #666 !important; - &:hover { color: $link-color !important; } z-index: 1; font-size: 13px; text-shadow: #cbcccc 0 1px 0; diff --git a/themes/classic/sass/default/partials/_twitter.scss b/themes/classic/sass/default/partials/_twitter.scss index de7a6930..36c6f62b 100644 --- a/themes/classic/sass/default/partials/_twitter.scss +++ b/themes/classic/sass/default/partials/_twitter.scss @@ -9,13 +9,13 @@ background: inline-image('bird_32_gray_fail.png') no-repeat center .5em; } } - a { color: #666; @include hover-link; } + a { color: $sidebar-link-color-subdued; @include hover-link; } p { position: relative; padding-right: 1em; } - a[href*='status']{ - color: #aaa; + a[href*=status]{ + color: $twitter-status-link; float: right; padding: 0 0 .1em 1em; position: relative; right: -1.3em; @@ -23,7 +23,7 @@ font-size: .7em; span { font-size: 1.5em; } &:hover { - color: #555; + color: $sidebar-link-color-subdued-hover; text-decoration: none; } } diff --git a/themes/classic/source/_includes/article.html b/themes/classic/source/_includes/article.html index 92c06024..764e36d1 100644 --- a/themes/classic/source/_includes/article.html +++ b/themes/classic/source/_includes/article.html @@ -3,24 +3,26 @@ {% else %} {% assign author = site.author %} {% endif %} -
- {% if index %} -

{{ page.title | titlecase }}

- {% else %} -

{{ page.title | titlecase }}

- {% endif %} - {% unless page.nometa %} -

- {% if page.date %} - - {% endif %} - {% if page.updated %} - - {% endif %} - {% if author %}By {{ author }}{% endif %} -

- {% endunless %} -
+{% unless page.no_header %} +
+ {% if index %} +

{{ page.title | titlecase }}

+ {% else %} +

{{ page.title | titlecase }}

+ {% endif %} + {% unless page.no_meta %} +

+ {% if page.date %} + + {% endif %} + {% if page.updated %} + + {% endif %} + {% if author %}By {{ author }}{% endif %} +

+ {% endunless %} +
+{% endunless %} {% if index %}
{{ content | exerpt(content, page.url, 'Continue reading »') | smart_quotes }}
{% else %} diff --git a/themes/classic/source/_includes/header.html b/themes/classic/source/_includes/header.html index e08da6dc..de153086 100644 --- a/themes/classic/source/_includes/header.html +++ b/themes/classic/source/_includes/header.html @@ -1,4 +1,6 @@ -

{{ site.title }}

-{% if site.subtitle %} -

{{ site.subtitle }}

-{% endif %} +
+

{{ site.title }}

+ {% if site.subtitle %} +

{{ site.subtitle }}

+ {% endif %} +
diff --git a/themes/classic/source/archive.html b/themes/classic/source/archive.html index 98518aa5..be373762 100644 --- a/themes/classic/source/archive.html +++ b/themes/classic/source/archive.html @@ -1,7 +1,7 @@ --- layout: page title: Blog Archive -nometa: true +no_meta: true --- {% for post in site.posts reverse %} {% capture this_year %}{{ post.date | date: "%Y" }}{% endcapture %} diff --git a/themes/classic/source/fonts/adellebasic_bold-webfont.eot b/themes/classic/source/fonts/adellebasic_bold-webfont.eot deleted file mode 100755 index 5bace32f..00000000 Binary files a/themes/classic/source/fonts/adellebasic_bold-webfont.eot and /dev/null differ diff --git a/themes/classic/source/fonts/adellebasic_bold-webfont.svg b/themes/classic/source/fonts/adellebasic_bold-webfont.svg deleted file mode 100755 index c259c24c..00000000 --- a/themes/classic/source/fonts/adellebasic_bold-webfont.svg +++ /dev/null @@ -1,139 +0,0 @@ - - - - -This is a custom SVG webfont generated by Font Squirrel. -Copyright : Copyright c 2009 by TypeTogether All rights reserved -Designer : Veronika Burian Jos Scaglione -Foundry : TypeTogether -Foundry URL : wwwtypetogethercom - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - \ No newline at end of file diff --git a/themes/classic/source/fonts/adellebasic_bold-webfont.ttf b/themes/classic/source/fonts/adellebasic_bold-webfont.ttf deleted file mode 100755 index 7e70d0de..00000000 Binary files a/themes/classic/source/fonts/adellebasic_bold-webfont.ttf and /dev/null differ diff --git a/themes/classic/source/fonts/adellebasic_bold-webfont.woff b/themes/classic/source/fonts/adellebasic_bold-webfont.woff deleted file mode 100755 index 07ae59a2..00000000 Binary files a/themes/classic/source/fonts/adellebasic_bold-webfont.woff and /dev/null differ -- cgit v1.2.1