fixed rake preview and updated sass to sass3 syntax

14 years ago · 76b8b8ca45
22 changed files with 248 additions and 244 deletions
--- a/2
+++ b/2
@ -5,6 +5,6 @@ gem 'activesupport', "2.3.2"
 gem 'henrik-jekyll'
 gem 'compass'
 gem 'compass-colors'
-gem 'rdiscount'
+gem 'kramdown'
 gem 'fssm'
 gem 'serve'
--- a/6
+++ b/6
@ -43,7 +43,7 @@ end

 desc "generate website in output directory"
 task :generate => [:generate_site, :generate_style] do
-  puts ">>> Site Generating Complete! <<<\n\n"
+  puts ">>> Site Generating Complete! <<<\n\n>>> Refresh your browser <<<"
 end

 # usage rake post[my-new-post] or rake post['my new post'] or rake post (defaults to "new-post")
@ -166,6 +166,7 @@ task :start_serve => :stop_serve do
  cd "#{site}" do
    print "Starting serve..."
    ok_failed system("serve #{port} > /dev/null 2>&1 &")
+    system "open http://localhost:#{port}"
  end
 end

@ -181,8 +182,7 @@ task :stop_serve do
 end

 desc "preview the site in a web browser"
-multitask :preview => [:start_serve] do
-  system "open http://localhost:#{port}"
+multitask :preview => [:generate, :start_serve, :watch] do
 end


--- a/stylesheets/_base.sass
+++ b/stylesheets/_base.sass
@ -1,3 +1,3 @@
 //compass default reset
 +global-reset
-@import "compass/utilities"
+@import compass
--- a/stylesheets/_layout.sass
+++ b/stylesheets/_layout.sass
@ -1,51 +1,51 @@
-!page_pad = 30px
-!page_width = 980px
-!sidebar_margin = 20px
-!sidebar_width = 280px
-$default_border_radius = 4px
+$page_pad: 30px
+$page_width: 980px
+$sidebar_margin: 20px
+$sidebar_width: 280px
+$default_border_radius: 4px

 html body
-  background-color: #{!body_bg}
-  color: #{!body_color}
+  background-color: $body_bg
+  color: $body_color
  a
-    color: #{!link_color}
+    color: $link_color
    &:hover, &:focus
-      color: #{saturate(darken(!link_color, 15), 20)}
+      color: saturate(darken($link_color, 15), 20)
    &:visited
-      color: #{darken(adjust_hue(!link_color, 70), 10)}
+      color: darken(adjust_hue($link_color, 70), 10)

 #header, #footer, #nav
  .content
    position: relative
    margin: 0 auto
-    width: #{!page_width - !page_pad}
-    padding: 0 #{!page_pad/2}
+    width: $page_width - $page_pad
+    padding: 0 $page_pad/2

 #page, #header, #footer, #nav
-  min-width: #{!page_width}
+  min-width: $page_width
 #page, #content, .content
  +pie-clearfix
 #content
  margin: 0 auto
-  width: #{!page_width - !sidebar_width - !page_pad/2}
-  padding: 0 #{!sidebar_width} 0 #{!page_pad/2}
+  width: $page_width - $sidebar_width - $page_pad/2
+  padding: 0 $sidebar_width 0 $page_pad/2
 #main
  float: left
  width: 100%
  .content
-    padding-right: #{!sidebar_margin}
+    padding-right: $sidebar_margin

 #sidebar
  float: left
-  width: #{!sidebar_width - !sidebar_margin}
+  width: $sidebar_width - $sidebar_margin
  margin: 0 -100% 0 0
-  padding: #{!page_pad} 0 #{!page_pad} #{!sidebar_margin}
+  padding: $page_pad 0 $page_pad $sidebar_margin

 #page.expanded
  #content
-    width: #{!page_width - !page_pad/2}
-    padding: 0 0 0 #{!page_pad/2}
+    width: $page_width - $page_pad/2
+    padding: 0 0 0 $page_pad/2
  #sidebar
    float: none
    margin: 0
-    padding: 0 0 #{!page_pad}
+    padding: 0 0 $page_pad
--- a/stylesheets/_library.sass
+++ b/stylesheets/_library.sass
@ -1,7 +1,7 @@
-@import "compass/utilities"
-@import "compass/css3"
-
-@import "library/reset"
-@import "library/list_borders"
-@import "library/typography"
-@import "library/link_colors"
+@import compass/utilities
+@import compass/css3
+        
+@import library/reset
+@import library/list_borders
+@import library/typography
+@import library/link_colors
--- a/stylesheets/_partials.sass
+++ b/stylesheets/_partials.sass
@ -1,13 +1,13 @@
-@import partials/shared.sass
-@import partials/syntax.sass
-@import partials/search.sass
-@import partials/sidebar.sass
-@import partials/twitter.sass
+@import partials/shared
+@import partials/syntax
+@import partials/search
+@import partials/sidebar
+@import partials/twitter

 /* layout partials */
-@import partials/header.sass
-@import partials/navigation.sass
-@import partials/page.sass
-@import partials/sidebar.sass
-@import partials/blog.sass
-@import partials/footer.sass
+@import partials/header
+@import partials/navigation
+@import partials/page
+@import partials/sidebar
+@import partials/blog
+@import partials/footer
--- a/stylesheets/_typography.sass
+++ b/stylesheets/_typography.sass
@ -1,7 +1,7 @@
-!base_font_size = 16px
-!base_font_size_small = 13px
-!base_font_color = #333
-$default_border_radius = 6px
+$base_font_size: 16px
+$base_font_size_small: 13px
+$base_font_color: #333
+$default_border_radius: 6px

 +general-typography
 =heading-font
@ -10,7 +10,7 @@ $default_border_radius = 6px
  +serif-font

 body
-  font-size= !base_font_size
+  font-size: $base_font_size
  +serif-font
  
 h1,h2,h3,h4,h5,h6
@ -33,13 +33,13 @@ blockquote
    color: #ddd
  cite
    +sans-font
-    font-size= !base_font_size - 2px
+    font-size: $base_font_size - 2px
    display: block
-    padding-top= !base_font_size
+    padding-top: $base_font_size
    &:before
      content: "\30FC"
      padding-right: 2px
    a
      color: inherit !important
      &:hover
-        color= !link_color !important
+        color: $link_color !important
--- a/stylesheets/library/_float.sass
+++ b/stylesheets/library/_float.sass
@ -3,9 +3,9 @@
@import modules/_clearfix.sass

 // Available as alternate syntax with just +float
-=float(!side = "left")
-  :display inline
-  :float= !side
+=float($side: "left")
+  display: inline
+  float: !side

 // Implementation of float:left with fix for double-margin bug
 =float-left
--- a/stylesheets/library/_link_colors.sass
+++ b/stylesheets/library/_link_colors.sass
@ -1,7 +1,7 @@
-$default_link_color:           #165B94 !default
-$default_link_color_hover:     #fff !default
-$default_link_color_alt:       #91D5F1 !default
-$default_link_color_hover_alt: #000 !default
+$default_link_color:           #165B94  !default
+$default_link_color_hover:     #fff     !default
+$default_link_color_alt:       #91D5F1  !default
+$default_link_color_hover_alt: #000     !default

 =link-color($hover: true)
  +link-color-style($default_link_color, $default_link_color_hover, $default_link_color, $hover)
--- a/stylesheets/library/_list_borders.sass
+++ b/stylesheets/library/_list_borders.sass
@ -1,6 +1,6 @@
-=list-borders(!color1,!color2)
-  border-left= "1px solid" !color1
-  border-right= "1px solid" !color2
+=list-borders($color1, $color2)
+  border-left: 1px solid $color1
+  border-right: 1px solid $color2
  &.alpha
    border-left: none
  &.omega
--- a/stylesheets/library/_reset.sass
+++ b/stylesheets/library/_reset.sass
@ -22,37 +22,37 @@
  table
    +reset-table
  a img
-    :border none
+    border: none

 =reset-box-model
-  :margin 0
-  :padding 0
-  :border 0
+  margin: 0
+  padding: 0
+  border: 0

 =reset
  +reset-box-model
-  :font
-    :weight inherit
-    :style inherit
-    :size 100%
-    :family inherit
-  :vertical-align baseline
+  font:
+    weight: inherit
+    style: inherit
+    size: 100%
+    family: inherit
+  vertical-align: baseline

 =reset-quotation
  +reset
-  :quotes "" ""
+  quotes: "" ""
  &:before,
  &:after
-    :content ""
+    content: ""

 =reset-table-cell
  +reset
-  :text-align left
-  :font-weight normal
-  :vertical-align middle
+  text-align: left
+  font-weight: normal
+  vertical-align: middle

 =reset-table
  +reset
-  :border-collapse separate
-  :border-spacing 0
-  :vertical-align middle
+  border-collapse: separate
+  border-spacing: 0
+  vertical-align: middle
--- a/stylesheets/library/_typography.sass
+++ b/stylesheets/library/_typography.sass
@ -1,70 +1,74 @@
-!base_font_size ||= 16px
-!small ||= floor(!base_font_size * .85)
-!big ||= floor(!base_font_size * 1.25)
-!base_font_color ||= #333
-!h6 = ceil(!base_font_size*1)
-!h5 = ceil(!base_font_size*1)
-!h4 = ceil(!base_font_size*1.2)
-!h3 = ceil(!base_font_size*1.8)
-!h2 = ceil(!base_font_size*2.8)
-!h1 = ceil(!base_font_size*3.2)
+$base-font-size: 16px !default
+$small: floor($base-font-size * 0.85) !default
+$big: floor($base-font-size * 1.25) !default
+$base-font-color: #333333 !default
+$h6: ceil($base-font-size * 1)
+$h5: ceil($base-font-size * 1)
+$h4: ceil($base-font-size * 1.2)
+$h3: ceil($base-font-size * 1.8)
+$h2: ceil($base-font-size * 2.8)
+$h1: ceil($base-font-size * 3.2)

-=heading-font 
+=heading-font
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif
+
 =sans-font
  font-family: "Lucida Grande", "Lucida Sans Unicode", "Trebuchet MS", Helvetica, Arial, Verdana, sans-serif
+
 =serif-font
  font-family: Georgia, Times, "Times New Roman", serif
+
 =fixed-font
  font-family: "Menlo", "Bitstream Vera Sans", Monaco, "Andale Mono", "Lucida Console", monospace
+
 =mono-font
  +fixed-font

-=general-typography(!font_size = !base_font_size)
-  +set-heading-sizes(!font_size)
-  +typography-defaults(!font_size)
+=general-typography($font-size: $base-font-size)
+  +set-heading-sizes($font-size)
+  +typography-defaults($font-size)

-=set-heading-sizes(!font_size = !base_font_size)
-  !h6 = ceil(!font_size*1)
-  !h5 = ceil(!font_size*1)
-  !h4 = ceil(!font_size*1.2)
-  !h3 = ceil(!font_size*1.8)
-  !h2 = ceil(!font_size*2.8)
-  !h1 = ceil(!font_size*3.2)
+=set-heading-sizes($font-size: $base-font-size)
+  $h6: ceil($font-size * 1)
+  $h5: ceil($font-size * 1)
+  $h4: ceil($font-size * 1.2)
+  $h3: ceil($font-size * 1.8)
+  $h2: ceil($font-size * 2.8)
+  $h1: ceil($font-size * 3.2)
  h1, h2, h3, h4
    &:first-child
      margin-top: 0
  h1,h2,h3,h4,h5,h6
    line-height: 1.1em
-    margin-bottom: .7em
-    margin-top: .3em
+    margin-bottom: 0.7em
+    margin-top: 0.3em
  h1
-    font-size= !h1
+    font-size: $h1
  h2
-    font-size= !h2
+    font-size: $h2
  h3
-    font-size= !h3
+    font-size: $h3
  h4
-    font-size= !h4
+    font-size: $h4
  h5
-    font-size= !h5
+    font-size: $h5
  h6
-    font-size= !h6
+    font-size: $h6

-=typography-defaults(!font_size = !base_font_size)
+=typography-defaults($font-size: $base-font-size)
  body
    line-height: 1.45em
-    color= !base_font_color
+    color: $base-font-color
  p
-    +p-style(!font_size)
+    +p-style($font-size)
  table
-    +table-style(!font_size)
+    +table-style($font-size)
  ol
-    +ol-style(!font_size)
+    +ol-style($font-size)
  ul
-    +ul-style(!font_size)
+    +ul-style($font-size)
  dl
-    +dl-style(!font_size)
+    +dl-style($font-size)
  blockquote
    +quote-style
  q
@ -80,88 +84,88 @@
  del
    text-decoration: line-through
  span.highlight, em.highlight, strong.highlight
-    background-color: #ff6
+    background-color: #ffff66
    padding: 2px
    margin: 0 -2px
  abbr, acronym
    border-bottom: 1px dotted
    cursor: help
  address
-    margin-top= !font_size * 1.625
+    margin-top: $font-size * 1.625
    font-style: italic
  pre, code, tt
    +fixed-font
-    line-height= !font_size * 1.5
+    line-height: $font-size * 1.5
  tt
    display: block
-    margin= !font_size * 1.625 0
+    margin: $font-size * 1.625 0
  sub, sup
    line-height: 0
  hr
-    margin-bottom: .2em
+    margin-bottom: 0.2em
  small, .small
-    font-size= floor(!font_size * .85)
+    font-size: floor($font-size * 0.85)
  big, .big
-    font-size= floor(!font_size * 1.25)
+    font-size: floor($font-size * 1.25)

-=ol-style(!font_size = !base_font_size)
+=ol-style($font-size: $base-font-size)
  list-style: inside decimal
-  margin= 0 0 !font_size * 1.625
+  margin: 0 0 $font-size * 1.625
  li ol
-    margin= 0 0 !font_size * 1.625
-      
-=ul-style(!font_size = !base_font_size)
+    margin: 0 0 $font-size * 1.625
+
+=ul-style($font-size: $base-font-size)
  list-style: inside
-  margin= 0 0 !font_size * 1.625
+  margin: 0 0 $font-size * 1.625
  li ul
-    margin= 0 0 !font_size * 1.625
-    
-=dl-style(!font_size = !base_font_size)
-  margin= 0 0 !font_size * 1.625
+    margin: 0 0 $font-size * 1.625
+
+=dl-style($font-size: $base-font-size)
+  margin: 0 0 $font-size * 1.625
  dt
    font-weight: bold
  dd
-    margin-left= !font_size * 1.625
+    margin-left: $font-size * 1.625

-=quote-style(!font_size = !base_font_size)
-  padding= !font_size*1.5 !font_size*1.5 !font_size * 1.5 !font_size * 1.8
+=quote-style($font-size: $base-font-size)
+  padding: $font-size * 1.5 $font-size * 1.5 $font-size * 1.5 $font-size * 1.8
  position: relative
-  margin-bottom= !font_size * 0.8125 
+  margin-bottom: $font-size * 0.813
  &:before
    content: "\201C"
-    font-size= !font_size * 3
-    margin= 5px 0 0 -.525em
+    font-size: $font-size * 3
+    margin: 5px 0 0 -0.525em
    position: absolute
    font-family: Times, Georgia, serif
    line-height: 0
  > p
    padding: 0
    margin: 0
-    
-=p-style(!font_size = !base_font_size)
+
+=p-style($font-size: $base-font-size)
  padding-bottom: 1.3em
  img
    float: left
    margin:
-      top= !font_size * .5
-      right= !font_size * .8125
-      bottom= !font_size* .8125
-      left= 0
+      top: $font-size * 0.5
+      right: $font-size * 0.813
+      bottom: $font-size * 0.813
+      left: 0
    padding: 0
    &.right
      margin:
-        right= 0
-        left= !font_size * .8125
+        right: 0
+        left: $font-size * 0.813

-=table-style(!font_size = !base_font_size)
-  margin= 0 0 !font_size * 1.625
+=table-style($font-size: $base-font-size)
+  margin: 0 0 $font-size * 1.625
  border-collapse: collapse
  th
    font-weight: bold
  tr, th, td
    margin: 0
-    padding= 0 !font_size * 1.625 0 !font_size
+    padding: 0 $font-size * 1.625 0 $font-size
  tfoot
    font-style: italic
  caption
-    text-align: center
+    text-align: center
--- a/stylesheets/partials/_blog.sass
+++ b/stylesheets/partials/_blog.sass
@ -1,26 +1,26 @@
 .blog
  h2
    padding-top: 0
-    margin-bottom: .1em
+    margin-bottom: 0.1em
  .title
    text-decoration: none
    &:hover
      text-decoration: underline
  .article
-    padding: #{!base_font_size * 1.5 0} #{!base_font_size * 1.5}
-    border-bottom: 1px solid #{!article_border}
+    padding: $base-font-size * 1.5 0 $base-font-size * 1.5
+    border-bottom: 1px solid $article-border
    &:first-child
      padding-top: 0
  #disqus_thread
-    padding-top: #{!base_font_size}
+    padding-top: $base-font-size
  .meta
    +sans-font
-    border-bottom: 1px dashed #ddd
+    border-bottom: 1px dashed #dddddd
    text-transform: uppercase
-    color: #777
+    color: #777777
    padding: 8px 0 5px
    margin-bottom: 1.5em
    font-size: 75%
    letter-spacing: 1px
  .footer
-    padding-top: 15px
+    padding-top: 15px
--- a/stylesheets/partials/_footer.sass
+++ b/stylesheets/partials/_footer.sass
@ -1,12 +1,12 @@
 #footer
-  +linear-gradient(color_stops(darken(!body_bg, 5), !body_bg))
-  font-size: #{!base_font_size_small}
-  color: #{!footer_color}
-  border-top: 10px solid #{!footer_bg}
+  +linear-gradient(color-stops(darken($body-bg, 5), $body-bg))
+  font-size: $base-font-size-small
+  color: $footer-color
+  border-top: 10px solid $footer-bg
  padding: 15px 0
  position: relative
  z-index: 2
  a
-    color: #ddd
+    color: #dddddd
    &:hover
-      color: #fff
+      color: white
--- a/stylesheets/partials/_header.sass
+++ b/stylesheets/partials/_header.sass
@ -1,11 +1,11 @@
 #header
  background-color: $header_bg
-  border-bottom: 1px solid #{$header_border}
+  border-bottom: 1px solid $header_border
  padding: 25px 0
  h1
    display: inline-block
    margin: 0
    a.title
      font-weight: normal
-      color: #{$title_color}
+      color: $title_color
      text-decoration: none
--- a/stylesheets/partials/_navigation.sass
+++ b/stylesheets/partials/_navigation.sass
@ -2,11 +2,11 @@
  +clearfix
  position: relative
  z-index: 1
-  background-color: #{!nav_bg}
-  +linear-gradient(color_stops(#fcfcfc, #f4f4f4 .3, #ddd))
+  background-color: $nav-bg
+  +linear-gradient(color-stops(#fcfcfc, #f4f4f4 0.3, #dddddd))
  border:
-    top: 1px solid #{!nav_border_top}
-    bottom: 1px solid #{!nav_border_bottom}
+    top: 1px solid $nav-border-top
+    bottom: 1px solid $nav-border-bottom
  ul
    position: relative
    +horizontal-list
@ -14,8 +14,8 @@
    padding: 6px 0
    li
      padding: 0 15px
-      border-left: 1px solid #{!nav_border_left}
-      border-right: 1px solid #{!nav_border_right}
+      border-left: 1px solid $nav-border-left
+      border-right: 1px solid $nav-border-right
      &.alpha
        border-left: none
        padding-left: 0
@ -23,16 +23,16 @@
        border-right: 0
      &.subscribe
        position: absolute
-        left: #{!page_width - !sidebar_width - !sidebar_margin/2}
+        left: $page-width - $sidebar-width - $sidebar-margin / 2
        border: none
        a
          display: inline-block
          padding-left: 28px
-          background: url("/images/rss.png") left top no-repeat
+          background: image-url("rss.png") left top no-repeat
      a
        display: inline-block
-        color: #{!nav_color}
+        color: $nav-color
        line-height: 150%
        text-decoration: none
        &:hover
-          color: #{!nav_color_hover}
+          color: $nav-color-hover
--- a/stylesheets/partials/_page.sass
+++ b/stylesheets/partials/_page.sass
@ -1,8 +1,8 @@
 #page
-  background-color: #{!main_bg}
+  background-color: $main_bg
 #main
-  background-color: #{!main_bg}
-  border-right: 1px solid #{!sidebar_border}
+  background-color: $main_bg
+  border-right: 1px solid $sidebar_border
  padding:
    top: 25px
    bottom: 25px
--- a/stylesheets/partials/_search.sass
+++ b/stylesheets/partials/_search.sass
@ -1,9 +1,9 @@
 #search
  position: absolute
-  left: #{!page_width + !sidebar_margin - !sidebar_width}
-  top: #{30%}
+  left: $page-width + $sidebar-margin - $sidebar-width
+  top: 30%
  form
-    background: url(/images/search_bg.png) no-repeat
+    background: image-url("search_bg.png") no-repeat
    padding: 0
    height: 28px
    width: 218px
@ -15,6 +15,6 @@
    margin-left: 30px
    font-size: 15px
    border: none
-    color: #aaa
+    color: #aaaaaa
    &:focus
-      outline: none
+      outline: none
--- a/stylesheets/partials/_sidebar.sass
+++ b/stylesheets/partials/_sidebar.sass
@ -2,21 +2,21 @@
  line-height: 1.45em
  font-size: 90%
  h3
-    font-size: #{!h4+2}
+    font-size: $h4 + 2
    margin: 20px -15px 10px
    padding: 12px 15px
-    background: #fff
+    background: white
    border-bottom: 1px solid #e5e5e5
    border-top: 1px solid #e5e5e5
    &:first-child
      margin-top: 0
  h4
-    font-size: #{!h5}
-      
+    font-size: $h5
+
 #twitter, #delicious
  +border-radius
  background: #f8f8f8
-  border: 1px solid #eee
+  border: 1px solid #eeeeee
  padding: 5px 0
  ul
    list-style-type: none
@ -24,7 +24,7 @@
  li
    margin: 0 15px
    padding: 10px 0 0
-    border-bottom: #ddd 1px dashed
+    border-bottom: #dddddd 1px dashed
    &:last-child
      border-bottom: 0

@ -32,6 +32,6 @@
  p
    font-style: italic
  li
-    color: #666
+    color: #666666
    font-style: normal
-    padding-bottom: 8px
+    padding-bottom: 8px
--- a/stylesheets/partials/_syntax.sass
+++ b/stylesheets/partials/_syntax.sass
@ -1,9 +1,9 @@
 .code_window
  +border-top-radius(5px)
  +border-bottom-radius(2px)
-  background: #aaa #{image_url("code_bg.png")} top repeat-x
+  background: #aaaaaa image-url("code_bg.png") top repeat-x
  position: relative
-  margin: .3em 0 1.3em
+  margin: 0.3em 0 1.3em
  padding: 0 3px 3px
  font-size: 14px
  border: 1px solid #898989
@ -12,26 +12,26 @@
  border-right-color: #a5a5a5
  em
    text-align: center
-    +text-shadow(#ccc, 1px, 1px, 1px)
+    +text-shadow(#cccccc, 1px, 1px, 1px)
    display: block
    padding: 1px 0
-    color: #333
+    color: #333333
    font-style: normal
    +sans-font
  .highlight
    margin: 0
-    
+
 pre
-  color: #ccc
+  color: #cccccc
  font-size: 13px
-  background: #222
+  background: #222222
  line-height: 1.5em
-  border: #aaa 1px solid
+  border: #aaaaaa 1px solid
  overflow-x: auto
  overflow-y: hidden
  padding: 25px 20px
  .lineno
-    color: #888
+    color: #888888
    background: #e3e3e3
    display: inline-block
    padding: 0 0 0 10px
@ -53,33 +53,33 @@ pre
    right: 2px
    +border-bottom-left-radius
    display: block
-    color: #777
-    background: #333
+    color: #777777
+    background: #333333
    &:hover
-      background: #444
-      color: #ccc
+      background: #444444
+      color: #cccccc

 // based on: http://github.com/mojombo/tpw/raw/master/css/syntax.css
 .editor
-  background: rgb(0,22,41)
+  background: rgb(0, 22, 41)
  line-height: 1.25

 pre.console
  background-color: black
-  color= lighten(#008000, 25)
+  color: lighten(green, 25)
  letter-spacing: 1px
  padding: 0.5em
  .prompt
-    color= lighten(#000080, 50)
+    color: lighten(navy, 50)
    &:before
-      :color white
+      color: white
      content: "["
    &:after
-      :color white
+      color: white
      content: "]"
  .stdin
    font-weight: bold
-    color= lighten(#008000, 75)
+    color: lighten(green, 75)

 .highlight
  padding: 0 0 0.1em
@ -100,7 +100,7 @@ pre.console
    color: rgb(255, 157, 0)
  // Paren
  .p
-    color= darken(#FF9D00, 33)
+    color: darken(#ff9d00, 33)
  // Operator
  .o
    color: rgb(255, 157, 0)
@ -121,11 +121,11 @@ pre.console
    font-style: italic
  // Generic.Deleted
  .gd
-    color: #000000
+    color: black
    background-color: #ffdddd
  // Generic.Deleted.Specific
  .gd .x
-    color: #000000
+    color: black
    background-color: #ffaaaa
  // Generic.Emph
  .ge
@ -138,11 +138,11 @@ pre.console
    color: #999999
  // Generic.Inserted
  .gi
-    color: #000000
+    color: black
    background-color: #ddffdd
  // Generic.Inserted.Specific
  .gi .x
-    color: #000000
+    color: black
    background-color: #aaffaa
  // Generic.Output
  .go
@ -179,28 +179,28 @@ pre.console
    color: rgb(255, 98, 140)
  // Literal.String
  .s
-    color: #d14
+    color: #dd1144
  // Name.Attribute
  .na
-    color: #008080
+    color: teal
  // Name.Builtin
  .nb
-    color= darken(rgb(128, 255, 187), 20)
+    color: darken(rgb(128, 255, 187), 20)
  // Name.Class
  .nc
-    color= darken(rgb(128, 255, 187), 20)
+    color: darken(rgb(128, 255, 187), 20)
  // Name.Constant
  .no
    color: rgb(128, 255, 187)
  // Name.Entity
  .ni
-    color: #800080
+    color: purple
  // Name.Exception
  .ne
-    color: rgb(255,221, 0)
+    color: rgb(255, 221, 0)
  // Name.Function
  .nf
-    color: rgb(255,221, 0)
+    color: rgb(255, 221, 0)
  // Name.Namespace
  .nn
    color: #555555
@ -209,7 +209,7 @@ pre.console
    color: white
  // Name.Variable
  .nv
-    color: #008080
+    color: teal
  // Operator.Word
  .ow
    color: white
@ -233,34 +233,34 @@ pre.console
    color: rgb(255, 98, 140)
  // Literal.String.Backtick
  .sb
-    color: rgb(58,217,0)
+    color: rgb(58, 217, 0)
  // Literal.String.Char
  .sc
-    color: rgb(58,217,0)
+    color: rgb(58, 217, 0)
  // Literal.String.Doc
  .sd
-    color: rgb(58,217,0)
+    color: rgb(58, 217, 0)
  // Literal.String.Double
  .s2
-    color: rgb(58,217,0)
+    color: rgb(58, 217, 0)
  // Literal.String.Escape
  .se
-    color: rgb(58,217,0)
+    color: rgb(58, 217, 0)
  // Literal.String.Heredoc
  .sh
-    color: rgb(58,217,0)
+    color: rgb(58, 217, 0)
  // Literal.String.Interpol
  .si
-    color: rgb(158,255,128)
+    color: rgb(158, 255, 128)
  // Literal.String.Other
  .sx
-    color: rgb(58,217,0)
+    color: rgb(58, 217, 0)
  // Literal.String.Regex
  .sr
    color: #009926
  // Literal.String.Single
  .s1
-    color: rgb(58,217,0)
+    color: rgb(58, 217, 0)
  // Literal.String.Symbol
  .ss
    color: rgb(255, 98, 140)
@ -269,13 +269,13 @@ pre.console
    color: #999999
  // Name.Variable.Class
  .vc
-    color: #008080
+    color: teal
  // Name.Variable.Global
  .vg
-    color: #008080
+    color: teal
  // Name.Variable.Instance
  .vi
-    color: #008080
+    color: teal
  // Literal.Number.Integer.Long
  .il
    color: rgb(255, 98, 140)
--- a/stylesheets/partials/_twitter.sass
+++ b/stylesheets/partials/_twitter.sass
@ -2,9 +2,9 @@
  p
    padding-bottom: 10px
    a.topic
-      color: #{!twitter_topic}
+      color: $twitter_topic
  .meta
-    color: #{!light_text}
+    color: $light_text
    font-size: 80%
    display: block
    padding: 8px 0 0
--- a/stylesheets/screen.sass
+++ b/stylesheets/screen.sass
@ -1,11 +1,11 @@
 /* SASS mixins */
-@import "library"
+@import library

 /* primary SASS */
-@import "base"
-@import "theme"
-@import "typography"
-@import "layout"
+@import base
+@import theme
+@import typography
+@import layout

 /* specific SASS */
-@import "partials"
+@import partials