[Blueprint] A more complete starting blueprint configuration for new projects that follows compass best practices instead of matching blueprint css exactly.
This commit is contained in:
parent
6348ea3e67
commit
11b6ea14c3
@ -1,4 +1,5 @@
|
|||||||
stylesheet 'screen.sass', :media => 'screen, projection'
|
stylesheet 'screen.sass', :media => 'screen, projection'
|
||||||
|
stylesheet 'partials/_base.sass'
|
||||||
stylesheet 'print.sass', :media => 'print'
|
stylesheet 'print.sass', :media => 'print'
|
||||||
stylesheet 'ie.sass', :media => 'screen, projection', :condition => "lt IE 8"
|
stylesheet 'ie.sass', :media => 'screen, projection', :condition => "lt IE 8"
|
||||||
|
|
||||||
|
11
frameworks/blueprint/templates/project/partials/_base.sass
Normal file
11
frameworks/blueprint/templates/project/partials/_base.sass
Normal file
@ -0,0 +1,11 @@
|
|||||||
|
// Here is where you can define your constants for your application and to configure the blueprint framework.
|
||||||
|
// Feel free to delete these if you want keep the defaults:
|
||||||
|
|
||||||
|
!blueprint_grid_columns = 24
|
||||||
|
!blueprint_container_size = 950px
|
||||||
|
!blueprint_grid_margin = 10px
|
||||||
|
|
||||||
|
// Use this to calculate the width based on the total width.
|
||||||
|
// Or you can set !blueprint_grid_width to a fixed value and unset !blueprint_container_size -- it will be calculated for you.
|
||||||
|
!blueprint_grid_width = (!blueprint_container_size + !blueprint_grid_margin) / !blueprint_grid_columns - !blueprint_grid_margin
|
||||||
|
|
@ -1,8 +1,40 @@
|
|||||||
@import blueprint.sass
|
// This import applies a global reset to any page that imports this stylesheet.
|
||||||
@import blueprint/modules/scaffolding.sass
|
|
||||||
@import blueprint/reset.sass
|
@import blueprint/reset.sass
|
||||||
|
// To configure blueprint, edit the partials/base.sass file.
|
||||||
|
@import partials/base.sass
|
||||||
|
// Import all the default blueprint modules so that we can access their mixins.
|
||||||
|
@import blueprint
|
||||||
|
// Import the non-default scaffolding module.
|
||||||
|
@import blueprint/modules/scaffolding.sass
|
||||||
|
|
||||||
+blueprint
|
// To generate css equivalent to the blueprint css but with your configuration applied, uncomment:
|
||||||
// Remove the scaffolding when you're ready to start doing visual design.
|
// +blueprint
|
||||||
// Or leave it in if you're happy with how blueprint looks out-of-the-box
|
|
||||||
+blueprint-scaffolding
|
//Recommended Blueprint configuration with scoping and semantic layout:
|
||||||
|
body.bp
|
||||||
|
+blueprint-typography
|
||||||
|
+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
|
||||||
|
+blueprint-scaffolding
|
||||||
|
form.bp
|
||||||
|
+blueprint-form
|
||||||
|
|
||||||
|
// Page layout can be done using mixins applied to your semantic classes and IDs:
|
||||||
|
body.three-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)
|
||||||
|
Loading…
Reference in New Issue
Block a user