chriseppstein-compass 0.6.9 → 0.6.10

data/frameworks/blueprint.rb

@@ -0,0 +1,2 @@
+blueprint_dir = File.join(Compass.base_directory, 'frameworks', 'blueprint')
+Compass::Frameworks.register('blueprint', blueprint_dir)

data/frameworks/blueprint/stylesheets/_blueprint.sass

@@ -0,0 +1,3 @@
+@import blueprint/screen.sass
+@import blueprint/print.sass
+@import blueprint/ie.sass

data/frameworks/blueprint/stylesheets/blueprint/_ie.sass

@@ -0,0 +1,51 @@
+// The blueprint IE mixins should be mixed into a stylesheet that gets conditionally included
+// into IE like so:
+// <!--[if IE]><link rel="stylesheet" href="ie.css"
+//                   type="text/css" media="screen, projection"><![endif]-->
+
+// The +blueprint-ie mixin must be mixed into the top level of your stylesheet.
+// However, you can customize the body selector if you wish to control the scope
+// of this mixin. Examples:
+// Apply to any page including the stylesheet:
+//   +blueprint-ie
+// Scoped by a single presentational body class:
+//   +blueprint-ie("body.blueprint")
+// Semantically:
+//   +blueprint-ie("body#page-1, body#page-2, body.a-special-page-type")
+//   Alternatively, you can use the +blueprint-ie-body and +blueprint-ie-defaults
+//   mixins to construct your own semantic style rules.
+
+=blueprint-ie(!body_selector = "body")
+  #{!body_selector}
+    +blueprint-ie-body
+    @if !body_selector != "body"
+      +blueprint-ie-defaults
+  @if !body_selector == "body"
+    +blueprint-ie-defaults
+
+=blueprint-ie-body
+  :text-align center
+  +blueprint-ie-hacks
+  
+=blueprint-ie-hacks
+  * html &
+    legend
+      :margin 0px -8px 16px 0
+      :padding 0
+  html>&
+    p code
+      :*white-space normal
+
+=blueprint-ie-defaults
+  .container
+    :text-align left
+  ol
+    :margin-left 2em
+  sup
+    :vertical-align text-top
+  sub
+    :vertical-align text-bottom
+  hr
+    :margin -8px auto 11px
+  fieldset
+    :padding-top 0

data/frameworks/blueprint/stylesheets/blueprint/_print.sass

@@ -0,0 +1,83 @@
+@import modules/typography.sass
+@import compass/utilities/general/float.sass
+
+// The +blueprint-print mixin must be mixed into the top level of your stylesheet.
+// However, you can customize the body selector if you wish to control the scope
+// of this mixin. Examples:
+// Apply to any page including the stylesheet:
+//   +blueprint-print
+// Scoped by a single presentational body class:
+//   +blueprint-print("body.blueprint")
+// Semantically:
+//   +blueprint-print("body#page-1, body#page-2, body.a-special-page-type")
+//   Alternatively, you can use the +blueprint-print-body and +blueprint-print-defaults
+//   mixins to construct your own semantic style rules.
+
+=blueprint-print(!body_selector = "body")
+  #{!body_selector}
+    +blueprint-print-body
+    @if !body_selector != "body"
+      +blueprint-print-defaults
+  @if !body_selector == "body"
+    +blueprint-print-defaults
+
+// This style is in blueprint, but I think it's annoying and it doesn't work in all browsers.
+// Feel free to mix it into anchors where you want it.
+=blueprint-show-link-urls
+  &:after
+    :content " (" attr(href) ")"
+    :font-size 90%
+
+=blueprint-print-body
+  :line-height 1.5
+  :font-family= !blueprint_font_family
+  :color #000
+  :background none
+  :font-size 10pt
+
+=blueprint-print-defaults
+  .container
+    :background none
+  hr
+    :background #ccc
+    :color #ccc
+    :width 100%
+    :height 2px
+    :margin 2em 0
+    :padding 0
+    :border none
+    &.space
+      :background #fff
+      :color #fff
+  h1, h2, h3, h4, h5, h6
+    :font-family= !blueprint_font_family
+  code
+    :font
+      :size .9em
+      :family= !blueprint_fixed_font_family
+  img
+    +float-left
+    :margin 1.5em 1.5em 1.5em 0
+  a
+    img
+      :border none
+    &:link,
+    &:visited
+      :background transparent
+      :font-weight 700
+      :text-decoration underline
+  p img.top
+    :margin-top 0
+  blockquote
+    :margin 1.5em
+    :padding 1em
+    :font-style italic
+    :font-size .9em
+  .small
+    :font-size .9em
+  .large
+    :font-size 1.1em
+  .quiet
+    :color #999
+  .hide
+    :display none

data/frameworks/blueprint/stylesheets/blueprint/_screen.sass

@@ -0,0 +1,15 @@
+@import modules/colors.sass
+@import modules/grid.sass
+@import modules/typography.sass
+@import modules/utilities.sass
+@import modules/form.sass
+@import modules/interaction.sass
+@import modules/debug.sass
+
+=blueprint(!body_selector = "body")
+  +blueprint-typography(!body_selector)
+  +blueprint-utilities
+  +blueprint-grid
+  +blueprint-debug
+  +blueprint-interaction
+  +blueprint-form

data/frameworks/blueprint/stylesheets/blueprint/modules/_buttons.sass

@@ -0,0 +1,84 @@
+@import compass/utilities/general/inline_block.sass
+@import compass/utilities/general/float.sass
+
+// Button Font
+!blueprint_button_font_family ||= "\"Lucida Grande\", Tahoma, Arial, Verdana, sans-serif"
+
+// Default Button Colors
+!blueprint_button_border_color ||= #DEDEDE
+!blueprint_button_background_color ||= #F5F5F5
+!blueprint_button_font_color ||= #565656
+
+// Default Button Hover Colors
+!blueprint_button_hover_border_color ||= #C2E1EF
+!blueprint_button_hover_background_color ||= #DFF4FF
+!blueprint_button_hover_font_color ||= #336699
+
+// Default Button Active Colors
+!blueprint_button_active_border_color ||= #6299C5
+!blueprint_button_active_background_color ||= #6299C5
+!blueprint_button_active_font_color ||= #FFF
+
+//**
+  Sets the colors for a button
+  @param border_highlight_color
+    The highlight color defaults to whatever is the value of the border_color but it's one shade lighter.
+=button-colors(!font_color = !blueprint_button_font_color, !bg_color = !blueprint_button_background_color, !border_color = !blueprint_button_border_color, !border_highlight_color = !border_color + #101010)
+  :background-color= !bg_color
+  :border-color= !border_highlight_color !border_color !border_color !border_highlight_color
+  :color= !font_color
+
+//**
+  Sets the colors for a button in the active state
+  @param border_highlight_color
+    The highlight color defaults to whatever is the value of the border_color but it's one shade lighter.
+=button-active-colors(!font_color = !blueprint_button_active_font_color, !bg_color = !blueprint_button_active_background_color, !border_color = !blueprint_button_active_border_color, !border_highlight_color = !border_color + #101010)
+  &:active
+    +button-colors(!font_color, !bg_color, !border_color, !border_highlight_color)
+
+//**
+  Sets the colors for a button in the hover state.
+  @param border_highlight_color
+    The highlight color defaults to whatever is the value of the border_color but it's one shade lighter.
+=button-hover-colors(!font_color = !blueprint_button_hover_font_color, !bg_color = !blueprint_button_hover_background_color, !border_color = !blueprint_button_hover_border_color, !border_highlight_color = !border_color + #101010)
+  &:hover
+    +button-colors(!font_color, !bg_color, !border_color, !border_highlight_color)
+
+=button-base(!float = false)
+  @if !float
+    :display block
+    +float(!float)
+  @else
+    +inline-block
+  :margin 0.7em 0.5em 0.7em 0
+  :border-width 1px
+  :border-style solid
+  :font-family= !blueprint_button_font_family
+  :font-size 100%
+  :line-height 130%
+  :text-decoration none
+  :font-weight bold
+  :cursor pointer
+  img
+    :margin 0 3px -3px 0 !important
+    :padding 0
+    :border none
+    :width 16px
+    :height 16px
+    :float none
+    
+
+=anchor-button(!float = false)
+  +button-base(!float)
+  :padding 5px 10px 5px 7px
+
+=button-button(!float = false)
+  +button-base(!float)
+  :width auto
+  :overflow visible
+  :padding 4px 10px 3px 7px
+  &[type]
+    :padding 4px 10px 4px 7px
+    :line-height 17px
+  *:first-child+html &[type]
+    :padding 4px 10px 3px 7px

data/frameworks/blueprint/stylesheets/blueprint/modules/_colors.sass

@@ -0,0 +1,33 @@
+!font_color            ||= #333
+!quiet_color           ||= !font_color + #333
+!loud_color            ||= !font_color - #222
+
+!header_color          ||= !font_color - #111
+
+!link_color            ||= #009
+!link_hover_color      ||= #000
+!link_focus_color      ||= !link_hover_color
+!link_active_color     ||= !link_color + #C00
+!link_visited_color    ||= !link_color - #333
+
+!feedback_border_color ||= #DDD
+!success_color         ||= #264409
+!success_bg_color      ||= #E6EFC2
+!success_border_color  ||= #C6D880
+
+!notice_color          ||= #514721
+!notice_bg_color       ||= #FFF6BF
+!notice_border_color   ||= #FFD324
+
+!error_color           ||= #8A1F11
+!error_bg_color        ||= #FBE3E4
+!error_border_color    ||= #FBC2C4
+
+!highlight_color       ||= #FF0
+!added_color           ||= #FFF
+!added_bg_color        ||= #060
+!removed_color         ||= #FFF
+!removed_bg_color      ||= #900
+
+!blueprint_table_header_color ||= #C3D9FF
+!blueprint_table_stripe_color ||= #E5ECF9

data/frameworks/blueprint/stylesheets/blueprint/modules/_debug.sass

@@ -0,0 +1,9 @@
+=showgrid(!image = "grid.png")
+  :background= image_url(!image)
+
+=blueprint-debug(!grid_image = "grid.png")
+  // Use this class on any column or container to see the grid.
+  // TODO: prefix this with the project path.
+  .showgrid
+    +showgrid(!grid_image)
+  

data/frameworks/blueprint/stylesheets/blueprint/modules/_fancy_type.sass

@@ -0,0 +1,81 @@
+/*
+  To install the fancy type plugin:
+    1. import the fancy_type module:
+      @import blueprint/modules/fancy_type
+    2. mixin +fancy-type to your project's body or at the top level of your stylesheet:
+      body
+        +fancy-type
+
+=fancy-type
+  +fancy-paragraphs
+  .caps
+    +caps
+  .dquo
+    +dquo
+  .alt
+    +alt
+
+/* Indentation instead of line shifts for sibling paragraphs. Mixin to a style like p + p
+=sibling-indentation
+  :text-indent 2em
+  :margin-top -1.5em
+  /* Don't want this in forms.
+  form &
+    :text-indent 0
+
+/* 
+  For great looking type, use this code instead of asdf: 
+  <span class="alt">asdf</span>  
+  Best used on prepositions and ampersands.
+
+=alt
+  :color #666
+  :font-family "Warnock Pro", "Goudy Old Style","Palatino","Book Antiqua", Georgia, serif
+  :font-style italic
+  :font-weight normal
+
+/*
+  For great looking quote marks in titles, replace "asdf" with:
+  <span class="dquo">&#8220;</span>asdf&#8221;
+  (That is, when the title starts with a quote mark). 
+  (You may have to change this value depending on your font size).
+=dquo(!offset = 0.5em)
+  :margin-left -!offset
+
+/*
+  Reduced size type with incremental leading
+  (http://www.markboulton.co.uk/journal/comments/incremental_leading/)
+  
+  This could be used for side notes. For smaller type, you don't necessarily want to 
+  follow the 1.5x vertical rhythm -- the line-height is too much. 
+  
+  Using this mixin, reduces your font size and line-height so that for 
+  every four lines of normal sized type, there is five lines of the sidenote. eg:
+  
+  Arguments:
+    font_size - The desired font size in pixels. This will be converted to ems for you. Defaults to 10px.
+    base_font_size - The base font size in pixels. Defaults to 12px
+    old_line_height - The old line height. Defaults to 1.5 times the base_font_size
+=incr(!font_size = 10px, !base_font_size = 12px, !old_line_height = !base_font_size * 1.5)
+  :font-size= 1em * !font_size / !base_font_size
+  :line-height= 1em * !old_line_height / !font_size * 4 / 5
+  :margin-bottom 1.5em
+
+/*
+  Surround uppercase words and abbreviations with this class.
+  Based on work by Jørgen Arnor Gårdsø Lom [http://twistedintellect.com/]
+=caps
+  :font-variant small-caps
+  :letter-spacing 1px
+  :text-transform lowercase
+  :font-size 1.2em
+  :line-height 1%
+  :font-weight bold
+  :padding 0 2px
+
+=fancy-paragraphs
+  p + p
+    +sibling-indentation
+  p.incr,
+  .incr p
+    +incr

data/frameworks/blueprint/stylesheets/blueprint/modules/_form.sass

@@ -0,0 +1,43 @@
+@import colors.sass
+
+=blueprint-form
+  label
+    :font-weight bold
+  fieldset
+    :padding 1.4em
+    :margin 0 0 1.5em 0
+    :border 1px solid #ccc
+  legend
+    :font-weight bold
+    :font-size 1.2em
+  input
+    &.text
+      :margin 0.5em 0
+      :border 1px solid #bbb
+      :width 300px
+      :padding 5px
+      &:focus
+        :border 1px solid #666
+    &.title
+      :font-size 1.5em
+  input.title
+    :margin 0.5em 0
+    :border 1px solid #bbb
+    :width 300px
+    :padding 5px
+    &:focus
+      :border 1px solid #666
+  textarea
+    :margin 0.5em 0
+    :border 1px solid #bbb
+    &:focus
+      :border 1px solid #666
+  select
+    :margin 0.5em 0
+    :border 1px solid #bbb
+    &:focus
+      :border 1px solid #666
+  textarea
+    :width 390px
+    :height 250px
+    :padding 5px

data/frameworks/blueprint/stylesheets/blueprint/modules/_grid.sass

@@ -0,0 +1,168 @@
+//  --------------------------------------------------------------
+//  SASS Gridification
+//  * Author:   Chris Eppstein
+//  A SASS adaptation of Blueprint CSS
+//  * Version:         0.7.1 (2008-02-25)
+//  * Website:         http://code.google.com/p/blueprintcss/
+//  Based on work by:
+//  * Lorin Tackett     [lorintackett.com]
+//  * Olav Bjorkoy      [bjorkoy.com]
+//  * Nathan Borror     [playgroundblues.com]
+//  * Jeff Croft        [jeffcroft.com]
+//  * Christian Metts   [mintchaos.com]
+//  * Khoi Vinh         [subtraction.com]
+//  Read more about using a grid here:
+//  * http://www.subtraction.com/2007/03/18/oh-yeeaahh
+//  --------------------------------------------------------------
+
+@import compass/utilities/general/float.sass
+
+// Main layout grid, override these constants to build your grid and container sizes.
+!blueprint_grid_columns ||= 24
+!blueprint_grid_width   ||= 30px
+!blueprint_grid_margin  ||= 10px
+
+!blueprint_grid_outer_width = !blueprint_grid_width + !blueprint_grid_margin
+!blueprint_container_size = !blueprint_grid_outer_width * !blueprint_grid_columns - !blueprint_grid_margin
+
+
+=blueprint-grid
+  // A container should group all your columns
+  .container
+    +container
+  .column, #{enumerate("div.span", 1, !blueprint_grid_columns)}
+    +column-base
+  // The last column in a row needs this class (or mixin) or it will end up on the next row.
+  .last, div.last
+    +last
+  // Use these classes (or mixins) to set the width of a column.
+  @for !n from 1 to !blueprint_grid_columns
+    .span-#{!n}
+      +span(!n)
+  .span-#{!blueprint_grid_columns}, div.span-#{!blueprint_grid_columns}
+    +span(!blueprint_grid_columns)
+    :margin 0
+  input, textarea, select
+    @for !n from 1 through !blueprint_grid_columns
+      &.span-#{!n}
+        +span(!n, true)
+  // Add these to a column to append empty cols.
+  @for !n from 1 to !blueprint_grid_columns
+    .append-#{!n}
+      +append(!n)
+  // Add these to a column to prepend empty cols.
+  @for !n from 1 to !blueprint_grid_columns
+    .prepend-#{!n}
+      +prepend(!n)
+  // Use these classes on an element to push it into the
+  // next column, or to pull it into the previous column.
+  #{enumerate(".pull", 1, !blueprint_grid_columns)}
+    +pull-base
+  @for !n from 1 through !blueprint_grid_columns
+    .pull-#{!n}
+      +pull-margins(!n)
+  #{enumerate(".push", 1, !blueprint_grid_columns)}
+    +push-base
+  @for !n from 1 through !blueprint_grid_columns
+    .push-#{!n}
+      +push-margins(!n)
+
+
+// Columns
+// Note: If you use this mixin without the class and want to support ie6
+//       you must set text-align left on your container element in an IE stylesheet.
+=container
+  :width = !blueprint_container_size
+  :margin 0 auto
+  +clearfix
+
+// The last column in a row needs this mixin or it will end up on the next row.
+// TODO add this to span mixin when we have optional arguments
+=last
+  :margin-right 0
+
+=span(!n, !override = false)
+  !width = !blueprint_grid_width * !n + (!blueprint_grid_margin * (!n - 1))
+  @if !override
+    :width = !width !important
+  @else
+    :width = !width
+
+=column-base(!last = false)
+  +float-left
+  @if !last
+    +last
+  @else
+    :margin-right = !blueprint_grid_margin
+  * html &
+    :overflow-x hidden
+
+// Use this mixins to set the width of n columns.
+=column(!n, !last = false)
+  +column-base(!last)
+  +span(!n)
+
+
+// Mixin to a column to append n empty cols.
+=append(!n)
+  :padding-right = (!blueprint_grid_outer_width) * !n
+
+// Mixin to a column to prepend n empty cols.
+=prepend(!n)
+  :padding-left = (!blueprint_grid_outer_width) * !n
+
+=pull-base
+  +float-left
+  :position relative
+
+=pull-margins(!n, !last = false)
+  @if !last
+    :margin-left = (-!blueprint_grid_outer_width * !n) + !blueprint_grid_margin
+  @else
+    :margin-left = -!blueprint_grid_outer_width * !n
+
+// mixin to a column to move it n columns to the left
+=pull(!n, !last = false)
+  +pull-base
+  +pull-margins(!n, !last)
+
+=push-base
+  +float-right
+  :position relative
+
+=push-margins(!n)
+  :margin= 0 (-!blueprint_grid_outer_width * !n) 1.5em (!blueprint_grid_outer_width * !n)
+
+// mixin to a column to push it n columns to the right
+=push(!n)
+  +push-base
+  +push-margins(!n)
+
+// Border on right hand side of a column.
+=border
+  :padding-right = !blueprint_grid_margin / 2 - 1
+  :margin-right = !blueprint_grid_margin / 2
+  :border-right 1px solid #eee
+
+// Border with more whitespace, spans one column.
+=colborder
+  :padding-right= !blueprint_grid_width - 0.5 * !blueprint_grid_margin - 1
+  :margin-right= !blueprint_grid_width - 0.5 * !blueprint_grid_margin
+  :border-right 1px solid #eee
+
+// Mixin this to an hr to make a horizontal ruler across a column.
+=colruler
+  :background #ddd
+  :color #ddd
+  :clear both
+  :float none
+  :width 100%
+  :height .1em
+  :margin 0 0 1.45em
+  :border none
+
+// Mixin this to an hr to make a horizontal spacer across a column.
+=colspacer
+  +colruler
+  :background #fff
+  :color #fff