[Blueprint] Moved the blueprint/modules/*.sass files to blueprint/*.sass. Old imports are still supported but are deprecated.
This commit is contained in:
parent
11a354e47e
commit
b69138059a
@ -32,7 +32,7 @@
|
|||||||
%a{ :href => "parts/grid.html" }
|
%a{ :href => "parts/grid.html" }
|
||||||
Grid
|
Grid
|
||||||
%td
|
%td
|
||||||
%a{ :href => "../../frameworks/blueprint/stylesheets/blueprint/modules/_grid.sass" }
|
%a{ :href => "../../frameworks/blueprint/stylesheets/blueprint/_grid.sass" }
|
||||||
grid.sass
|
grid.sass
|
||||||
%td
|
%td
|
||||||
Tests classes provided by the grid module.
|
Tests classes provided by the grid module.
|
||||||
@ -41,7 +41,7 @@
|
|||||||
%a{ :href => "parts/elements.html" }
|
%a{ :href => "parts/elements.html" }
|
||||||
Typography
|
Typography
|
||||||
%td
|
%td
|
||||||
%a{ :href => "../../frameworks/blueprint/stylesheets/blueprint/modules/_typography.sass" }
|
%a{ :href => "../../frameworks/blueprint/stylesheets/blueprint/_typography.sass" }
|
||||||
typography.sass
|
typography.sass
|
||||||
%td
|
%td
|
||||||
Tests HTML elements which gets set in the typography module.
|
Tests HTML elements which gets set in the typography module.
|
||||||
@ -50,7 +50,7 @@
|
|||||||
%a{ :href => "parts/forms.html" }
|
%a{ :href => "parts/forms.html" }
|
||||||
Forms
|
Forms
|
||||||
%td
|
%td
|
||||||
%a{ :href => "../../frameworks/blueprint/stylesheets/blueprint/modules/_form.sass" }
|
%a{ :href => "../../frameworks/blueprint/stylesheets/blueprint/_form.sass" }
|
||||||
form.sass
|
form.sass
|
||||||
%td
|
%td
|
||||||
Tests classes and default look provided by the form module.
|
Tests classes and default look provided by the form module.
|
||||||
|
@ -1,5 +1,5 @@
|
|||||||
@import blueprint.sass
|
@import blueprint.sass
|
||||||
@import blueprint/modules/scaffolding.sass
|
@import blueprint/scaffolding.sass
|
||||||
@import compass/reset.sass
|
@import compass/reset.sass
|
||||||
|
|
||||||
+blueprint
|
+blueprint
|
||||||
|
@ -31,13 +31,13 @@
|
|||||||
%a{ :href => "plugins/fancy_type.html" }
|
%a{ :href => "plugins/fancy_type.html" }
|
||||||
Fancy Type
|
Fancy Type
|
||||||
%td
|
%td
|
||||||
%a{ :href => "http://github.com/chriseppstein/compass/blob/master/frameworks/blueprint/stylesheets/blueprint/modules/_grid.sass" }
|
%a{ :href => "http://github.com/chriseppstein/compass/blob/master/frameworks/blueprint/stylesheets/blueprint/_grid.sass" }
|
||||||
grid.sass
|
grid.sass
|
||||||
,
|
,
|
||||||
%a{ :href => "http://github.com/chriseppstein/compass/blob/master/frameworks/blueprint/stylesheets/blueprint/modules/_typography.sass" }
|
%a{ :href => "http://github.com/chriseppstein/compass/blob/master/frameworks/blueprint/stylesheets/blueprint/_typography.sass" }
|
||||||
typography.sass
|
typography.sass
|
||||||
,
|
,
|
||||||
%a{ :href => "http://github.com/chriseppstein/compass/blob/master/frameworks/blueprint/stylesheets/blueprint/modules/_fancy_type.sass" }
|
%a{ :href => "http://github.com/chriseppstein/compass/blob/master/frameworks/blueprint/stylesheets/blueprint/_fancy_type.sass" }
|
||||||
fancy_type.sass
|
fancy_type.sass
|
||||||
%td
|
%td
|
||||||
A simple sample page, with common elements and fancy type.
|
A simple sample page, with common elements and fancy type.
|
||||||
@ -46,7 +46,7 @@
|
|||||||
%a{ :href => "plugins/buttons.html" }
|
%a{ :href => "plugins/buttons.html" }
|
||||||
Buttons
|
Buttons
|
||||||
%td
|
%td
|
||||||
%a{ :href => "http://github.com/chriseppstein/compass/blob/master/frameworks/blueprint/stylesheets/blueprint/modules/_buttons.sass" }
|
%a{ :href => "http://github.com/chriseppstein/compass/blob/master/frameworks/blueprint/stylesheets/blueprint/_buttons.sass" }
|
||||||
buttons.sass
|
buttons.sass
|
||||||
%td
|
%td
|
||||||
A simple page, showing links and buttons styled using the button plugin.
|
A simple page, showing links and buttons styled using the button plugin.
|
||||||
@ -55,7 +55,7 @@
|
|||||||
%a{ :href => "plugins/link_icons.html" }
|
%a{ :href => "plugins/link_icons.html" }
|
||||||
Link Icons
|
Link Icons
|
||||||
%td
|
%td
|
||||||
%a{ :href => "http://github.com/chriseppstein/compass/blob/master/frameworks/blueprint/stylesheets/blueprint/modules/_link_icons.sass" }
|
%a{ :href => "http://github.com/chriseppstein/compass/blob/master/frameworks/blueprint/stylesheets/blueprint/_link_icons.sass" }
|
||||||
link_icons.sass
|
link_icons.sass
|
||||||
%td
|
%td
|
||||||
A simple page, showing links icons.
|
A simple page, showing links icons.
|
||||||
@ -64,7 +64,7 @@
|
|||||||
%a{ :href => "plugins/rtl.html" }
|
%a{ :href => "plugins/rtl.html" }
|
||||||
RTL
|
RTL
|
||||||
%td
|
%td
|
||||||
%a{ :href => "http://github.com/chriseppstein/compass/blob/master/frameworks/blueprint/stylesheets/blueprint/modules/_rtl.sass" }
|
%a{ :href => "http://github.com/chriseppstein/compass/blob/master/frameworks/blueprint/stylesheets/blueprint/_rtl.sass" }
|
||||||
rtl.sass
|
rtl.sass
|
||||||
%td
|
%td
|
||||||
A simple page, showing a right-to-left grid layout.
|
A simple page, showing a right-to-left grid layout.
|
||||||
|
@ -1,5 +1,5 @@
|
|||||||
@import compass/utilities/general/float.sass
|
@import compass/utilities/general/float.sass
|
||||||
@import blueprint/modules/buttons.sass
|
@import blueprint/buttons.sass
|
||||||
|
|
||||||
//
|
//
|
||||||
Use the following HTML code to place the buttons on your site:
|
Use the following HTML code to place the buttons on your site:
|
||||||
@ -23,7 +23,7 @@ a.button
|
|||||||
+anchor-button("left")
|
+anchor-button("left")
|
||||||
// All the button color mixins take 4 optional arguments:
|
// All the button color mixins take 4 optional arguments:
|
||||||
// font color, background color, border color, border highlight color
|
// font color, background color, border color, border highlight color
|
||||||
// the first three default to constants set in blueprint/modules/buttons.sass
|
// the first three default to constants set in blueprint/buttons.sass
|
||||||
// the last one defaults to a shade lighter than the border color.
|
// the last one defaults to a shade lighter than the border color.
|
||||||
+button-colors
|
+button-colors
|
||||||
+button-hover-colors
|
+button-hover-colors
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
@import blueprint/modules/link_icons.sass
|
@import blueprint/link_icons.sass
|
||||||
|
|
||||||
// This turns link icons on for all links. You can change the scoping selector from
|
// This turns link icons on for all links. You can change the scoping selector from
|
||||||
// body to something more specific if you prefer.
|
// body to something more specific if you prefer.
|
||||||
|
@ -1,7 +1,7 @@
|
|||||||
@import blueprint.sass
|
@import blueprint.sass
|
||||||
@import blueprint/modules/fancy_type.sass
|
@import blueprint/fancy_type.sass
|
||||||
@import blueprint/modules/scaffolding.sass
|
@import blueprint/scaffolding.sass
|
||||||
@import blueprint/modules/rtl.sass
|
@import blueprint/rtl.sass
|
||||||
@import compass/reset.sass
|
@import compass/reset.sass
|
||||||
|
|
||||||
|
|
||||||
|
@ -1,6 +1,6 @@
|
|||||||
@import blueprint.sass
|
@import blueprint.sass
|
||||||
@import blueprint/modules/fancy_type.sass
|
@import blueprint/fancy_type.sass
|
||||||
@import blueprint/modules/scaffolding.sass
|
@import blueprint/scaffolding.sass
|
||||||
@import compass/reset.sass
|
@import compass/reset.sass
|
||||||
|
|
||||||
|
|
||||||
|
@ -1,7 +1,7 @@
|
|||||||
@import blueprint.sass
|
@import blueprint.sass
|
||||||
@import blueprint/modules/fancy_type.sass
|
@import blueprint/fancy_type.sass
|
||||||
@import blueprint/modules/scaffolding.sass
|
@import blueprint/scaffolding.sass
|
||||||
@import blueprint/modules/liquid.sass
|
@import blueprint/liquid.sass
|
||||||
@import compass/reset.sass
|
@import compass/reset.sass
|
||||||
|
|
||||||
.container
|
.container
|
||||||
|
@ -1,6 +1,6 @@
|
|||||||
@import blueprint.sass
|
@import blueprint.sass
|
||||||
@import blueprint/modules/fancy_type.sass
|
@import blueprint/fancy_type.sass
|
||||||
@import blueprint/modules/scaffolding.sass
|
@import blueprint/scaffolding.sass
|
||||||
@import compass/reset.sass
|
@import compass/reset.sass
|
||||||
|
|
||||||
body.blueprint
|
body.blueprint
|
||||||
|
@ -1,8 +1,8 @@
|
|||||||
@import compass/reset.sass
|
@import compass/reset.sass
|
||||||
@import compass/utilities.sass
|
@import compass/utilities.sass
|
||||||
@import yui/modules/base.sass
|
@import yui/modules/base.sass
|
||||||
@import blueprint/modules/grid.sass
|
@import blueprint/grid.sass
|
||||||
@import blueprint/modules/scaffolding.sass
|
@import blueprint/scaffolding.sass
|
||||||
@import compass/utilities/text/ellipsis.sass
|
@import compass/utilities/text/ellipsis.sass
|
||||||
|
|
||||||
html
|
html
|
||||||
|
@ -1,3 +1,31 @@
|
|||||||
@import blueprint/screen.sass
|
@import blueprint/colors.sass
|
||||||
|
@import blueprint/grid.sass
|
||||||
|
@import blueprint/typography.sass
|
||||||
|
@import blueprint/utilities.sass
|
||||||
|
@import blueprint/form.sass
|
||||||
|
@import blueprint/interaction.sass
|
||||||
|
@import blueprint/debug.sass
|
||||||
@import blueprint/print.sass
|
@import blueprint/print.sass
|
||||||
@import blueprint/ie.sass
|
@import blueprint/ie.sass
|
||||||
|
|
||||||
|
// Usage examples:
|
||||||
|
// As a top-level mixin, apply to any page that includes the stylesheet:
|
||||||
|
// +blueprint
|
||||||
|
// Scoped by a presentational class:
|
||||||
|
// body.blueprint
|
||||||
|
// +blueprint(true)
|
||||||
|
// Scoped by semantic selectors:
|
||||||
|
// body#page-1, body#page-2, body.a-special-page-type
|
||||||
|
// +blueprint(true)
|
||||||
|
// Deprecated:
|
||||||
|
// You can pass the body selector as the first argument when used as a top-level mixin
|
||||||
|
// +blueprint("body#page-1, body#page-2, body.a-special-page-type")
|
||||||
|
=blueprint(!body_selector = "body")
|
||||||
|
@if not (!body_selector == "body" or !body_selector == true)
|
||||||
|
@debug "[DEPRECATED] To specify a the selector \"#{!body_selector}\" to +blueprint, pass true as the first argument and mix it into #{!body_selector}."
|
||||||
|
+blueprint-typography(!body_selector)
|
||||||
|
+blueprint-utilities
|
||||||
|
+blueprint-grid
|
||||||
|
+blueprint-debug
|
||||||
|
+blueprint-interaction
|
||||||
|
+blueprint-form
|
||||||
|
@ -0,0 +1,84 @@
|
|||||||
|
@import compass/css3/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
|
@ -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
|
@ -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)
|
||||||
|
|
@ -0,0 +1,82 @@
|
|||||||
|
@import typography.sass
|
||||||
|
|
||||||
|
//
|
||||||
|
To install the fancy type plugin:
|
||||||
|
1. import the fancy_type module: @import blueprint/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">“</span>asdf”
|
||||||
|
(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 = !blueprint_font_size, !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
|
@ -0,0 +1,55 @@
|
|||||||
|
@import colors.sass
|
||||||
|
|
||||||
|
// Mixin for producing Blueprint "inline" forms. Should be used with the blueprint-form mixin.
|
||||||
|
=blueprint-inline-form
|
||||||
|
line-height: 3
|
||||||
|
p
|
||||||
|
margin-bottom: 0
|
||||||
|
|
||||||
|
=blueprint-form
|
||||||
|
+blueprint-form-layout
|
||||||
|
+blueprint-form-borders
|
||||||
|
+blueprint-form-sizes
|
||||||
|
|
||||||
|
=blueprint-form-layout
|
||||||
|
label
|
||||||
|
font-weight: bold
|
||||||
|
fieldset
|
||||||
|
padding: 1.4em
|
||||||
|
margin: 0 0 1.5em 0
|
||||||
|
legend
|
||||||
|
font-weight: bold
|
||||||
|
font-size: 1.2em
|
||||||
|
input
|
||||||
|
&.text, &.title, &[type=text]
|
||||||
|
margin: 0.5em 0
|
||||||
|
background-color: #fff
|
||||||
|
padding: 5px
|
||||||
|
&.title
|
||||||
|
font-size: 1.5em
|
||||||
|
&[type=checkbox], &.checkbox,
|
||||||
|
&[type=radio], &.radio
|
||||||
|
position: relative
|
||||||
|
top: 0.25em
|
||||||
|
textarea
|
||||||
|
margin: 0.5em 0
|
||||||
|
padding: 5px
|
||||||
|
select
|
||||||
|
margin: 0.5em 0
|
||||||
|
|
||||||
|
=blueprint-form-sizes(!input_width = 300px, !textarea_width = 390px, !textarea_height = 250px)
|
||||||
|
input.text, input.title
|
||||||
|
width= !input_width
|
||||||
|
textarea
|
||||||
|
width= !textarea_width
|
||||||
|
height= !textarea_height
|
||||||
|
|
||||||
|
=blueprint-form-borders(!unfocused_border_color = #bbb, !focus_border_color = #666, !fieldset_border_color = #ccc)
|
||||||
|
fieldset
|
||||||
|
border= 1px "solid" !fieldset_border_color
|
||||||
|
input.text, input.title,
|
||||||
|
textarea,
|
||||||
|
select
|
||||||
|
border= 1px "solid" !unfocused_border_color
|
||||||
|
&:focus
|
||||||
|
border= 1px "solid" !focus_border_color
|
@ -0,0 +1,178 @@
|
|||||||
|
// --------------------------------------------------------------
|
||||||
|
// 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)
|
||||||
|
.prepend-top
|
||||||
|
+prepend-top
|
||||||
|
.append-bottom
|
||||||
|
+append-bottom
|
||||||
|
|
||||||
|
|
||||||
|
// 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
|
||||||
|
|
||||||
|
=append-bottom(!amount = 1.5em)
|
||||||
|
margin-bottom= !amount
|
||||||
|
|
||||||
|
=prepend-top(!amount = 1.5em)
|
||||||
|
margin-top= !amount
|
||||||
|
|
||||||
|
=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(!border_color = #eee, !border_width = 1px)
|
||||||
|
padding-right= !blueprint_grid_margin / 2 - !border_width
|
||||||
|
margin-right= !blueprint_grid_margin / 2
|
||||||
|
border-right: #{!border_width} solid #{!border_color}
|
||||||
|
|
||||||
|
// Border with more whitespace, spans one column.
|
||||||
|
=colborder(!border_color = #eee, !border_width = 1px)
|
||||||
|
padding-right= floor((!blueprint_grid_width + 2 * !blueprint_grid_margin - !border_width)/2)
|
||||||
|
margin-right= ceil((!blueprint_grid_width + 2 * !blueprint_grid_margin - !border_width)/2)
|
||||||
|
border-right: #{!border_width} solid #{!border_color}
|
||||||
|
|
||||||
|
// Mixin this to an hr to make a horizontal ruler across a column.
|
||||||
|
=colruler(!border_color = #ddd)
|
||||||
|
background= !border_color
|
||||||
|
color= !border_color
|
||||||
|
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
|
@ -0,0 +1,58 @@
|
|||||||
|
@import colors.sass
|
||||||
|
|
||||||
|
|
||||||
|
=blueprint-interaction
|
||||||
|
.error
|
||||||
|
+error
|
||||||
|
.notice
|
||||||
|
+notice
|
||||||
|
.success
|
||||||
|
+success
|
||||||
|
.hide
|
||||||
|
display: none
|
||||||
|
.highlight
|
||||||
|
+highlight
|
||||||
|
.added
|
||||||
|
+added
|
||||||
|
.removed
|
||||||
|
+removed
|
||||||
|
|
||||||
|
=feedback-base
|
||||||
|
padding: .8em
|
||||||
|
margin-bottom: 1em
|
||||||
|
border= 2px "solid" !feedback_border_color
|
||||||
|
|
||||||
|
=error
|
||||||
|
+feedback-base
|
||||||
|
background= !error_bg_color
|
||||||
|
color= !error_color
|
||||||
|
border-color= !error_border_color
|
||||||
|
a
|
||||||
|
color= !error_color
|
||||||
|
|
||||||
|
=notice
|
||||||
|
+feedback-base
|
||||||
|
background= !notice_bg_color
|
||||||
|
color= !notice_color
|
||||||
|
border-color= !notice_border_color
|
||||||
|
a
|
||||||
|
color= !notice_color
|
||||||
|
|
||||||
|
=success
|
||||||
|
+feedback-base
|
||||||
|
background= !success_bg_color
|
||||||
|
color= !success_color
|
||||||
|
border-color= !success_border_color
|
||||||
|
a
|
||||||
|
color= !success_color
|
||||||
|
|
||||||
|
=highlight
|
||||||
|
background= !highlight_color
|
||||||
|
|
||||||
|
=added
|
||||||
|
background= !added_bg_color
|
||||||
|
color= !added_color
|
||||||
|
|
||||||
|
=removed
|
||||||
|
background= !removed_bg_color
|
||||||
|
color= !removed_color
|
@ -0,0 +1,44 @@
|
|||||||
|
=no-link-icon
|
||||||
|
background: transparent none !important
|
||||||
|
padding: 0 !important
|
||||||
|
margin: 0 !important
|
||||||
|
|
||||||
|
=link-icon-base
|
||||||
|
padding: 2px 22px 2px 0
|
||||||
|
margin: -2px 0
|
||||||
|
background-repeat: no-repeat
|
||||||
|
background-position: right center
|
||||||
|
|
||||||
|
=link-icon(!name, !include_base = true)
|
||||||
|
@if !include_base
|
||||||
|
+link-icon-base
|
||||||
|
background-image= image_url("link_icons/#{!name}")
|
||||||
|
|
||||||
|
=link-icons
|
||||||
|
a[href^="http:"],
|
||||||
|
a[href^="mailto:"],
|
||||||
|
a[href^="http:"]:visited,
|
||||||
|
a[href$=".pdf"],
|
||||||
|
a[href$=".doc"],
|
||||||
|
a[href$=".xls"],
|
||||||
|
a[href$=".rss"],
|
||||||
|
a[href$=".rdf"],
|
||||||
|
a[href^="aim:"]
|
||||||
|
+link-icon-base
|
||||||
|
a[href^="http:"]
|
||||||
|
+link-icon("external.png", false)
|
||||||
|
a[href^="mailto:"]
|
||||||
|
+link-icon("email.png", false)
|
||||||
|
a[href^="http:"]:visited
|
||||||
|
+link-icon("visited.png", false)
|
||||||
|
a[href$=".pdf"]
|
||||||
|
+link-icon("pdf.png", false)
|
||||||
|
a[href$=".doc"]
|
||||||
|
+link-icon("doc.png", false)
|
||||||
|
a[href$=".xls"]
|
||||||
|
+link-icon("xls.png", false)
|
||||||
|
a[href$=".rss"],
|
||||||
|
a[href$=".rdf"]
|
||||||
|
+link-icon("feed.png", false)
|
||||||
|
a[href^="aim:"]
|
||||||
|
+link-icon("im.png", false)
|
@ -0,0 +1,141 @@
|
|||||||
|
// --------------------------------------------------------------
|
||||||
|
// SASS Gridification
|
||||||
|
// * Author: Geoff Garside
|
||||||
|
// A SASS adaptation of Blueprint CSS
|
||||||
|
// * Version: 0.7.1 (2008-02-25)
|
||||||
|
// * Website: http://code.google.com/p/blueprintcss/
|
||||||
|
// Based on work by:
|
||||||
|
// * Chris Eppstein [eppsteins.net]
|
||||||
|
// * Lorin Tacket [lorintackett.com]
|
||||||
|
// * Olav Bjorkoy [bjorkoy.com]
|
||||||
|
// * Nathan Borror [playgroundblues.com]
|
||||||
|
// * Jeff Croft [jeffcroft.com]
|
||||||
|
// * Christian Metts [mintchaos.com]
|
||||||
|
// * Khoi Vinh [subtraction.com]
|
||||||
|
// Liquid grid work by:
|
||||||
|
// * Ben Listwon
|
||||||
|
// * David Bedingfield
|
||||||
|
// * Andrei Michael Herasimchuk
|
||||||
|
// Involution Studios, http://www.involutionstudios.com
|
||||||
|
// Read more about using a grid here:
|
||||||
|
// * subtraction.com/archives/2007/0318_oh_yeeaahh.php
|
||||||
|
// -----
|
||||||
|
// By default, the grid is 80% of window width, with 24 columns.
|
||||||
|
//
|
||||||
|
// To make the grid fixed, simply change the .container width
|
||||||
|
// property to a pixel value. e.g., 960px.
|
||||||
|
// -----
|
||||||
|
// To use:
|
||||||
|
// This module is a REPLACEMENT for the grid module. Simply import it:
|
||||||
|
// @import blueprint.sass
|
||||||
|
// @import blueprint/liquid.sass
|
||||||
|
// -------------------------------------------------------------------
|
||||||
|
|
||||||
|
@import compass/utilities/general/float.sass
|
||||||
|
|
||||||
|
// Main layout grid, override these constants to build your grid and container sizes.
|
||||||
|
// The width shown gives the right floored percentage values.
|
||||||
|
!blueprint_liquid_grid_columns ||= 24
|
||||||
|
!blueprint_liquid_grid_width ||= 4.173%
|
||||||
|
!blueprint_liquid_grid_margin ||= 0.833em
|
||||||
|
|
||||||
|
// Do not edit below this line unless you really know what you're doing.
|
||||||
|
!blueprint_liquid_container_width = 80%
|
||||||
|
!blueprint_liquid_container_min_width = 950px
|
||||||
|
!blueprint_liquid_grid_push_pull = -(!blueprint_liquid_grid_margin * 4)
|
||||||
|
|
||||||
|
=blueprint-liquid-grid
|
||||||
|
// A container should group all your columns
|
||||||
|
.container
|
||||||
|
+container
|
||||||
|
// Use these classes (or mixins) to set the width of a column.
|
||||||
|
@for !n from 1 to !blueprint_liquid_grid_columns + 1
|
||||||
|
.span-#{!n}
|
||||||
|
+span(!n)
|
||||||
|
div
|
||||||
|
&.span-#{!n}
|
||||||
|
+column(!n, !n == !blueprint_liquid_grid_columns)
|
||||||
|
// The last column in a row needs this class (or mixin) or it will end up on the next row.
|
||||||
|
div.last
|
||||||
|
+last
|
||||||
|
// Add these to a column to append empty cols.
|
||||||
|
@for !n from 1 to !blueprint_liquid_grid_columns
|
||||||
|
.append-#{!n}
|
||||||
|
+append(!n)
|
||||||
|
// Add these to a column to prepend empty cols.
|
||||||
|
@for !n from 1 to !blueprint_liquid_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.
|
||||||
|
@for !n from 1 to !blueprint_liquid_grid_columns + 1
|
||||||
|
.pull-#{!n}
|
||||||
|
+pull(!n)
|
||||||
|
@for !n from 1 to !blueprint_liquid_grid_columns + 1
|
||||||
|
.push-#{!n}
|
||||||
|
+push(!n)
|
||||||
|
|
||||||
|
=container
|
||||||
|
min-width= !blueprint_liquid_container_min_width
|
||||||
|
width= !blueprint_liquid_container_width
|
||||||
|
margin: 0 auto
|
||||||
|
+clearfix
|
||||||
|
|
||||||
|
=span(!n, !override = false)
|
||||||
|
!width = (!blueprint_liquid_grid_width * !n) - ((!blueprint_liquid_grid_width * !n) % 1)
|
||||||
|
@if !override
|
||||||
|
width= !width !important
|
||||||
|
@else
|
||||||
|
width= !width
|
||||||
|
|
||||||
|
=last
|
||||||
|
margin-right: 0
|
||||||
|
|
||||||
|
=column(!n, !last = false)
|
||||||
|
+float-left
|
||||||
|
overflow: hidden
|
||||||
|
+span(!n)
|
||||||
|
@if !last
|
||||||
|
+last
|
||||||
|
@else
|
||||||
|
margin-right= !blueprint_liquid_grid_margin
|
||||||
|
|
||||||
|
=append(!n)
|
||||||
|
padding-right= (!blueprint_liquid_grid_width * !n) - ((!blueprint_liquid_grid_width * !n) % 1)
|
||||||
|
|
||||||
|
=prepend(!n)
|
||||||
|
padding-left= (!blueprint_liquid_grid_width * !n) - ((!blueprint_liquid_grid_width * !n) % 1)
|
||||||
|
|
||||||
|
=pull(!n, !last = false)
|
||||||
|
margin-left= (!blueprint_liquid_grid_push_pull * !n)
|
||||||
|
|
||||||
|
=push(!n)
|
||||||
|
+float-right
|
||||||
|
margin:
|
||||||
|
top: 0
|
||||||
|
left: 1.5em
|
||||||
|
right= (!blueprint_liquid_grid_push_pull * !n)
|
||||||
|
bottom: 0
|
||||||
|
|
||||||
|
=border
|
||||||
|
border-right: 1px solid #eee
|
||||||
|
|
||||||
|
=colborder
|
||||||
|
padding-right: 2%
|
||||||
|
margin-right: 2%
|
||||||
|
+border
|
||||||
|
|
||||||
|
=colruler
|
||||||
|
background: #ddd
|
||||||
|
color: #ddd
|
||||||
|
clear: both
|
||||||
|
width: 100%
|
||||||
|
height: 0.083em
|
||||||
|
margin: 0 0 1.583em
|
||||||
|
border: none
|
||||||
|
|
||||||
|
=colspacer
|
||||||
|
+colruler
|
||||||
|
background: #fff
|
||||||
|
color: #fff
|
||||||
|
|
@ -1,4 +1,4 @@
|
|||||||
@import modules/typography.sass
|
@import typography.sass
|
||||||
@import compass/utilities/general/float.sass
|
@import compass/utilities/general/float.sass
|
||||||
|
|
||||||
|
|
||||||
|
@ -1,3 +1,56 @@
|
|||||||
@import modules/reset.sass
|
// Global reset rules.
|
||||||
|
// For more specific resets, use the reset mixins provided below
|
||||||
|
=blueprint-global-reset
|
||||||
|
html, body
|
||||||
|
+blueprint-reset
|
||||||
|
+blueprint-nested-reset
|
||||||
|
|
||||||
+blueprint-global-reset
|
// Reset all elements within some selector scope.To reset the selector itself,
|
||||||
|
// mixin the appropriate reset mixin for that element type as well. This could be
|
||||||
|
// useful if you want to style a part of your page in a dramatically different way.
|
||||||
|
=blueprint-nested-reset
|
||||||
|
div, span, object, iframe, h1, h2, h3, h4, h5, h6, p,
|
||||||
|
pre, a, abbr, acronym, address, code, del, dfn, em, img,
|
||||||
|
dl, dt, dd, ol, ul, li, fieldset, form, label, legend, caption, tbody, tfoot, thead, tr
|
||||||
|
+blueprint-reset
|
||||||
|
blockquote, q
|
||||||
|
+blueprint-reset-quotation
|
||||||
|
th, td, caption
|
||||||
|
+blueprint-reset-table-cell
|
||||||
|
table
|
||||||
|
+blueprint-reset-table
|
||||||
|
a img
|
||||||
|
border: none
|
||||||
|
|
||||||
|
=blueprint-reset-box-model
|
||||||
|
margin: 0
|
||||||
|
padding: 0
|
||||||
|
border: 0
|
||||||
|
|
||||||
|
=blueprint-reset
|
||||||
|
+blueprint-reset-box-model
|
||||||
|
font:
|
||||||
|
weight: inherit
|
||||||
|
style: inherit
|
||||||
|
size: 100%
|
||||||
|
family: inherit
|
||||||
|
vertical-align: baseline
|
||||||
|
|
||||||
|
=blueprint-reset-quotation
|
||||||
|
+blueprint-reset
|
||||||
|
quotes: "" ""
|
||||||
|
&:before,
|
||||||
|
&:after
|
||||||
|
content: ""
|
||||||
|
|
||||||
|
=blueprint-reset-table-cell
|
||||||
|
+blueprint-reset
|
||||||
|
text-align: left
|
||||||
|
font-weight: normal
|
||||||
|
vertical-align: middle
|
||||||
|
|
||||||
|
=blueprint-reset-table
|
||||||
|
+blueprint-reset
|
||||||
|
border-collapse: separate
|
||||||
|
border-spacing: 0
|
||||||
|
vertical-align: middle
|
||||||
|
122
lib/compass/frameworks/blueprint/stylesheets/blueprint/_rtl.sass
Normal file
122
lib/compass/frameworks/blueprint/stylesheets/blueprint/_rtl.sass
Normal file
@ -0,0 +1,122 @@
|
|||||||
|
@import grid.sass
|
||||||
|
@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
|
||||||
|
|
||||||
|
// 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
|
||||||
|
direction: rtl
|
||||||
|
+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-left: 0
|
||||||
|
|
||||||
|
=column-base(!last = false)
|
||||||
|
+float-right
|
||||||
|
@if !last
|
||||||
|
+last
|
||||||
|
@else
|
||||||
|
margin-left= !blueprint_grid_margin
|
||||||
|
* html &
|
||||||
|
overflow-x: hidden
|
||||||
|
|
||||||
|
// Mixin to a column to append n empty cols.
|
||||||
|
=append(!n)
|
||||||
|
padding-left= (!blueprint_grid_outer_width) * !n
|
||||||
|
|
||||||
|
// Mixin to a column to prepend n empty cols.
|
||||||
|
=prepend(!n)
|
||||||
|
padding-right= (!blueprint_grid_outer_width) * !n
|
||||||
|
|
||||||
|
// mixin to a column to move it n columns to the left
|
||||||
|
=pull(!n, !last = false)
|
||||||
|
position: relative
|
||||||
|
@if !last
|
||||||
|
margin-right= (-!blueprint_grid_outer_width * !n) + !blueprint_grid_margin
|
||||||
|
@else
|
||||||
|
margin-right= -!blueprint_grid_outer_width * !n
|
||||||
|
|
||||||
|
// mixin to a column to push it n columns to the right
|
||||||
|
=push(!n)
|
||||||
|
+float-right
|
||||||
|
position: relative
|
||||||
|
margin:
|
||||||
|
top: 0
|
||||||
|
left= -!blueprint_grid_outer_width * !n
|
||||||
|
bottom: 1.5em
|
||||||
|
right= !blueprint_grid_outer_width * !n
|
||||||
|
|
||||||
|
// Border on left hand side of a column.
|
||||||
|
=border
|
||||||
|
padding-left= !blueprint_grid_margin / 2 - 1
|
||||||
|
margin-left= !blueprint_grid_margin / 2
|
||||||
|
border-left: 1px solid #eee
|
||||||
|
|
||||||
|
// Border with more whitespace, spans one column.
|
||||||
|
=colborder
|
||||||
|
padding-left= (!blueprint_grid_width - 2 * !blueprint_grid_margin - 1)/2
|
||||||
|
margin-left= (!blueprint_grid_width - 2 * !blueprint_grid_margin)/2
|
||||||
|
border-left: 1px solid #eee
|
||||||
|
|
||||||
|
// Usage examples:
|
||||||
|
// As a top-level mixin, apply to any page that includes the stylesheet:
|
||||||
|
// +rtl-typography
|
||||||
|
// Scoped by a presentational class:
|
||||||
|
// body.blueprint
|
||||||
|
// +rtl-typography(true)
|
||||||
|
// Scoped by semantic selectors:
|
||||||
|
// body#page-1, body#page-2, body.a-special-page-type
|
||||||
|
// +rtl-typography(true)
|
||||||
|
// Deprecated:
|
||||||
|
// You can pass the body selector as the first argument when used as a top-level mixin
|
||||||
|
// +rtl-typography("body#page-1, body#page-2, body.a-special-page-type")
|
||||||
|
=rtl-typography(!body_selector = "body")
|
||||||
|
@if !body_selector == true
|
||||||
|
html &
|
||||||
|
font-family: Arial, sans-serif
|
||||||
|
+rtl-typography-defaults
|
||||||
|
@else
|
||||||
|
html #{!body_selector}
|
||||||
|
font-family: Arial, sans-serif
|
||||||
|
@if !body_selector != "body"
|
||||||
|
@debug "[DEPRECATED] To specify a the selector \"#{!body_selector}\" to +rtl-typography, pass true as the first argument and mix it into #{!body_selector}."
|
||||||
|
+rtl-typography-defaults
|
||||||
|
@if !body_selector == "body"
|
||||||
|
body
|
||||||
|
+rtl-typography-defaults
|
||||||
|
|
||||||
|
=rtl-typography-defaults
|
||||||
|
h1, h2, h3, h4, h5, h6
|
||||||
|
font-family: Arial, sans-serif
|
||||||
|
|
||||||
|
pre, code, tt
|
||||||
|
font-family: monospace
|
||||||
|
|
||||||
|
p
|
||||||
|
img.right
|
||||||
|
+float-left
|
||||||
|
margin: 1.5em 1.5em 1.5em 0
|
||||||
|
padding: 0
|
||||||
|
img.left
|
||||||
|
+float-right
|
||||||
|
margin: 1.5em 0 1.5em 1.5em
|
||||||
|
padding: 0
|
||||||
|
|
||||||
|
dd, ul, ol
|
||||||
|
margin-left: 0
|
||||||
|
margin-right: 1.5em
|
||||||
|
|
||||||
|
td, th
|
||||||
|
text-align: right
|
@ -0,0 +1,47 @@
|
|||||||
|
@import grid.sass
|
||||||
|
// The styles contained here are meant to provide for an attractive experience out of the box
|
||||||
|
// and are expected to be removed once custom visual design begins.
|
||||||
|
|
||||||
|
// The +blueprint-scaffolding 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-scaffolding
|
||||||
|
// Scoped by a single presentational body class:
|
||||||
|
// +blueprint-scaffolding("body.blueprint")
|
||||||
|
// Semantically:
|
||||||
|
// +blueprint-scaffolding("body#page-1, body#page-2, body.a-special-page-type")
|
||||||
|
// Alternatively, you can use the +blueprint-scaffolding-body and +blueprint-scaffolding-defaults
|
||||||
|
// mixins to construct your own semantic style rules.
|
||||||
|
|
||||||
|
=blueprint-scaffolding(!body_selector = "body")
|
||||||
|
#{!body_selector}
|
||||||
|
@if !body_selector != "body"
|
||||||
|
+blueprint-scaffolding-defaults
|
||||||
|
@if !body_selector == "body"
|
||||||
|
+blueprint-scaffolding-defaults
|
||||||
|
|
||||||
|
// The styles this mixin provides were deprecated in Blueprint 0.9 and is no longer part of the
|
||||||
|
// main scaffolding, but the mixin is still available if you want to use it.
|
||||||
|
=blueprint-scaffolding-body
|
||||||
|
margin: 1.5em 0
|
||||||
|
|
||||||
|
// Mixin +box to create a padded box inside a column.
|
||||||
|
=box
|
||||||
|
padding: 1.5em
|
||||||
|
margin-bottom: 1.5em
|
||||||
|
background: #E5ECF9
|
||||||
|
|
||||||
|
=blueprint-scaffolding-defaults
|
||||||
|
.box
|
||||||
|
+box
|
||||||
|
// Border on right hand side of a column. You can comment this out if you don't plan to use it.
|
||||||
|
div.border
|
||||||
|
+border
|
||||||
|
// Border with more whitespace, spans one column.
|
||||||
|
div.colborder
|
||||||
|
+colborder
|
||||||
|
hr
|
||||||
|
+colruler
|
||||||
|
hr.space
|
||||||
|
+colspacer
|
@ -1,29 +1,2 @@
|
|||||||
@import modules/colors.sass
|
@debug "DEPRECATION WARNING: The blueprint/screen.sass will be removed. Please import blueprint.sass instead."
|
||||||
@import modules/grid.sass
|
@import blueprint.sass
|
||||||
@import modules/typography.sass
|
|
||||||
@import modules/utilities.sass
|
|
||||||
@import modules/form.sass
|
|
||||||
@import modules/interaction.sass
|
|
||||||
@import modules/debug.sass
|
|
||||||
|
|
||||||
// Usage examples:
|
|
||||||
// As a top-level mixin, apply to any page that includes the stylesheet:
|
|
||||||
// +blueprint
|
|
||||||
// Scoped by a presentational class:
|
|
||||||
// body.blueprint
|
|
||||||
// +blueprint(true)
|
|
||||||
// Scoped by semantic selectors:
|
|
||||||
// body#page-1, body#page-2, body.a-special-page-type
|
|
||||||
// +blueprint(true)
|
|
||||||
// Deprecated:
|
|
||||||
// You can pass the body selector as the first argument when used as a top-level mixin
|
|
||||||
// +blueprint("body#page-1, body#page-2, body.a-special-page-type")
|
|
||||||
=blueprint(!body_selector = "body")
|
|
||||||
@if not (!body_selector == "body" or !body_selector == true)
|
|
||||||
@debug "[DEPRECATED] To specify a the selector \"#{!body_selector}\" to +blueprint, pass true as the first argument and mix it into #{!body_selector}."
|
|
||||||
+blueprint-typography(!body_selector)
|
|
||||||
+blueprint-utilities
|
|
||||||
+blueprint-grid
|
|
||||||
+blueprint-debug
|
|
||||||
+blueprint-interaction
|
|
||||||
+blueprint-form
|
|
||||||
|
@ -0,0 +1,160 @@
|
|||||||
|
@import colors.sass
|
||||||
|
@import compass/utilities/links/link_colors.sass
|
||||||
|
@import compass/utilities/general/float.sass
|
||||||
|
|
||||||
|
!blueprint_font_family ||= "Helvetica Neue, Arial, Helvetica, sans-serif"
|
||||||
|
!blueprint_fixed_font_family ||= "'andale mono', 'lucida console', monospace"
|
||||||
|
!blueprint_font_size ||= 12px
|
||||||
|
|
||||||
|
// Usage examples:
|
||||||
|
// As a top-level mixin, apply to any page that includes the stylesheet:
|
||||||
|
// +blueprint-typography
|
||||||
|
// Scoped by a presentational class:
|
||||||
|
// body.blueprint
|
||||||
|
// +blueprint-typography(true)
|
||||||
|
// Scoped by semantic selectors:
|
||||||
|
// body#page-1, body#page-2, body.a-special-page-type
|
||||||
|
// +blueprint-typography(true)
|
||||||
|
// Deprecated:
|
||||||
|
// You can pass the body selector as the first argument when used as a top-level mixin
|
||||||
|
// +blueprint-typography("body#page-1, body#page-2, body.a-special-page-type")
|
||||||
|
=blueprint-typography(!body_selector = "body")
|
||||||
|
@if !body_selector == true
|
||||||
|
+blueprint-typography-body
|
||||||
|
+blueprint-typography-defaults
|
||||||
|
@else
|
||||||
|
#{!body_selector}
|
||||||
|
+blueprint-typography-body
|
||||||
|
@if !body_selector != "body"
|
||||||
|
@debug "[DEPRECATED] To specify a the selector \"#{!body_selector}\" to +blueprint-typography, pass true as the first argument and mix it into #{!body_selector}."
|
||||||
|
+blueprint-typography-defaults
|
||||||
|
@if !body_selector == "body"
|
||||||
|
+blueprint-typography-defaults
|
||||||
|
|
||||||
|
=normal-text
|
||||||
|
font-family= !blueprint_font_family
|
||||||
|
color= !font_color
|
||||||
|
|
||||||
|
=fixed-width-text
|
||||||
|
font= 1em !blueprint_fixed_font_family
|
||||||
|
line-height: 1.5
|
||||||
|
|
||||||
|
=header-text
|
||||||
|
font-weight: normal
|
||||||
|
color= !header_color
|
||||||
|
|
||||||
|
=quiet
|
||||||
|
color= !quiet_color
|
||||||
|
|
||||||
|
=loud
|
||||||
|
color= !loud_color
|
||||||
|
|
||||||
|
=blueprint-typography-body(!font_size = !blueprint_font_size)
|
||||||
|
line-height: 1.5
|
||||||
|
+normal-text
|
||||||
|
font-size= 100% * !font_size / 16px
|
||||||
|
|
||||||
|
=blueprint-typography-defaults
|
||||||
|
h1
|
||||||
|
+header-text
|
||||||
|
font-size: 3em
|
||||||
|
line-height: 1
|
||||||
|
margin-bottom: 0.5em
|
||||||
|
img
|
||||||
|
margin: 0
|
||||||
|
h2
|
||||||
|
+header-text
|
||||||
|
font-size: 2em
|
||||||
|
margin-bottom: 0.75em
|
||||||
|
h3
|
||||||
|
+header-text
|
||||||
|
font-size: 1.5em
|
||||||
|
line-height: 1
|
||||||
|
margin-bottom: 1em
|
||||||
|
h4
|
||||||
|
+header-text
|
||||||
|
font-size: 1.2em
|
||||||
|
line-height: 1.25
|
||||||
|
margin-bottom: 1.25em
|
||||||
|
h5
|
||||||
|
+header-text
|
||||||
|
font-size: 1em
|
||||||
|
font-weight: bold
|
||||||
|
margin-bottom: 1.5em
|
||||||
|
h6
|
||||||
|
+header-text
|
||||||
|
font-size: 1em
|
||||||
|
font-weight: bold
|
||||||
|
h2 img, h3 img, h4 img, h5 img, h6 img
|
||||||
|
margin: 0
|
||||||
|
p
|
||||||
|
margin: 0 0 1.5em
|
||||||
|
img.left
|
||||||
|
+float-left
|
||||||
|
margin: 1.5em 1.5em 1.5em 0
|
||||||
|
padding: 0
|
||||||
|
img.right
|
||||||
|
+float-right
|
||||||
|
margin: 1.5em 0 1.5em 1.5em
|
||||||
|
padding: 0
|
||||||
|
a
|
||||||
|
text-decoration: underline
|
||||||
|
+link-colors(!link_color, !link_hover_color, !link_active_color, !link_visited_color, !link_focus_color)
|
||||||
|
blockquote
|
||||||
|
margin: 1.5em
|
||||||
|
color: #666
|
||||||
|
font-style: italic
|
||||||
|
strong
|
||||||
|
font-weight: bold
|
||||||
|
em
|
||||||
|
font-style: italic
|
||||||
|
dfn
|
||||||
|
font-style: italic
|
||||||
|
font-weight: bold
|
||||||
|
sup, sub
|
||||||
|
line-height: 0
|
||||||
|
abbr, acronym
|
||||||
|
border-bottom: 1px dotted #666
|
||||||
|
address
|
||||||
|
margin: 0 0 1.5em
|
||||||
|
font-style: italic
|
||||||
|
del
|
||||||
|
color: #666
|
||||||
|
pre
|
||||||
|
margin: 1.5em 0
|
||||||
|
white-space: pre
|
||||||
|
pre, code, tt
|
||||||
|
+fixed-width-text
|
||||||
|
li ul, li ol
|
||||||
|
margin: 0 1.5em
|
||||||
|
ul
|
||||||
|
margin: 0 1.5em 1.5em 1.5em
|
||||||
|
list-style-type: disc
|
||||||
|
ol
|
||||||
|
margin: 0 1.5em 1.5em 1.5em
|
||||||
|
list-style-type: decimal
|
||||||
|
dl
|
||||||
|
margin: 0 0 1.5em 0
|
||||||
|
dt
|
||||||
|
font-weight: bold
|
||||||
|
dd
|
||||||
|
margin-left: 1.5em
|
||||||
|
table
|
||||||
|
margin-bottom: 1.4em
|
||||||
|
width: 100%
|
||||||
|
th
|
||||||
|
font-weight: bold
|
||||||
|
thead th
|
||||||
|
background= !blueprint_table_header_color
|
||||||
|
th, td, caption
|
||||||
|
padding: 4px 10px 4px 5px
|
||||||
|
tr.even td
|
||||||
|
background= !blueprint_table_stripe_color
|
||||||
|
tfoot
|
||||||
|
font-style: italic
|
||||||
|
caption
|
||||||
|
background: #eee
|
||||||
|
.quiet
|
||||||
|
+quiet
|
||||||
|
.loud
|
||||||
|
+loud
|
@ -0,0 +1,37 @@
|
|||||||
|
@import compass/utilities/text/nowrap.sass
|
||||||
|
@import compass/utilities/general/float.sass
|
||||||
|
|
||||||
|
// Most of these utility classes are not "semantic". If you use them,
|
||||||
|
// you are mixing your content and presentation. For shame!
|
||||||
|
|
||||||
|
=blueprint-utilities
|
||||||
|
// Regular clearing apply to column that should drop below previous ones.
|
||||||
|
.clear
|
||||||
|
clear: both
|
||||||
|
// turn off text wrapping for the element.
|
||||||
|
.nowrap
|
||||||
|
+nowrap
|
||||||
|
// Apply to an element that has floated children to make the bottom
|
||||||
|
// of the element fall _below_ the floated children.
|
||||||
|
.clearfix
|
||||||
|
+clearfix
|
||||||
|
.small
|
||||||
|
font-size: .8em
|
||||||
|
margin-bottom: 1.875em
|
||||||
|
line-height: 1.875em
|
||||||
|
.large
|
||||||
|
font-size: 1.2em
|
||||||
|
line-height: 2.5em
|
||||||
|
margin-bottom: 1.25em
|
||||||
|
.first
|
||||||
|
margin-left: 0
|
||||||
|
padding-left: 0
|
||||||
|
.last
|
||||||
|
margin-right: 0
|
||||||
|
padding-right: 0
|
||||||
|
.top
|
||||||
|
margin-top: 0
|
||||||
|
padding-top: 0
|
||||||
|
.bottom
|
||||||
|
margin-bottom: 0
|
||||||
|
padding-bottom: 0
|
@ -1,84 +1,2 @@
|
|||||||
@import compass/css3/inline_block.sass
|
@debug "DEPRECATION WARINING: blueprint/modules/buttons.sass has moved to blueprint/buttons.sass"
|
||||||
@import compass/utilities/general/float.sass
|
@import blueprint/buttons.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
|
|
||||||
|
@ -1,33 +1,2 @@
|
|||||||
!font_color ||= #333
|
@debug "DEPRECATION WARINING: blueprint/modules/colors.sass has moved to blueprint/colors.sass"
|
||||||
!quiet_color ||= !font_color + #333
|
@import blueprint/colors.sass
|
||||||
!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
|
|
||||||
|
@ -1,9 +1,2 @@
|
|||||||
=showgrid(!image = "grid.png")
|
@debug "DEPRECATION WARINING: blueprint/modules/debug.sass has moved to blueprint/debug.sass"
|
||||||
background= image_url(!image)
|
@import blueprint/debug.sass
|
||||||
|
|
||||||
=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)
|
|
||||||
|
|
||||||
|
@ -1,82 +1,2 @@
|
|||||||
@import typography.sass
|
@debug "DEPRECATION WARINING: blueprint/modules/fancy_type.sass has moved to blueprint/fancy_type.sass"
|
||||||
|
@import blueprint/fancy_type.sass
|
||||||
//
|
|
||||||
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">“</span>asdf”
|
|
||||||
(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 = !blueprint_font_size, !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
|
|
||||||
|
@ -1,55 +1,2 @@
|
|||||||
@import colors.sass
|
@debug "DEPRECATION WARINING: blueprint/modules/form.sass has moved to blueprint/form.sass"
|
||||||
|
@import blueprint/form.sass
|
||||||
// Mixin for producing Blueprint "inline" forms. Should be used with the blueprint-form mixin.
|
|
||||||
=blueprint-inline-form
|
|
||||||
line-height: 3
|
|
||||||
p
|
|
||||||
margin-bottom: 0
|
|
||||||
|
|
||||||
=blueprint-form
|
|
||||||
+blueprint-form-layout
|
|
||||||
+blueprint-form-borders
|
|
||||||
+blueprint-form-sizes
|
|
||||||
|
|
||||||
=blueprint-form-layout
|
|
||||||
label
|
|
||||||
font-weight: bold
|
|
||||||
fieldset
|
|
||||||
padding: 1.4em
|
|
||||||
margin: 0 0 1.5em 0
|
|
||||||
legend
|
|
||||||
font-weight: bold
|
|
||||||
font-size: 1.2em
|
|
||||||
input
|
|
||||||
&.text, &.title, &[type=text]
|
|
||||||
margin: 0.5em 0
|
|
||||||
background-color: #fff
|
|
||||||
padding: 5px
|
|
||||||
&.title
|
|
||||||
font-size: 1.5em
|
|
||||||
&[type=checkbox], &.checkbox,
|
|
||||||
&[type=radio], &.radio
|
|
||||||
position: relative
|
|
||||||
top: 0.25em
|
|
||||||
textarea
|
|
||||||
margin: 0.5em 0
|
|
||||||
padding: 5px
|
|
||||||
select
|
|
||||||
margin: 0.5em 0
|
|
||||||
|
|
||||||
=blueprint-form-sizes(!input_width = 300px, !textarea_width = 390px, !textarea_height = 250px)
|
|
||||||
input.text, input.title
|
|
||||||
width= !input_width
|
|
||||||
textarea
|
|
||||||
width= !textarea_width
|
|
||||||
height= !textarea_height
|
|
||||||
|
|
||||||
=blueprint-form-borders(!unfocused_border_color = #bbb, !focus_border_color = #666, !fieldset_border_color = #ccc)
|
|
||||||
fieldset
|
|
||||||
border= 1px "solid" !fieldset_border_color
|
|
||||||
input.text, input.title,
|
|
||||||
textarea,
|
|
||||||
select
|
|
||||||
border= 1px "solid" !unfocused_border_color
|
|
||||||
&:focus
|
|
||||||
border= 1px "solid" !focus_border_color
|
|
||||||
|
@ -1,178 +1,2 @@
|
|||||||
// --------------------------------------------------------------
|
@debug "DEPRECATION WARINING: blueprint/modules/grid.sass has moved to blueprint/grid.sass"
|
||||||
// SASS Gridification
|
@import blueprint/grid.sass
|
||||||
// * 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)
|
|
||||||
.prepend-top
|
|
||||||
+prepend-top
|
|
||||||
.append-bottom
|
|
||||||
+append-bottom
|
|
||||||
|
|
||||||
|
|
||||||
// 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
|
|
||||||
|
|
||||||
=append-bottom(!amount = 1.5em)
|
|
||||||
margin-bottom= !amount
|
|
||||||
|
|
||||||
=prepend-top(!amount = 1.5em)
|
|
||||||
margin-top= !amount
|
|
||||||
|
|
||||||
=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(!border_color = #eee, !border_width = 1px)
|
|
||||||
padding-right= !blueprint_grid_margin / 2 - !border_width
|
|
||||||
margin-right= !blueprint_grid_margin / 2
|
|
||||||
border-right: #{!border_width} solid #{!border_color}
|
|
||||||
|
|
||||||
// Border with more whitespace, spans one column.
|
|
||||||
=colborder(!border_color = #eee, !border_width = 1px)
|
|
||||||
padding-right= floor((!blueprint_grid_width + 2 * !blueprint_grid_margin - !border_width)/2)
|
|
||||||
margin-right= ceil((!blueprint_grid_width + 2 * !blueprint_grid_margin - !border_width)/2)
|
|
||||||
border-right: #{!border_width} solid #{!border_color}
|
|
||||||
|
|
||||||
// Mixin this to an hr to make a horizontal ruler across a column.
|
|
||||||
=colruler(!border_color = #ddd)
|
|
||||||
background= !border_color
|
|
||||||
color= !border_color
|
|
||||||
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
|
|
||||||
|
@ -1,58 +1,2 @@
|
|||||||
@import colors.sass
|
@debug "DEPRECATION WARINING: blueprint/modules/interaction.sass has moved to blueprint/interaction.sass"
|
||||||
|
@import blueprint/interaction.sass
|
||||||
|
|
||||||
=blueprint-interaction
|
|
||||||
.error
|
|
||||||
+error
|
|
||||||
.notice
|
|
||||||
+notice
|
|
||||||
.success
|
|
||||||
+success
|
|
||||||
.hide
|
|
||||||
display: none
|
|
||||||
.highlight
|
|
||||||
+highlight
|
|
||||||
.added
|
|
||||||
+added
|
|
||||||
.removed
|
|
||||||
+removed
|
|
||||||
|
|
||||||
=feedback-base
|
|
||||||
padding: .8em
|
|
||||||
margin-bottom: 1em
|
|
||||||
border= 2px "solid" !feedback_border_color
|
|
||||||
|
|
||||||
=error
|
|
||||||
+feedback-base
|
|
||||||
background= !error_bg_color
|
|
||||||
color= !error_color
|
|
||||||
border-color= !error_border_color
|
|
||||||
a
|
|
||||||
color= !error_color
|
|
||||||
|
|
||||||
=notice
|
|
||||||
+feedback-base
|
|
||||||
background= !notice_bg_color
|
|
||||||
color= !notice_color
|
|
||||||
border-color= !notice_border_color
|
|
||||||
a
|
|
||||||
color= !notice_color
|
|
||||||
|
|
||||||
=success
|
|
||||||
+feedback-base
|
|
||||||
background= !success_bg_color
|
|
||||||
color= !success_color
|
|
||||||
border-color= !success_border_color
|
|
||||||
a
|
|
||||||
color= !success_color
|
|
||||||
|
|
||||||
=highlight
|
|
||||||
background= !highlight_color
|
|
||||||
|
|
||||||
=added
|
|
||||||
background= !added_bg_color
|
|
||||||
color= !added_color
|
|
||||||
|
|
||||||
=removed
|
|
||||||
background= !removed_bg_color
|
|
||||||
color= !removed_color
|
|
||||||
|
@ -1,44 +1,2 @@
|
|||||||
=no-link-icon
|
@debug "DEPRECATION WARINING: blueprint/modules/link_icons.sass has moved to blueprint/link_icons.sass"
|
||||||
background: transparent none !important
|
@import blueprint/link_icons.sass
|
||||||
padding: 0 !important
|
|
||||||
margin: 0 !important
|
|
||||||
|
|
||||||
=link-icon-base
|
|
||||||
padding: 2px 22px 2px 0
|
|
||||||
margin: -2px 0
|
|
||||||
background-repeat: no-repeat
|
|
||||||
background-position: right center
|
|
||||||
|
|
||||||
=link-icon(!name, !include_base = true)
|
|
||||||
@if !include_base
|
|
||||||
+link-icon-base
|
|
||||||
background-image= image_url("link_icons/#{!name}")
|
|
||||||
|
|
||||||
=link-icons
|
|
||||||
a[href^="http:"],
|
|
||||||
a[href^="mailto:"],
|
|
||||||
a[href^="http:"]:visited,
|
|
||||||
a[href$=".pdf"],
|
|
||||||
a[href$=".doc"],
|
|
||||||
a[href$=".xls"],
|
|
||||||
a[href$=".rss"],
|
|
||||||
a[href$=".rdf"],
|
|
||||||
a[href^="aim:"]
|
|
||||||
+link-icon-base
|
|
||||||
a[href^="http:"]
|
|
||||||
+link-icon("external.png", false)
|
|
||||||
a[href^="mailto:"]
|
|
||||||
+link-icon("email.png", false)
|
|
||||||
a[href^="http:"]:visited
|
|
||||||
+link-icon("visited.png", false)
|
|
||||||
a[href$=".pdf"]
|
|
||||||
+link-icon("pdf.png", false)
|
|
||||||
a[href$=".doc"]
|
|
||||||
+link-icon("doc.png", false)
|
|
||||||
a[href$=".xls"]
|
|
||||||
+link-icon("xls.png", false)
|
|
||||||
a[href$=".rss"],
|
|
||||||
a[href$=".rdf"]
|
|
||||||
+link-icon("feed.png", false)
|
|
||||||
a[href^="aim:"]
|
|
||||||
+link-icon("im.png", false)
|
|
||||||
|
@ -1,141 +1,3 @@
|
|||||||
// --------------------------------------------------------------
|
@debug "DEPRECATION WARINING: blueprint/modules/liquid.sass has moved to blueprint/liquid.sass"
|
||||||
// SASS Gridification
|
@import blueprint/liquid.sass
|
||||||
// * Author: Geoff Garside
|
|
||||||
// A SASS adaptation of Blueprint CSS
|
|
||||||
// * Version: 0.7.1 (2008-02-25)
|
|
||||||
// * Website: http://code.google.com/p/blueprintcss/
|
|
||||||
// Based on work by:
|
|
||||||
// * Chris Eppstein [eppsteins.net]
|
|
||||||
// * Lorin Tacket [lorintackett.com]
|
|
||||||
// * Olav Bjorkoy [bjorkoy.com]
|
|
||||||
// * Nathan Borror [playgroundblues.com]
|
|
||||||
// * Jeff Croft [jeffcroft.com]
|
|
||||||
// * Christian Metts [mintchaos.com]
|
|
||||||
// * Khoi Vinh [subtraction.com]
|
|
||||||
// Liquid grid work by:
|
|
||||||
// * Ben Listwon
|
|
||||||
// * David Bedingfield
|
|
||||||
// * Andrei Michael Herasimchuk
|
|
||||||
// Involution Studios, http://www.involutionstudios.com
|
|
||||||
// Read more about using a grid here:
|
|
||||||
// * subtraction.com/archives/2007/0318_oh_yeeaahh.php
|
|
||||||
// -----
|
|
||||||
// By default, the grid is 80% of window width, with 24 columns.
|
|
||||||
//
|
|
||||||
// To make the grid fixed, simply change the .container width
|
|
||||||
// property to a pixel value. e.g., 960px.
|
|
||||||
// -----
|
|
||||||
// To use:
|
|
||||||
// This module is a REPLACEMENT for the grid module. Simply import it:
|
|
||||||
// @import blueprint.sass
|
|
||||||
// @import blueprint/modules/liquid.sass
|
|
||||||
// -------------------------------------------------------------------
|
|
||||||
|
|
||||||
@import compass/utilities/general/float.sass
|
|
||||||
|
|
||||||
// Main layout grid, override these constants to build your grid and container sizes.
|
|
||||||
// The width shown gives the right floored percentage values.
|
|
||||||
!blueprint_liquid_grid_columns ||= 24
|
|
||||||
!blueprint_liquid_grid_width ||= 4.173%
|
|
||||||
!blueprint_liquid_grid_margin ||= 0.833em
|
|
||||||
|
|
||||||
// Do not edit below this line unless you really know what you're doing.
|
|
||||||
!blueprint_liquid_container_width = 80%
|
|
||||||
!blueprint_liquid_container_min_width = 950px
|
|
||||||
!blueprint_liquid_grid_push_pull = -(!blueprint_liquid_grid_margin * 4)
|
|
||||||
|
|
||||||
=blueprint-liquid-grid
|
|
||||||
// A container should group all your columns
|
|
||||||
.container
|
|
||||||
+container
|
|
||||||
// Use these classes (or mixins) to set the width of a column.
|
|
||||||
@for !n from 1 to !blueprint_liquid_grid_columns + 1
|
|
||||||
.span-#{!n}
|
|
||||||
+span(!n)
|
|
||||||
div
|
|
||||||
&.span-#{!n}
|
|
||||||
+column(!n, !n == !blueprint_liquid_grid_columns)
|
|
||||||
// The last column in a row needs this class (or mixin) or it will end up on the next row.
|
|
||||||
div.last
|
|
||||||
+last
|
|
||||||
// Add these to a column to append empty cols.
|
|
||||||
@for !n from 1 to !blueprint_liquid_grid_columns
|
|
||||||
.append-#{!n}
|
|
||||||
+append(!n)
|
|
||||||
// Add these to a column to prepend empty cols.
|
|
||||||
@for !n from 1 to !blueprint_liquid_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.
|
|
||||||
@for !n from 1 to !blueprint_liquid_grid_columns + 1
|
|
||||||
.pull-#{!n}
|
|
||||||
+pull(!n)
|
|
||||||
@for !n from 1 to !blueprint_liquid_grid_columns + 1
|
|
||||||
.push-#{!n}
|
|
||||||
+push(!n)
|
|
||||||
|
|
||||||
=container
|
|
||||||
min-width= !blueprint_liquid_container_min_width
|
|
||||||
width= !blueprint_liquid_container_width
|
|
||||||
margin: 0 auto
|
|
||||||
+clearfix
|
|
||||||
|
|
||||||
=span(!n, !override = false)
|
|
||||||
!width = (!blueprint_liquid_grid_width * !n) - ((!blueprint_liquid_grid_width * !n) % 1)
|
|
||||||
@if !override
|
|
||||||
width= !width !important
|
|
||||||
@else
|
|
||||||
width= !width
|
|
||||||
|
|
||||||
=last
|
|
||||||
margin-right: 0
|
|
||||||
|
|
||||||
=column(!n, !last = false)
|
|
||||||
+float-left
|
|
||||||
overflow: hidden
|
|
||||||
+span(!n)
|
|
||||||
@if !last
|
|
||||||
+last
|
|
||||||
@else
|
|
||||||
margin-right= !blueprint_liquid_grid_margin
|
|
||||||
|
|
||||||
=append(!n)
|
|
||||||
padding-right= (!blueprint_liquid_grid_width * !n) - ((!blueprint_liquid_grid_width * !n) % 1)
|
|
||||||
|
|
||||||
=prepend(!n)
|
|
||||||
padding-left= (!blueprint_liquid_grid_width * !n) - ((!blueprint_liquid_grid_width * !n) % 1)
|
|
||||||
|
|
||||||
=pull(!n, !last = false)
|
|
||||||
margin-left= (!blueprint_liquid_grid_push_pull * !n)
|
|
||||||
|
|
||||||
=push(!n)
|
|
||||||
+float-right
|
|
||||||
margin:
|
|
||||||
top: 0
|
|
||||||
left: 1.5em
|
|
||||||
right= (!blueprint_liquid_grid_push_pull * !n)
|
|
||||||
bottom: 0
|
|
||||||
|
|
||||||
=border
|
|
||||||
border-right: 1px solid #eee
|
|
||||||
|
|
||||||
=colborder
|
|
||||||
padding-right: 2%
|
|
||||||
margin-right: 2%
|
|
||||||
+border
|
|
||||||
|
|
||||||
=colruler
|
|
||||||
background: #ddd
|
|
||||||
color: #ddd
|
|
||||||
clear: both
|
|
||||||
width: 100%
|
|
||||||
height: 0.083em
|
|
||||||
margin: 0 0 1.583em
|
|
||||||
border: none
|
|
||||||
|
|
||||||
=colspacer
|
|
||||||
+colruler
|
|
||||||
background: #fff
|
|
||||||
color: #fff
|
|
||||||
|
|
||||||
|
@ -1,56 +1,2 @@
|
|||||||
// Global reset rules.
|
@debug "DEPRECATION WARINING: blueprint/modules/reset.sass has moved to blueprint/reset.sass"
|
||||||
// For more specific resets, use the reset mixins provided below
|
@import blueprint/reset.sass
|
||||||
=blueprint-global-reset
|
|
||||||
html, body
|
|
||||||
+blueprint-reset
|
|
||||||
+blueprint-nested-reset
|
|
||||||
|
|
||||||
// Reset all elements within some selector scope.To reset the selector itself,
|
|
||||||
// mixin the appropriate reset mixin for that element type as well. This could be
|
|
||||||
// useful if you want to style a part of your page in a dramatically different way.
|
|
||||||
=blueprint-nested-reset
|
|
||||||
div, span, object, iframe, h1, h2, h3, h4, h5, h6, p,
|
|
||||||
pre, a, abbr, acronym, address, code, del, dfn, em, img,
|
|
||||||
dl, dt, dd, ol, ul, li, fieldset, form, label, legend, caption, tbody, tfoot, thead, tr
|
|
||||||
+blueprint-reset
|
|
||||||
blockquote, q
|
|
||||||
+blueprint-reset-quotation
|
|
||||||
th, td, caption
|
|
||||||
+blueprint-reset-table-cell
|
|
||||||
table
|
|
||||||
+blueprint-reset-table
|
|
||||||
a img
|
|
||||||
border: none
|
|
||||||
|
|
||||||
=blueprint-reset-box-model
|
|
||||||
margin: 0
|
|
||||||
padding: 0
|
|
||||||
border: 0
|
|
||||||
|
|
||||||
=blueprint-reset
|
|
||||||
+blueprint-reset-box-model
|
|
||||||
font:
|
|
||||||
weight: inherit
|
|
||||||
style: inherit
|
|
||||||
size: 100%
|
|
||||||
family: inherit
|
|
||||||
vertical-align: baseline
|
|
||||||
|
|
||||||
=blueprint-reset-quotation
|
|
||||||
+blueprint-reset
|
|
||||||
quotes: "" ""
|
|
||||||
&:before,
|
|
||||||
&:after
|
|
||||||
content: ""
|
|
||||||
|
|
||||||
=blueprint-reset-table-cell
|
|
||||||
+blueprint-reset
|
|
||||||
text-align: left
|
|
||||||
font-weight: normal
|
|
||||||
vertical-align: middle
|
|
||||||
|
|
||||||
=blueprint-reset-table
|
|
||||||
+blueprint-reset
|
|
||||||
border-collapse: separate
|
|
||||||
border-spacing: 0
|
|
||||||
vertical-align: middle
|
|
||||||
|
@ -1,122 +1,2 @@
|
|||||||
@import grid.sass
|
@debug "DEPRECATION WARINING: blueprint/modules/rtl.sass has moved to blueprint/rtl.sass"
|
||||||
@import compass/utilities/general/float.sass
|
@import blueprint/rtl.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
|
|
||||||
|
|
||||||
// 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
|
|
||||||
direction: rtl
|
|
||||||
+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-left: 0
|
|
||||||
|
|
||||||
=column-base(!last = false)
|
|
||||||
+float-right
|
|
||||||
@if !last
|
|
||||||
+last
|
|
||||||
@else
|
|
||||||
margin-left= !blueprint_grid_margin
|
|
||||||
* html &
|
|
||||||
overflow-x: hidden
|
|
||||||
|
|
||||||
// Mixin to a column to append n empty cols.
|
|
||||||
=append(!n)
|
|
||||||
padding-left= (!blueprint_grid_outer_width) * !n
|
|
||||||
|
|
||||||
// Mixin to a column to prepend n empty cols.
|
|
||||||
=prepend(!n)
|
|
||||||
padding-right= (!blueprint_grid_outer_width) * !n
|
|
||||||
|
|
||||||
// mixin to a column to move it n columns to the left
|
|
||||||
=pull(!n, !last = false)
|
|
||||||
position: relative
|
|
||||||
@if !last
|
|
||||||
margin-right= (-!blueprint_grid_outer_width * !n) + !blueprint_grid_margin
|
|
||||||
@else
|
|
||||||
margin-right= -!blueprint_grid_outer_width * !n
|
|
||||||
|
|
||||||
// mixin to a column to push it n columns to the right
|
|
||||||
=push(!n)
|
|
||||||
+float-right
|
|
||||||
position: relative
|
|
||||||
margin:
|
|
||||||
top: 0
|
|
||||||
left= -!blueprint_grid_outer_width * !n
|
|
||||||
bottom: 1.5em
|
|
||||||
right= !blueprint_grid_outer_width * !n
|
|
||||||
|
|
||||||
// Border on left hand side of a column.
|
|
||||||
=border
|
|
||||||
padding-left= !blueprint_grid_margin / 2 - 1
|
|
||||||
margin-left= !blueprint_grid_margin / 2
|
|
||||||
border-left: 1px solid #eee
|
|
||||||
|
|
||||||
// Border with more whitespace, spans one column.
|
|
||||||
=colborder
|
|
||||||
padding-left= (!blueprint_grid_width - 2 * !blueprint_grid_margin - 1)/2
|
|
||||||
margin-left= (!blueprint_grid_width - 2 * !blueprint_grid_margin)/2
|
|
||||||
border-left: 1px solid #eee
|
|
||||||
|
|
||||||
// Usage examples:
|
|
||||||
// As a top-level mixin, apply to any page that includes the stylesheet:
|
|
||||||
// +rtl-typography
|
|
||||||
// Scoped by a presentational class:
|
|
||||||
// body.blueprint
|
|
||||||
// +rtl-typography(true)
|
|
||||||
// Scoped by semantic selectors:
|
|
||||||
// body#page-1, body#page-2, body.a-special-page-type
|
|
||||||
// +rtl-typography(true)
|
|
||||||
// Deprecated:
|
|
||||||
// You can pass the body selector as the first argument when used as a top-level mixin
|
|
||||||
// +rtl-typography("body#page-1, body#page-2, body.a-special-page-type")
|
|
||||||
=rtl-typography(!body_selector = "body")
|
|
||||||
@if !body_selector == true
|
|
||||||
html &
|
|
||||||
font-family: Arial, sans-serif
|
|
||||||
+rtl-typography-defaults
|
|
||||||
@else
|
|
||||||
html #{!body_selector}
|
|
||||||
font-family: Arial, sans-serif
|
|
||||||
@if !body_selector != "body"
|
|
||||||
@debug "[DEPRECATED] To specify a the selector \"#{!body_selector}\" to +rtl-typography, pass true as the first argument and mix it into #{!body_selector}."
|
|
||||||
+rtl-typography-defaults
|
|
||||||
@if !body_selector == "body"
|
|
||||||
body
|
|
||||||
+rtl-typography-defaults
|
|
||||||
|
|
||||||
=rtl-typography-defaults
|
|
||||||
h1, h2, h3, h4, h5, h6
|
|
||||||
font-family: Arial, sans-serif
|
|
||||||
|
|
||||||
pre, code, tt
|
|
||||||
font-family: monospace
|
|
||||||
|
|
||||||
p
|
|
||||||
img.right
|
|
||||||
+float-left
|
|
||||||
margin: 1.5em 1.5em 1.5em 0
|
|
||||||
padding: 0
|
|
||||||
img.left
|
|
||||||
+float-right
|
|
||||||
margin: 1.5em 0 1.5em 1.5em
|
|
||||||
padding: 0
|
|
||||||
|
|
||||||
dd, ul, ol
|
|
||||||
margin-left: 0
|
|
||||||
margin-right: 1.5em
|
|
||||||
|
|
||||||
td, th
|
|
||||||
text-align: right
|
|
||||||
|
@ -1,47 +1,2 @@
|
|||||||
@import grid.sass
|
@debug "DEPRECATION WARINING: blueprint/modules/scaffolding.sass has moved to blueprint/scaffolding.sass"
|
||||||
// The styles contained here are meant to provide for an attractive experience out of the box
|
@import blueprint/scaffolding.sass
|
||||||
// and are expected to be removed once custom visual design begins.
|
|
||||||
|
|
||||||
// The +blueprint-scaffolding 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-scaffolding
|
|
||||||
// Scoped by a single presentational body class:
|
|
||||||
// +blueprint-scaffolding("body.blueprint")
|
|
||||||
// Semantically:
|
|
||||||
// +blueprint-scaffolding("body#page-1, body#page-2, body.a-special-page-type")
|
|
||||||
// Alternatively, you can use the +blueprint-scaffolding-body and +blueprint-scaffolding-defaults
|
|
||||||
// mixins to construct your own semantic style rules.
|
|
||||||
|
|
||||||
=blueprint-scaffolding(!body_selector = "body")
|
|
||||||
#{!body_selector}
|
|
||||||
@if !body_selector != "body"
|
|
||||||
+blueprint-scaffolding-defaults
|
|
||||||
@if !body_selector == "body"
|
|
||||||
+blueprint-scaffolding-defaults
|
|
||||||
|
|
||||||
// The styles this mixin provides were deprecated in Blueprint 0.9 and is no longer part of the
|
|
||||||
// main scaffolding, but the mixin is still available if you want to use it.
|
|
||||||
=blueprint-scaffolding-body
|
|
||||||
margin: 1.5em 0
|
|
||||||
|
|
||||||
// Mixin +box to create a padded box inside a column.
|
|
||||||
=box
|
|
||||||
padding: 1.5em
|
|
||||||
margin-bottom: 1.5em
|
|
||||||
background: #E5ECF9
|
|
||||||
|
|
||||||
=blueprint-scaffolding-defaults
|
|
||||||
.box
|
|
||||||
+box
|
|
||||||
// Border on right hand side of a column. You can comment this out if you don't plan to use it.
|
|
||||||
div.border
|
|
||||||
+border
|
|
||||||
// Border with more whitespace, spans one column.
|
|
||||||
div.colborder
|
|
||||||
+colborder
|
|
||||||
hr
|
|
||||||
+colruler
|
|
||||||
hr.space
|
|
||||||
+colspacer
|
|
||||||
|
@ -1,160 +1,2 @@
|
|||||||
@import colors.sass
|
@debug "DEPRECATION WARINING: blueprint/modules/typography.sass has moved to blueprint/typography.sass"
|
||||||
@import compass/utilities/links/link_colors.sass
|
@import blueprint/typography.sass
|
||||||
@import compass/utilities/general/float.sass
|
|
||||||
|
|
||||||
!blueprint_font_family ||= "Helvetica Neue, Arial, Helvetica, sans-serif"
|
|
||||||
!blueprint_fixed_font_family ||= "'andale mono', 'lucida console', monospace"
|
|
||||||
!blueprint_font_size ||= 12px
|
|
||||||
|
|
||||||
// Usage examples:
|
|
||||||
// As a top-level mixin, apply to any page that includes the stylesheet:
|
|
||||||
// +blueprint-typography
|
|
||||||
// Scoped by a presentational class:
|
|
||||||
// body.blueprint
|
|
||||||
// +blueprint-typography(true)
|
|
||||||
// Scoped by semantic selectors:
|
|
||||||
// body#page-1, body#page-2, body.a-special-page-type
|
|
||||||
// +blueprint-typography(true)
|
|
||||||
// Deprecated:
|
|
||||||
// You can pass the body selector as the first argument when used as a top-level mixin
|
|
||||||
// +blueprint-typography("body#page-1, body#page-2, body.a-special-page-type")
|
|
||||||
=blueprint-typography(!body_selector = "body")
|
|
||||||
@if !body_selector == true
|
|
||||||
+blueprint-typography-body
|
|
||||||
+blueprint-typography-defaults
|
|
||||||
@else
|
|
||||||
#{!body_selector}
|
|
||||||
+blueprint-typography-body
|
|
||||||
@if !body_selector != "body"
|
|
||||||
@debug "[DEPRECATED] To specify a the selector \"#{!body_selector}\" to +blueprint-typography, pass true as the first argument and mix it into #{!body_selector}."
|
|
||||||
+blueprint-typography-defaults
|
|
||||||
@if !body_selector == "body"
|
|
||||||
+blueprint-typography-defaults
|
|
||||||
|
|
||||||
=normal-text
|
|
||||||
font-family= !blueprint_font_family
|
|
||||||
color= !font_color
|
|
||||||
|
|
||||||
=fixed-width-text
|
|
||||||
font= 1em !blueprint_fixed_font_family
|
|
||||||
line-height: 1.5
|
|
||||||
|
|
||||||
=header-text
|
|
||||||
font-weight: normal
|
|
||||||
color= !header_color
|
|
||||||
|
|
||||||
=quiet
|
|
||||||
color= !quiet_color
|
|
||||||
|
|
||||||
=loud
|
|
||||||
color= !loud_color
|
|
||||||
|
|
||||||
=blueprint-typography-body(!font_size = !blueprint_font_size)
|
|
||||||
line-height: 1.5
|
|
||||||
+normal-text
|
|
||||||
font-size= 100% * !font_size / 16px
|
|
||||||
|
|
||||||
=blueprint-typography-defaults
|
|
||||||
h1
|
|
||||||
+header-text
|
|
||||||
font-size: 3em
|
|
||||||
line-height: 1
|
|
||||||
margin-bottom: 0.5em
|
|
||||||
img
|
|
||||||
margin: 0
|
|
||||||
h2
|
|
||||||
+header-text
|
|
||||||
font-size: 2em
|
|
||||||
margin-bottom: 0.75em
|
|
||||||
h3
|
|
||||||
+header-text
|
|
||||||
font-size: 1.5em
|
|
||||||
line-height: 1
|
|
||||||
margin-bottom: 1em
|
|
||||||
h4
|
|
||||||
+header-text
|
|
||||||
font-size: 1.2em
|
|
||||||
line-height: 1.25
|
|
||||||
margin-bottom: 1.25em
|
|
||||||
h5
|
|
||||||
+header-text
|
|
||||||
font-size: 1em
|
|
||||||
font-weight: bold
|
|
||||||
margin-bottom: 1.5em
|
|
||||||
h6
|
|
||||||
+header-text
|
|
||||||
font-size: 1em
|
|
||||||
font-weight: bold
|
|
||||||
h2 img, h3 img, h4 img, h5 img, h6 img
|
|
||||||
margin: 0
|
|
||||||
p
|
|
||||||
margin: 0 0 1.5em
|
|
||||||
img.left
|
|
||||||
+float-left
|
|
||||||
margin: 1.5em 1.5em 1.5em 0
|
|
||||||
padding: 0
|
|
||||||
img.right
|
|
||||||
+float-right
|
|
||||||
margin: 1.5em 0 1.5em 1.5em
|
|
||||||
padding: 0
|
|
||||||
a
|
|
||||||
text-decoration: underline
|
|
||||||
+link-colors(!link_color, !link_hover_color, !link_active_color, !link_visited_color, !link_focus_color)
|
|
||||||
blockquote
|
|
||||||
margin: 1.5em
|
|
||||||
color: #666
|
|
||||||
font-style: italic
|
|
||||||
strong
|
|
||||||
font-weight: bold
|
|
||||||
em
|
|
||||||
font-style: italic
|
|
||||||
dfn
|
|
||||||
font-style: italic
|
|
||||||
font-weight: bold
|
|
||||||
sup, sub
|
|
||||||
line-height: 0
|
|
||||||
abbr, acronym
|
|
||||||
border-bottom: 1px dotted #666
|
|
||||||
address
|
|
||||||
margin: 0 0 1.5em
|
|
||||||
font-style: italic
|
|
||||||
del
|
|
||||||
color: #666
|
|
||||||
pre
|
|
||||||
margin: 1.5em 0
|
|
||||||
white-space: pre
|
|
||||||
pre, code, tt
|
|
||||||
+fixed-width-text
|
|
||||||
li ul, li ol
|
|
||||||
margin: 0 1.5em
|
|
||||||
ul
|
|
||||||
margin: 0 1.5em 1.5em 1.5em
|
|
||||||
list-style-type: disc
|
|
||||||
ol
|
|
||||||
margin: 0 1.5em 1.5em 1.5em
|
|
||||||
list-style-type: decimal
|
|
||||||
dl
|
|
||||||
margin: 0 0 1.5em 0
|
|
||||||
dt
|
|
||||||
font-weight: bold
|
|
||||||
dd
|
|
||||||
margin-left: 1.5em
|
|
||||||
table
|
|
||||||
margin-bottom: 1.4em
|
|
||||||
width: 100%
|
|
||||||
th
|
|
||||||
font-weight: bold
|
|
||||||
thead th
|
|
||||||
background= !blueprint_table_header_color
|
|
||||||
th, td, caption
|
|
||||||
padding: 4px 10px 4px 5px
|
|
||||||
tr.even td
|
|
||||||
background= !blueprint_table_stripe_color
|
|
||||||
tfoot
|
|
||||||
font-style: italic
|
|
||||||
caption
|
|
||||||
background: #eee
|
|
||||||
.quiet
|
|
||||||
+quiet
|
|
||||||
.loud
|
|
||||||
+loud
|
|
||||||
|
@ -1,37 +1,2 @@
|
|||||||
@import compass/utilities/text/nowrap.sass
|
@debug "DEPRECATION WARINING: blueprint/modules/utilities.sass has moved to blueprint/utilities.sass"
|
||||||
@import compass/utilities/general/float.sass
|
@import blueprint/utilities.sass
|
||||||
|
|
||||||
// Most of these utility classes are not "semantic". If you use them,
|
|
||||||
// you are mixing your content and presentation. For shame!
|
|
||||||
|
|
||||||
=blueprint-utilities
|
|
||||||
// Regular clearing apply to column that should drop below previous ones.
|
|
||||||
.clear
|
|
||||||
clear: both
|
|
||||||
// turn off text wrapping for the element.
|
|
||||||
.nowrap
|
|
||||||
+nowrap
|
|
||||||
// Apply to an element that has floated children to make the bottom
|
|
||||||
// of the element fall _below_ the floated children.
|
|
||||||
.clearfix
|
|
||||||
+clearfix
|
|
||||||
.small
|
|
||||||
font-size: .8em
|
|
||||||
margin-bottom: 1.875em
|
|
||||||
line-height: 1.875em
|
|
||||||
.large
|
|
||||||
font-size: 1.2em
|
|
||||||
line-height: 2.5em
|
|
||||||
margin-bottom: 1.25em
|
|
||||||
.first
|
|
||||||
margin-left: 0
|
|
||||||
padding-left: 0
|
|
||||||
.last
|
|
||||||
margin-right: 0
|
|
||||||
padding-right: 0
|
|
||||||
.top
|
|
||||||
margin-top: 0
|
|
||||||
padding-top: 0
|
|
||||||
.bottom
|
|
||||||
margin-bottom: 0
|
|
||||||
padding-bottom: 0
|
|
||||||
|
@ -1,5 +1,5 @@
|
|||||||
@import compass/utilities/general/float.sass
|
@import compass/utilities/general/float.sass
|
||||||
@import blueprint/modules/buttons.sass
|
@import blueprint/buttons.sass
|
||||||
|
|
||||||
//
|
//
|
||||||
Use the following HTML code to place the buttons on your site:
|
Use the following HTML code to place the buttons on your site:
|
||||||
@ -23,7 +23,7 @@ a.button
|
|||||||
+anchor-button("left")
|
+anchor-button("left")
|
||||||
// All the button color mixins take 4 optional arguments:
|
// All the button color mixins take 4 optional arguments:
|
||||||
// font color, background color, border color, border highlight color
|
// font color, background color, border color, border highlight color
|
||||||
// the first three default to constants set in blueprint/modules/buttons.sass
|
// the first three default to constants set in blueprint/buttons.sass
|
||||||
// the last one defaults to a shade lighter than the border color.
|
// the last one defaults to a shade lighter than the border color.
|
||||||
+button-colors
|
+button-colors
|
||||||
+button-hover-colors
|
+button-hover-colors
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
@import blueprint/modules/link_icons.sass
|
@import blueprint/link_icons.sass
|
||||||
|
|
||||||
// This turns link icons on for all links. You can change the scoping selector from
|
// This turns link icons on for all links. You can change the scoping selector from
|
||||||
// body to something more specific if you prefer.
|
// body to something more specific if you prefer.
|
||||||
|
@ -5,7 +5,7 @@
|
|||||||
// Import all the default blueprint modules so that we can access their mixins.
|
// Import all the default blueprint modules so that we can access their mixins.
|
||||||
@import blueprint
|
@import blueprint
|
||||||
// Import the non-default scaffolding module.
|
// Import the non-default scaffolding module.
|
||||||
@import blueprint/modules/scaffolding.sass
|
@import blueprint/scaffolding.sass
|
||||||
|
|
||||||
// To generate css equivalent to the blueprint css but with your configuration applied, uncomment:
|
// To generate css equivalent to the blueprint css but with your configuration applied, uncomment:
|
||||||
// +blueprint
|
// +blueprint
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
@import blueprint/screen
|
@import blueprint.sass
|
||||||
@import compass/reset
|
@import compass/reset
|
||||||
|
|
||||||
+blueprint
|
+blueprint
|
||||||
|
@ -1,3 +1,3 @@
|
|||||||
@import blueprint/modules/typography.sass
|
@import blueprint/typography.sass
|
||||||
|
|
||||||
+blueprint-typography
|
+blueprint-typography
|
Loading…
Reference in New Issue
Block a user