Upgrade docs to work on sass 3
This commit is contained in:
Chris Eppstein
parent
09abca682c
commit
cd78ca56c4
@ -2,7 +2,7 @@
|
|||||||
title: Blueprint Pull Example
|
title: Blueprint Pull Example
|
||||||
description: Uses pull to change the display order of columns.
|
description: Uses pull to change the display order of columns.
|
||||||
framework: blueprint
|
framework: blueprint
|
||||||
stylesheet: blueprint/_grid.sass
|
stylesheet: blueprint/_grid.scss
|
||||||
mixin: pull
|
mixin: pull
|
||||||
example: true
|
example: true
|
||||||
---
|
---
|
||||||
|
|||||||
@ -1,8 +1,6 @@
|
|||||||
---
|
$blueprint_grid_columns : 3
|
||||||
---
|
|
||||||
!blueprint_grid_columns = 3
|
|
||||||
|
|
||||||
@import blueprint/grid.sass
|
@import blueprint/grid.scss
|
||||||
|
|
||||||
#one
|
#one
|
||||||
+column(2, true)
|
+column(2, true)
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Two Column Layout
|
title: Two Column Layout
|
||||||
description: A semantic two-column layout
|
description: A semantic two-column layout
|
||||||
framework: blueprint
|
framework: blueprint
|
||||||
stylesheet: blueprint/_grid.sass
|
stylesheet: blueprint/_grid.scss
|
||||||
example: true
|
example: true
|
||||||
---
|
---
|
||||||
= render "partials/example"
|
= render "partials/example"
|
||||||
@ -1,5 +1,5 @@
|
|||||||
!blueprint_grid_columns = 8
|
$blueprint_grid_columns : 8
|
||||||
!blueprint_grid_width = 40px
|
$blueprint_grid_width : 40px
|
||||||
|
|
||||||
@import blueprint
|
@import blueprint
|
||||||
|
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Background Clip
|
title: Background Clip
|
||||||
description: See background-clip in action.
|
description: See background-clip in action.
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/css3/_background_clip.sass
|
stylesheet: compass/css3/_background-clip.scss
|
||||||
example: true
|
example: true
|
||||||
---
|
---
|
||||||
- render "partials/example" do
|
- render "partials/example" do
|
||||||
|
|||||||
@ -1,4 +1,4 @@
|
|||||||
@import compass/css3.sass
|
@import compass/css3.scss
|
||||||
.example
|
.example
|
||||||
padding: 2em
|
padding: 2em
|
||||||
div
|
div
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Background Origin
|
title: Background Origin
|
||||||
description: See background-origin in action.
|
description: See background-origin in action.
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/css3/_background_origin.sass
|
stylesheet: compass/css3/_background-origin.scss
|
||||||
example: true
|
example: true
|
||||||
---
|
---
|
||||||
= render "partials/example"
|
= render "partials/example"
|
||||||
|
|||||||
@ -4,7 +4,7 @@
|
|||||||
padding: 2em
|
padding: 2em
|
||||||
div
|
div
|
||||||
background:
|
background:
|
||||||
image= image-url("examples/css3/bg-origin/bg.png")
|
image: image-url("examples/css3/bg-origin/bg.png")
|
||||||
repeat: repeat
|
repeat: repeat
|
||||||
position: top left
|
position: top left
|
||||||
border: 10px solid rgba(255, 0, 0, 0.5)
|
border: 10px solid rgba(255, 0, 0, 0.5)
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Background Size
|
title: Background Size
|
||||||
description: See background-size in action.
|
description: See background-size in action.
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/css3/_background_size.sass
|
stylesheet: compass/css3/_background-size.scss
|
||||||
example: true
|
example: true
|
||||||
---
|
---
|
||||||
= render "partials/example"
|
= render "partials/example"
|
||||||
|
|||||||
@ -4,7 +4,7 @@
|
|||||||
padding: 2em
|
padding: 2em
|
||||||
div
|
div
|
||||||
background:
|
background:
|
||||||
image= image-url("examples/css3/bg-origin/bg.png")
|
image: image-url("examples/css3/bg-origin/bg.png")
|
||||||
repeat: no-repeat
|
repeat: no-repeat
|
||||||
position: top left
|
position: top left
|
||||||
border: 10px solid rgba(255, 0, 0, 0.5)
|
border: 10px solid rgba(255, 0, 0, 0.5)
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Border radius
|
title: Border radius
|
||||||
description: css3 mixin for border-radius
|
description: css3 mixin for border-radius
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/css3/_border_radius.sass
|
stylesheet: compass/css3/_border-radius.scss
|
||||||
example: true
|
example: true
|
||||||
---
|
---
|
||||||
= render "partials/example"
|
= render "partials/example"
|
||||||
@ -2,7 +2,7 @@
|
|||||||
title: Box-shadow
|
title: Box-shadow
|
||||||
description: css3 mixin for box-shadow
|
description: css3 mixin for box-shadow
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/css3/_box_shadow.sass
|
stylesheet: compass/css3/_box-shadow.scss
|
||||||
example: true
|
example: true
|
||||||
---
|
---
|
||||||
= render "partials/example"
|
= render "partials/example"
|
||||||
@ -2,7 +2,7 @@
|
|||||||
title: Box-sizing
|
title: Box-sizing
|
||||||
description: css3 mixin for box-sizing
|
description: css3 mixin for box-sizing
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/css3/_box_sizing.sass
|
stylesheet: compass/css3/_box-sizing.scss
|
||||||
example: true
|
example: true
|
||||||
---
|
---
|
||||||
= render "partials/example"
|
= render "partials/example"
|
||||||
@ -2,7 +2,7 @@
|
|||||||
title: Columns
|
title: Columns
|
||||||
description: css3 mixin for css columns
|
description: css3 mixin for css columns
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/css3/_columns.sass
|
stylesheet: compass/css3/_columns.scss
|
||||||
example: true
|
example: true
|
||||||
---
|
---
|
||||||
= render "partials/example"
|
= render "partials/example"
|
||||||
@ -2,7 +2,7 @@
|
|||||||
title: Compass Font Face Example
|
title: Compass Font Face Example
|
||||||
description: How to use the @font-face mixin
|
description: How to use the @font-face mixin
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/css3/_font_face.sass
|
stylesheet: compass/css3/_font-face.scss
|
||||||
example: true
|
example: true
|
||||||
---
|
---
|
||||||
= render "partials/example"
|
= render "partials/example"
|
||||||
|
|||||||
@ -1,6 +1,6 @@
|
|||||||
@import compass/css3
|
@import compass/css3
|
||||||
|
|
||||||
+font-face("Angelina", font_files("examples/angelina.ttf", "truetype"))
|
+font-face("Angelina", font-files("examples/angelina.ttf", "truetype"))
|
||||||
.example
|
.example
|
||||||
font-family: "Angelina"
|
font-family: "Angelina"
|
||||||
padding: 1em
|
padding: 1em
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Gradient
|
title: Gradient
|
||||||
description: css3 mixin for css gradients
|
description: css3 mixin for css gradients
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/css3/_gradient.sass
|
stylesheet: compass/css3/_gradient.scss
|
||||||
example: true
|
example: true
|
||||||
---
|
---
|
||||||
= render "partials/example"
|
= render "partials/example"
|
||||||
@ -8,24 +8,24 @@
|
|||||||
|
|
||||||
// This will yield a radial gradient with an apparent specular highlight
|
// This will yield a radial gradient with an apparent specular highlight
|
||||||
#radial-gradient
|
#radial-gradient
|
||||||
+radial-gradient(color_stops(#00FFFF 10px, #1E90FF 30px), 45 45)
|
+radial-gradient(color-stops(#00FFFF 10px, #1E90FF 30px), 45 45)
|
||||||
|
|
||||||
// This yields a linear gradient spanning from the upper left corner to the lower right corner
|
// This yields a linear gradient spanning from the upper left corner to the lower right corner
|
||||||
#linear-gradient
|
#linear-gradient
|
||||||
+linear-gradient(color_stops(#fff, #ddd), "left top")
|
+linear-gradient(color-stops(#fff, #ddd), "left top")
|
||||||
|
|
||||||
// This yields a gradient starting at the top with #fff, ending in #aaa
|
// This yields a gradient starting at the top with #fff, ending in #aaa
|
||||||
#v-gradient
|
#v-gradient
|
||||||
+linear-gradient(color_stops(#fff, #aaa))
|
+linear-gradient(color-stops(#fff, #aaa))
|
||||||
|
|
||||||
// Same as above but with a #ccc at the halfway point
|
// Same as above but with a #ccc at the halfway point
|
||||||
#v-gradient-2
|
#v-gradient-2
|
||||||
+linear-gradient(color_stops(#fff, #ccc, #aaa))
|
+linear-gradient(color-stops(#fff, #ccc, #aaa))
|
||||||
|
|
||||||
// Same as the first example but with #ccc at the 30% from the top, and #bbb at 70% from the top
|
// Same as the first example but with #ccc at the 30% from the top, and #bbb at 70% from the top
|
||||||
#v-gradient-3
|
#v-gradient-3
|
||||||
+linear-gradient(color_stops(#fff, #ccc 30%, #bbb 70%, #aaa))
|
+linear-gradient(color-stops(#fff, #ccc 30%, #bbb 70%, #aaa))
|
||||||
|
|
||||||
// This yields a horizontal linear gradient spanning from left to right.
|
// This yields a horizontal linear gradient spanning from left to right.
|
||||||
#h-gradient
|
#h-gradient
|
||||||
+linear-gradient(color_stops(#fff, #ddd), "left")
|
+linear-gradient(color-stops(#fff, #ddd), "left")
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Inline-block
|
title: Inline-block
|
||||||
description: css3 mixin for inline-block
|
description: css3 mixin for inline-block
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/css3/_inline_block.sass
|
stylesheet: compass/css3/_inline-block.scss
|
||||||
example: true
|
example: true
|
||||||
---
|
---
|
||||||
= render "partials/example"
|
= render "partials/example"
|
||||||
@ -2,7 +2,7 @@
|
|||||||
title: Opacity
|
title: Opacity
|
||||||
description: css3 mixin for opacity
|
description: css3 mixin for opacity
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/css3/_opacity.sass
|
stylesheet: compass/css3/_opacity.scss
|
||||||
example: true
|
example: true
|
||||||
---
|
---
|
||||||
= render "partials/example"
|
= render "partials/example"
|
||||||
@ -2,7 +2,7 @@
|
|||||||
title: Text-shadow
|
title: Text-shadow
|
||||||
description: css3 mixin for text-shadow
|
description: css3 mixin for text-shadow
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/css3/_text_shadow.sass
|
stylesheet: compass/css3/_text-shadow.scss
|
||||||
example: true
|
example: true
|
||||||
---
|
---
|
||||||
= render "partials/example"
|
= render "partials/example"
|
||||||
@ -2,7 +2,7 @@
|
|||||||
title: Transform
|
title: Transform
|
||||||
description: css3 mixin for css transforms
|
description: css3 mixin for css transforms
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/css3/_transform.sass
|
stylesheet: compass/css3/_transform.scss
|
||||||
example: true
|
example: true
|
||||||
---
|
---
|
||||||
= render "partials/example"
|
= render "partials/example"
|
||||||
@ -2,7 +2,7 @@
|
|||||||
title: Transition
|
title: Transition
|
||||||
description: css3 mixin for css transitions
|
description: css3 mixin for css transitions
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/css3/_transition.sass
|
stylesheet: compass/css3/_transition.scss
|
||||||
example: true
|
example: true
|
||||||
---
|
---
|
||||||
= render "partials/example"
|
= render "partials/example"
|
||||||
@ -2,7 +2,7 @@
|
|||||||
title: Compass Sticky Footer Example
|
title: Compass Sticky Footer Example
|
||||||
description: How to use the sticky footer mixin.
|
description: How to use the sticky footer mixin.
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/layout/_sticky_footer.sass
|
stylesheet: compass/layout/_sticky-footer.scss
|
||||||
example: true
|
example: true
|
||||||
---
|
---
|
||||||
= render "partials/example"
|
= render "partials/example"
|
||||||
|
|||||||
@ -1,5 +1,5 @@
|
|||||||
@import compass/reset.sass
|
@import compass/reset.scss
|
||||||
@import compass/layout.sass
|
@import compass/layout.scss
|
||||||
|
|
||||||
+sticky-footer(72px, "#layout", "#layout_footer", "#footer")
|
+sticky-footer(72px, "#layout", "#layout_footer", "#footer")
|
||||||
|
|
||||||
|
|||||||
@ -157,10 +157,10 @@ crumb: Plugins and frameworks
|
|||||||
\.
|
\.
|
||||||
%ul
|
%ul
|
||||||
%li
|
%li
|
||||||
%a{ :href => "http://github.com/handcrafted/handcrafted-compass-mixins/blob/master/_border-radius.sass" }
|
%a{ :href => "http://github.com/handcrafted/handcrafted-compass-mixins/blob/master/_border-radius.scss" }
|
||||||
Handcrafted Rounded Corners
|
Handcrafted Rounded Corners
|
||||||
%li
|
%li
|
||||||
%a{ :href => "http://github.com/ntreadway/JQuery.tools.tabs.sass" }
|
%a{ :href => "http://github.com/ntreadway/JQuery.tools.tabs.scss" }
|
||||||
Ntreadway JQuery tools tabs
|
Ntreadway JQuery tools tabs
|
||||||
%h3
|
%h3
|
||||||
Plugins that are Works-In-Progress
|
Plugins that are Works-In-Progress
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Blueprint Module
|
title: Blueprint Module
|
||||||
crumb: Blueprint
|
crumb: Blueprint
|
||||||
framework: blueprint
|
framework: blueprint
|
||||||
stylesheet: _blueprint.sass
|
stylesheet: _blueprint.scss
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
meta_description: The Blueprint Framework -- ported to Sass.
|
meta_description: The Blueprint Framework -- ported to Sass.
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Blueprint Buttons
|
title: Blueprint Buttons
|
||||||
crumb: Buttons
|
crumb: Buttons
|
||||||
framework: blueprint
|
framework: blueprint
|
||||||
stylesheet: blueprint/_buttons.sass
|
stylesheet: blueprint/_buttons.scss
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
---
|
---
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Blueprint Colors
|
title: Blueprint Colors
|
||||||
crumb: Colors
|
crumb: Colors
|
||||||
framework: blueprint
|
framework: blueprint
|
||||||
stylesheet: blueprint/_colors.sass
|
stylesheet: blueprint/_colors.scss
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
---
|
---
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Blueprint Debug
|
title: Blueprint Debug
|
||||||
crumb: Debug
|
crumb: Debug
|
||||||
framework: blueprint
|
framework: blueprint
|
||||||
stylesheet: blueprint/_debug.sass
|
stylesheet: blueprint/_debug.scss
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
---
|
---
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Blueprint Fancy Type
|
title: Blueprint Fancy Type
|
||||||
crumb: Fancy Type
|
crumb: Fancy Type
|
||||||
framework: blueprint
|
framework: blueprint
|
||||||
stylesheet: blueprint/_fancy_type.sass
|
stylesheet: blueprint/_fancy-type.scss
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
---
|
---
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Blueprint Form
|
title: Blueprint Form
|
||||||
crumb: Form
|
crumb: Form
|
||||||
framework: blueprint
|
framework: blueprint
|
||||||
stylesheet: blueprint/_form.sass
|
stylesheet: blueprint/_form.scss
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
---
|
---
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Blueprint Grid
|
title: Blueprint Grid
|
||||||
crumb: Grid
|
crumb: Grid
|
||||||
framework: blueprint
|
framework: blueprint
|
||||||
stylesheet: blueprint/_grid.sass
|
stylesheet: blueprint/_grid.scss
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
---
|
---
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Blueprint IE Compatibility
|
title: Blueprint IE Compatibility
|
||||||
crumb: Internet Explorer
|
crumb: Internet Explorer
|
||||||
framework: blueprint
|
framework: blueprint
|
||||||
stylesheet: blueprint/_ie.sass
|
stylesheet: blueprint/_ie.scss
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
---
|
---
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Blueprint Interaction
|
title: Blueprint Interaction
|
||||||
crumb: Interaction
|
crumb: Interaction
|
||||||
framework: blueprint
|
framework: blueprint
|
||||||
stylesheet: blueprint/_interaction.sass
|
stylesheet: blueprint/_interaction.scss
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
---
|
---
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Blueprint Link Icons
|
title: Blueprint Link Icons
|
||||||
crumb: Link Icons
|
crumb: Link Icons
|
||||||
framework: blueprint
|
framework: blueprint
|
||||||
stylesheet: blueprint/_link_icons.sass
|
stylesheet: blueprint/_link-icons.scss
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
---
|
---
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Blueprint Liquid
|
title: Blueprint Liquid
|
||||||
crumb: Liquid
|
crumb: Liquid
|
||||||
framework: blueprint
|
framework: blueprint
|
||||||
stylesheet: blueprint/_liquid.sass
|
stylesheet: blueprint/_liquid.scss
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
---
|
---
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Blueprint Print
|
title: Blueprint Print
|
||||||
crumb: Print
|
crumb: Print
|
||||||
framework: blueprint
|
framework: blueprint
|
||||||
stylesheet: blueprint/_print.sass
|
stylesheet: blueprint/_print.scss
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
---
|
---
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Blueprint Reset
|
title: Blueprint Reset
|
||||||
crumb: Reset
|
crumb: Reset
|
||||||
framework: blueprint
|
framework: blueprint
|
||||||
stylesheet: blueprint/_reset.sass
|
stylesheet: blueprint/_reset.scss
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
---
|
---
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Blueprint Rtl
|
title: Blueprint Rtl
|
||||||
crumb: Rtl
|
crumb: Rtl
|
||||||
framework: blueprint
|
framework: blueprint
|
||||||
stylesheet: blueprint/_rtl.sass
|
stylesheet: blueprint/_rtl.scss
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
---
|
---
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Blueprint Scaffolding
|
title: Blueprint Scaffolding
|
||||||
crumb: Scaffolding
|
crumb: Scaffolding
|
||||||
framework: blueprint
|
framework: blueprint
|
||||||
stylesheet: blueprint/_scaffolding.sass
|
stylesheet: blueprint/_scaffolding.scss
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
---
|
---
|
||||||
|
|||||||
@ -1,11 +0,0 @@
|
|||||||
---
|
|
||||||
title: Blueprint Screen
|
|
||||||
crumb: Screen
|
|
||||||
framework: blueprint
|
|
||||||
stylesheet: blueprint/_screen.sass
|
|
||||||
classnames:
|
|
||||||
- reference
|
|
||||||
---
|
|
||||||
- render 'reference' do
|
|
||||||
%p
|
|
||||||
Lorem ipsum dolor sit amet.
|
|
||||||
@ -2,7 +2,7 @@
|
|||||||
title: Blueprint Typography
|
title: Blueprint Typography
|
||||||
crumb: Typography
|
crumb: Typography
|
||||||
framework: blueprint
|
framework: blueprint
|
||||||
stylesheet: blueprint/_typography.sass
|
stylesheet: blueprint/_typography.scss
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
---
|
---
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Blueprint Utilities
|
title: Blueprint Utilities
|
||||||
crumb: Utilities
|
crumb: Utilities
|
||||||
framework: blueprint
|
framework: blueprint
|
||||||
stylesheet: blueprint/_utilities.sass
|
stylesheet: blueprint/_utilities.scss
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
---
|
---
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Compass Core Framework
|
title: Compass Core Framework
|
||||||
crumb: Compass Core
|
crumb: Compass Core
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: _compass.sass
|
stylesheet: _compass.scss
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
meta_description: The Compass Core Framework.
|
meta_description: The Compass Core Framework.
|
||||||
@ -18,7 +18,7 @@ meta_description: The Compass Core Framework.
|
|||||||
%p
|
%p
|
||||||
You can import these yourself if you want to use them.
|
You can import these yourself if you want to use them.
|
||||||
%ul
|
%ul
|
||||||
= render "partials/reference/import", :import => "compass/_layout.sass"
|
= render "partials/reference/import", :import => "compass/_layout.scss"
|
||||||
= render "partials/reference/import", :import => "compass/_reset.sass"
|
= render "partials/reference/import", :import => "compass/_reset.scss"
|
||||||
= render "partials/reference/import", :import => "compass/_misc.sass"
|
= render "partials/reference/import", :import => "compass/_misc.scss"
|
||||||
|
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Compass CSS3
|
title: Compass CSS3
|
||||||
crumb: CSS3
|
crumb: CSS3
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/_css3.sass
|
stylesheet: compass/_css3.scss
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
meta_description: Provides cross browser CSS3 mixins that take advantage of available pre-spec vendor prefixes.
|
meta_description: Provides cross browser CSS3 mixins that take advantage of available pre-spec vendor prefixes.
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Compass Background Clip
|
title: Compass Background Clip
|
||||||
crumb: Background Clip
|
crumb: Background Clip
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/css3/_background_clip.sass
|
stylesheet: compass/css3/_background-clip.scss
|
||||||
meta_description: Specify the background clip for all browsers.
|
meta_description: Specify the background clip for all browsers.
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Compass Background Origin
|
title: Compass Background Origin
|
||||||
crumb: Background Origin
|
crumb: Background Origin
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/css3/_background_origin.sass
|
stylesheet: compass/css3/_background-origin.scss
|
||||||
meta_description: Specify the background origin for all browsers.
|
meta_description: Specify the background origin for all browsers.
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Compass Background Size
|
title: Compass Background Size
|
||||||
crumb: Background Size
|
crumb: Background Size
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/css3/_background_size.sass
|
stylesheet: compass/css3/_background-size.scss
|
||||||
meta_description: Specify the background size for all browsers.
|
meta_description: Specify the background size for all browsers.
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Compass Border Radius
|
title: Compass Border Radius
|
||||||
crumb: Border Radius
|
crumb: Border Radius
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/css3/_border_radius.sass
|
stylesheet: compass/css3/_border-radius.scss
|
||||||
meta_description: Specify the border radius for all browsers.
|
meta_description: Specify the border radius for all browsers.
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Compass Box Shadow
|
title: Compass Box Shadow
|
||||||
crumb: Box Shadow
|
crumb: Box Shadow
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/css3/_box_shadow.sass
|
stylesheet: compass/css3/_box-shadow.scss
|
||||||
meta_description: Specify the box shadow for all browsers.
|
meta_description: Specify the box shadow for all browsers.
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Compass Box Sizing
|
title: Compass Box Sizing
|
||||||
crumb: Box Sizing
|
crumb: Box Sizing
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/css3/_box_sizing.sass
|
stylesheet: compass/css3/_box-sizing.scss
|
||||||
meta_description: Specify the box sizing for all browsers.
|
meta_description: Specify the box sizing for all browsers.
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Compass Columns
|
title: Compass Columns
|
||||||
crumb: Columns
|
crumb: Columns
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/css3/_columns.sass
|
stylesheet: compass/css3/_columns.scss
|
||||||
meta_description: Specify a columnar layout for all browsers.
|
meta_description: Specify a columnar layout for all browsers.
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Compass Font Face
|
title: Compass Font Face
|
||||||
crumb: Font Face
|
crumb: Font Face
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/css3/_font_face.sass
|
stylesheet: compass/css3/_font-face.scss
|
||||||
meta_description: Specify a downloadable font face for all browsers.
|
meta_description: Specify a downloadable font face for all browsers.
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Compass Gradient
|
title: Compass Gradient
|
||||||
crumb: Gradient
|
crumb: Gradient
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/css3/_gradient.sass
|
stylesheet: compass/css3/_gradient.scss
|
||||||
meta_description: Specify linear gradients and radial gradients for all browsers.
|
meta_description: Specify linear gradients and radial gradients for all browsers.
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Compass Inline Block
|
title: Compass Inline Block
|
||||||
crumb: Inline Block
|
crumb: Inline Block
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/css3/_inline_block.sass
|
stylesheet: compass/css3/_inline-block.scss
|
||||||
meta_description: Declare an element inline block for all browsers.
|
meta_description: Declare an element inline block for all browsers.
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Compass Opacity
|
title: Compass Opacity
|
||||||
crumb: Opacity
|
crumb: Opacity
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/css3/_opacity.sass
|
stylesheet: compass/css3/_opacity.scss
|
||||||
meta_description: Specify the opacity for all browsers.
|
meta_description: Specify the opacity for all browsers.
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Compass Text Shadow
|
title: Compass Text Shadow
|
||||||
crumb: Text Shadow
|
crumb: Text Shadow
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/css3/_text_shadow.sass
|
stylesheet: compass/css3/_text-shadow.scss
|
||||||
meta_description: Specify the text shadow for all browsers.
|
meta_description: Specify the text shadow for all browsers.
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Compass Transform
|
title: Compass Transform
|
||||||
crumb: Transform
|
crumb: Transform
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/css3/_transform.sass
|
stylesheet: compass/css3/_transform.scss
|
||||||
meta_description: Specify the 2D transformation for all browsers.
|
meta_description: Specify the 2D transformation for all browsers.
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Compass Transition
|
title: Compass Transition
|
||||||
crumb: Transition
|
crumb: Transition
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/css3/_transition.sass
|
stylesheet: compass/css3/_transition.scss
|
||||||
meta_description: Specify a style transition for all browsers.
|
meta_description: Specify a style transition for all browsers.
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Compass Layout
|
title: Compass Layout
|
||||||
crumb: Layout
|
crumb: Layout
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/_layout.sass
|
stylesheet: compass/_layout.scss
|
||||||
meta_description: Page layout module. So far, this is just the sticky-footer mixin.
|
meta_description: Page layout module. So far, this is just the sticky-footer mixin.
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Compass Sticky Footer
|
title: Compass Sticky Footer
|
||||||
crumb: Sticky Footer
|
crumb: Sticky Footer
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/layout/_sticky_footer.sass
|
stylesheet: compass/layout/_sticky-footer.scss
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
---
|
---
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Compass Misc
|
title: Compass Misc
|
||||||
crumb: Misc
|
crumb: Misc
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/_misc.sass
|
stylesheet: compass/_misc.scss
|
||||||
meta_description: Cute stuff you probably don't need.
|
meta_description: Cute stuff you probably don't need.
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Compass Reset
|
title: Compass Reset
|
||||||
crumb: Reset
|
crumb: Reset
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/_reset.sass
|
stylesheet: compass/_reset.scss
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
meta_description: Adds a CSS Reset into your stylesheet.
|
meta_description: Adds a CSS Reset into your stylesheet.
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Compass Utilities
|
title: Compass Utilities
|
||||||
crumb: Utilities
|
crumb: Utilities
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/_utilities.sass
|
stylesheet: compass/_utilities.scss
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
meta_description: Provides basic mixins for common styling patterns.
|
meta_description: Provides basic mixins for common styling patterns.
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Compass General
|
title: Compass General
|
||||||
crumb: General
|
crumb: General
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/utilities/_general.sass
|
stylesheet: compass/utilities/_general.scss
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
---
|
---
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Compass Clearfix
|
title: Compass Clearfix
|
||||||
crumb: Clearfix
|
crumb: Clearfix
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/utilities/general/_clearfix.sass
|
stylesheet: compass/utilities/general/_clearfix.scss
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
---
|
---
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Compass Float
|
title: Compass Float
|
||||||
crumb: Float
|
crumb: Float
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/utilities/general/_float.sass
|
stylesheet: compass/utilities/general/_float.scss
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
---
|
---
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Compass Hacks
|
title: Compass Hacks
|
||||||
crumb: Hacks
|
crumb: Hacks
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/utilities/general/_hacks.sass
|
stylesheet: compass/utilities/general/_hacks.scss
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
---
|
---
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Compass Min
|
title: Compass Min
|
||||||
crumb: Min
|
crumb: Min
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/utilities/general/_min.sass
|
stylesheet: compass/utilities/general/_min.scss
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
---
|
---
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Compass Reset
|
title: Compass Reset
|
||||||
crumb: Reset
|
crumb: Reset
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/utilities/general/_reset.sass
|
stylesheet: compass/utilities/general/_reset.scss
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
---
|
---
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Compass Tabs
|
title: Compass Tabs
|
||||||
crumb: Tabs
|
crumb: Tabs
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/utilities/general/_tabs.sass
|
stylesheet: compass/utilities/general/_tabs.scss
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
---
|
---
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Compass Tag_cloud
|
title: Compass Tag_cloud
|
||||||
crumb: Tag Cloud
|
crumb: Tag Cloud
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/utilities/general/_tag_cloud.sass
|
stylesheet: compass/utilities/general/_tag-cloud.scss
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
---
|
---
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Compass Links
|
title: Compass Links
|
||||||
crumb: Links
|
crumb: Links
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/utilities/_links.sass
|
stylesheet: compass/utilities/_links.scss
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
---
|
---
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Compass Hover Link
|
title: Compass Hover Link
|
||||||
crumb: Hover Link
|
crumb: Hover Link
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/utilities/links/_hover_link.sass
|
stylesheet: compass/utilities/links/_hover-link.scss
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
---
|
---
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Compass Link Colors
|
title: Compass Link Colors
|
||||||
crumb: Link Colors
|
crumb: Link Colors
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/utilities/links/_link_colors.sass
|
stylesheet: compass/utilities/links/_link-colors.scss
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
---
|
---
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Compass Unstyled Link
|
title: Compass Unstyled Link
|
||||||
crumb: Unstyled Link
|
crumb: Unstyled Link
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/utilities/links/_unstyled_link.sass
|
stylesheet: compass/utilities/links/_unstyled-link.scss
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
---
|
---
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Compass Lists
|
title: Compass Lists
|
||||||
crumb: Lists
|
crumb: Lists
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/utilities/_lists.sass
|
stylesheet: compass/utilities/_lists.scss
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
---
|
---
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Compass Bullets
|
title: Compass Bullets
|
||||||
crumb: Bullets
|
crumb: Bullets
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/utilities/lists/_bullets.sass
|
stylesheet: compass/utilities/lists/_bullets.scss
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
---
|
---
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Compass Horizontal List
|
title: Compass Horizontal List
|
||||||
crumb: Horizontal List
|
crumb: Horizontal List
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/utilities/lists/_horizontal_list.sass
|
stylesheet: compass/utilities/lists/_horizontal-list.scss
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
---
|
---
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Compass Inline List
|
title: Compass Inline List
|
||||||
crumb: Inline List
|
crumb: Inline List
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/utilities/lists/_inline_list.sass
|
stylesheet: compass/utilities/lists/_inline-list.scss
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
---
|
---
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Compass Print
|
title: Compass Print
|
||||||
crumb: Print
|
crumb: Print
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/utilities/_print.sass
|
stylesheet: compass/utilities/_print.scss
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
---
|
---
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Compass Sprites
|
title: Compass Sprites
|
||||||
crumb: Sprites
|
crumb: Sprites
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/utilities/_sprites.sass
|
stylesheet: compass/utilities/_sprites.scss
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
---
|
---
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Compass Sprite Image
|
title: Compass Sprite Image
|
||||||
crumb: Sprite Image
|
crumb: Sprite Image
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/utilities/sprites/_sprite_img.sass
|
stylesheet: compass/utilities/sprites/_sprite-img.scss
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
---
|
---
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Compass Tables
|
title: Compass Tables
|
||||||
crumb: Tables
|
crumb: Tables
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/utilities/_tables.sass
|
stylesheet: compass/utilities/_tables.scss
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
---
|
---
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Compass Alternating Rows and Columns
|
title: Compass Alternating Rows and Columns
|
||||||
crumb: Alternating Rows And Columns
|
crumb: Alternating Rows And Columns
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/utilities/tables/_alternating_rows_and_columns.sass
|
stylesheet: compass/utilities/tables/_alternating-rows-and-columns.scss
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
---
|
---
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Compass Borders
|
title: Compass Borders
|
||||||
crumb: Borders
|
crumb: Borders
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/utilities/tables/_borders.sass
|
stylesheet: compass/utilities/tables/_borders.scss
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
---
|
---
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Compass Scaffolding
|
title: Compass Scaffolding
|
||||||
crumb: Scaffolding
|
crumb: Scaffolding
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/utilities/tables/_scaffolding.sass
|
stylesheet: compass/utilities/tables/_scaffolding.scss
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
---
|
---
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Compass Text
|
title: Compass Text
|
||||||
crumb: Text
|
crumb: Text
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/utilities/_text.sass
|
stylesheet: compass/utilities/_text.scss
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
---
|
---
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Compass Ellipsis
|
title: Compass Ellipsis
|
||||||
crumb: Ellipsis
|
crumb: Ellipsis
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/utilities/text/_ellipsis.sass
|
stylesheet: compass/utilities/text/_ellipsis.scss
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
---
|
---
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Compass Nowrap
|
title: Compass Nowrap
|
||||||
crumb: Nowrap
|
crumb: Nowrap
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/utilities/text/_nowrap.sass
|
stylesheet: compass/utilities/text/_nowrap.scss
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
---
|
---
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
title: Compass Replacement
|
title: Compass Replacement
|
||||||
crumb: Replacement
|
crumb: Replacement
|
||||||
framework: compass
|
framework: compass
|
||||||
stylesheet: compass/utilities/text/_replacement.sass
|
stylesheet: compass/utilities/text/_replacement.scss
|
||||||
classnames:
|
classnames:
|
||||||
- reference
|
- reference
|
||||||
---
|
---
|
||||||
|
|||||||
@ -22,5 +22,5 @@ body
|
|||||||
margin: 0
|
margin: 0
|
||||||
overflow: auto
|
overflow: auto
|
||||||
|
|
||||||
@import partials/syntax.sass
|
@import partials/syntax
|
||||||
|
|
||||||
@ -154,4 +154,4 @@ body#reference-compass-css3
|
|||||||
#text-shadow
|
#text-shadow
|
||||||
+text-shadow(red)
|
+text-shadow(red)
|
||||||
|
|
||||||
@import partials/syntax.sass
|
@import partials/syntax
|
||||||
@ -1,2 +1,2 @@
|
|||||||
@import partials/syntax/coderay.sass
|
@import partials/syntax/coderay
|
||||||
@import partials/syntax/pygments.sass
|
@import partials/syntax/pygments
|
||||||
@ -1,7 +1,7 @@
|
|||||||
.CodeRay
|
.CodeRay
|
||||||
.debug
|
.debug
|
||||||
color: white ! important
|
color: white !important
|
||||||
background: blue ! important
|
background: blue !important
|
||||||
.af
|
.af
|
||||||
color: #00C
|
color: #00C
|
||||||
.an
|
.an
|
||||||
|
|||||||
@ -8,7 +8,7 @@ crumb: Best practices
|
|||||||
%p
|
%p
|
||||||
Create a
|
Create a
|
||||||
%code
|
%code
|
||||||
_base.sass
|
_base.scss
|
||||||
%a{ :href => "http://sass-lang.com/docs/yardoc/file.SASS_REFERENCE.html#partials" }
|
%a{ :href => "http://sass-lang.com/docs/yardoc/file.SASS_REFERENCE.html#partials" }
|
||||||
partial
|
partial
|
||||||
to initialize your stylesheets with common variables and (
|
to initialize your stylesheets with common variables and (
|
||||||
@ -16,43 +16,43 @@ crumb: Best practices
|
|||||||
often
|
often
|
||||||
) the framework utilities you plan to use:
|
) the framework utilities you plan to use:
|
||||||
%h4
|
%h4
|
||||||
_base.sass
|
_base.scss
|
||||||
%pre
|
%pre
|
||||||
\!blueprint_grid_columns = 24
|
\!blueprint_grid_columns = 24
|
||||||
\!blueprint_grid_width = 30px
|
\!blueprint_grid_width = 30px
|
||||||
\!blueprint_grid_margin = 10px
|
\!blueprint_grid_margin = 10px
|
||||||
\!font_color = #333
|
\!font_color = #333
|
||||||
\
|
\
|
||||||
@import compass/reset.sass
|
@import compass/reset.scss
|
||||||
@import compass/utilities.sass
|
@import compass/utilities.scss
|
||||||
@import blueprint/screen.sass
|
@import blueprint/screen.scss
|
||||||
\
|
\
|
||||||
\// etc.
|
\// etc.
|
||||||
%p
|
%p
|
||||||
The
|
The
|
||||||
%code
|
%code
|
||||||
_base.sass
|
_base.scss
|
||||||
file is also a great place to keep your own custom mixins, so they’re available to any stylesheet that includes it.
|
file is also a great place to keep your own custom mixins, so they’re available to any stylesheet that includes it.
|
||||||
%p
|
%p
|
||||||
Then you can include this file in all other stylesheets:
|
Then you can include this file in all other stylesheets:
|
||||||
%h4
|
%h4
|
||||||
application.sass
|
application.scss
|
||||||
%pre
|
%pre
|
||||||
@import base.sass
|
@import base.scss
|
||||||
\
|
\
|
||||||
\#wrapper
|
\#wrapper
|
||||||
\ +container
|
\ +container
|
||||||
\
|
\
|
||||||
\// etc.
|
\// etc.
|
||||||
%p
|
%p
|
||||||
It is important to define any compass/framework constants that you want to override in base.sass first, before @import-ing the framework files. See
|
It is important to define any compass/framework constants that you want to override in base.scss first, before @import-ing the framework files. See
|
||||||
%a{ :href => "http://wiki.github.com/chriseppstein/compass/overriding-constants" }
|
%a{ :href => "http://wiki.github.com/chriseppstein/compass/overriding-constants" }
|
||||||
Overriding Constants
|
Overriding Constants
|
||||||
, for an example of where the number of grid columns for blueprint is overridden/set to 32.
|
, for an example of where the number of grid columns for blueprint is overridden/set to 32.
|
||||||
%br
|
%br
|
||||||
Note that you can refer to
|
Note that you can refer to
|
||||||
%code
|
%code
|
||||||
_base.sass
|
_base.scss
|
||||||
without the leading underscore, since it is a
|
without the leading underscore, since it is a
|
||||||
%a{ :href => "http://sass-lang.com/docs/yardoc/file.SASS_REFERENCE.html#partials" }
|
%a{ :href => "http://sass-lang.com/docs/yardoc/file.SASS_REFERENCE.html#partials" }
|
||||||
partial
|
partial
|
||||||
|
|||||||
@ -27,4 +27,4 @@ classnames:
|
|||||||
|
|
||||||
Because of this, it is common to have one or more partials
|
Because of this, it is common to have one or more partials
|
||||||
that set the constants first and get imported before any other imports in your stylesheet(s).
|
that set the constants first and get imported before any other imports in your stylesheet(s).
|
||||||
This is commonly referred to as the "base" stylesheet and is usually named `_base.sass`.
|
This is commonly referred to as the "base" stylesheet and is usually named `_base.scss`.
|
||||||
@ -1,6 +1,7 @@
|
|||||||
- if breadcrumbs_trail.size > 1
|
- if breadcrumbs_trail.size > 1
|
||||||
%ol#breadcrumbs
|
%ol#breadcrumbs
|
||||||
- breadcrumbs_trail.each_with_index do |bc, index|
|
- breadcrumbs_trail.each_with_index do |bc, index|
|
||||||
|
- next unless bc
|
||||||
- klass = "first" if index == 0
|
- klass = "first" if index == 0
|
||||||
- klass = "last" if index == breadcrumbs_trail.size - 1
|
- klass = "last" if index == breadcrumbs_trail.size - 1
|
||||||
%li{:class => klass}= link_to_unless_current((bc[:crumb] || bc[:title]), bc.reps.find { |r| r.name == :default })
|
%li{:class => klass}= link_to_unless_current((bc[:crumb] || bc[:title]), bc.reps.find { |r| r.name == :default })
|
||||||
|
|||||||
@ -4,7 +4,7 @@
|
|||||||
%a.permalink{:href => "#const-#{const_id}"}= "!"+constant_def.name
|
%a.permalink{:href => "#const-#{const_id}"}= "!"+constant_def.name
|
||||||
%dl.constant-details.source-documentation
|
%dl.constant-details.source-documentation
|
||||||
%dt Value
|
%dt Value
|
||||||
%dd= constant_def.expr.to_sass(:html)
|
%dd= constant_def.expr.to_sass(:format => :html)
|
||||||
- if constant_def.comment
|
- if constant_def.comment
|
||||||
%dt Description
|
%dt Description
|
||||||
%dd= format_doc constant_def.comment
|
%dd= format_doc constant_def.comment
|
||||||
|
|||||||
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue
Block a user