Skip to content

Instantly share code, notes, and snippets.

@solars
Created April 27, 2011 21:45
Show Gist options
  • Save solars/945292 to your computer and use it in GitHub Desktop.
Save solars/945292 to your computer and use it in GitHub Desktop.
// 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";
@import "blueprint/grid";
// To generate css equivalent to the blueprint css but with your
// configuration applied, uncomment:
// @include blueprint
// If you are doing a lot of stylesheet concatenation, it is suggested
// that you scope your blueprint styles, so that you can better control
// what pages use blueprint when stylesheets are concatenated together.
body.bp {
@include blueprint-typography(true);
@include blueprint-utilities;
@include blueprint-debug;
@include 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 {
@include blueprint-form;
// You'll probably want to remove the scaffolding once you start styling your site.
@include blueprint-scaffolding; }
//// Page layout can be done using mixins applied to your semantic classes and IDs:
//body.two-col {
//#container {
//@include container; }
//#header, #footer {
//@include 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);
//@include 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
//@include column($content-columns, true); } }
$blueprint_grid_columns: 8;
$blueprint_grid_width: 40px;
div#container {
@include container;
background-color: #cccccc;
#header, #footer {
@include column(8); }
#sidebar {
@include column(3); }
#content {
@include column(5, true); } }
doctype html
html
head
title Online Exif Viewer
meta name="google-site-verification" content="pKSi2Sz11JlBcgmnl3FOTYKL5p8Y5gEWSK0A77PPqJQ"
script src="/js/analytics.js" type="text/javascript"
link href="/css/screen.css" media="screen, projection" rel="stylesheet" type="text/css"
link href="/css/print.css" media="print" rel="stylesheet" type="text/css"
body.bp
div#container.showgrid
div#header
| the header
div#sidebar
| the left
div#content
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment