compass/frameworks/blueprint/templates/project/screen.sass

46 lines
1.5 KiB
Sass

// This import applies a global reset to any page that imports this stylesheet.
@import blueprint/reset
// To configure blueprint, edit the partials/base.sass file.
@import partials/base
// Import all the default blueprint modules so that we can access their mixins.
@import blueprint
// Import the non-default scaffolding module.
@import blueprint/scaffolding
// To generate css equivalent to the blueprint css but with your
// configuration applied, uncomment:
// @include blueprint
// But Compass recommends that you scope your blueprint styles
// So that you can better control what pages use blueprint
// when stylesheets are concatenated together.
+blueprint-scaffolding("body.bp")
body.bp
+blueprint-typography(true)
+blueprint-utilities
+blueprint-debug
+blueprint-interaction
// Remove the scaffolding when you're ready to start doing visual design.
// Or leave it in if you're happy with how blueprint looks out-of-the-box
form.bp
+blueprint-form
// Page layout can be done using mixins applied to your semantic classes and IDs:
body.two-col
#container
+container
#header, #footer
+column($blueprint-grid-columns)
#sidebar
// One third of the grid columns, rounding down. With 24 cols, this is 8.
$sidebar-columns: floor($blueprint-grid-columns / 3)
+column($sidebar-columns)
#content
// Two thirds of the grid columns, rounding up.
// With 24 cols, this is 16.
$content-columns: ceil(2 * $blueprint-grid-columns / 3)
// true means it's the last column in the row
+column($content-columns, true)