break scaffolding down into smaller less files

diff --git a/bootstrap.css b/bootstrap.css
index 8db6a82e63a503ccac061df89fa7b36fb7de59f8..6970487e01a7c71fe65bd82c964192adaee61a18 100644 (file)
--- a/bootstrap.css
+++ b/bootstrap.css
@@ -6,7 +6,7 @@
  * http://www.apache.org/licenses/LICENSE-2.0
  *
  * Designed and built with all the love in the world @twitter by @mdo and @fat.
- * Date: Thu Jan 26 13:56:25 PST 2012
+ * Date: Thu Jan 26 14:50:34 PST 2012
  */
 article,
 aside,
@@ -102,55 +102,6 @@ body {
   color: #555555;
   background-color: #ffffff;
 }
-.container {
-  width: 940px;
-  margin-left: auto;
-  margin-right: auto;
-  *zoom: 1;
-}
-.container:before, .container:after {
-  display: table;
-  content: "";
-}
-.container:after {
-  clear: both;
-}
-.fluid-container {
-  position: relative;
-  min-width: 940px;
-  padding-left: 20px;
-  padding-right: 20px;
-  *zoom: 1;
-}
-.fluid-container:before, .fluid-container:after {
-  display: table;
-  content: "";
-}
-.fluid-container:after {
-  clear: both;
-}
-.fluid-sidebar {
-  width: 220px;
-  margin: 0 20px 18px;
-}
-.sidebar-left {
-  padding-left: 260px;
-}
-.sidebar-right {
-  padding-right: 260px;
-}
-.sidebar-left .fluid-sidebar {
-  float: left;
-  margin-left: -240px;
-}
-.sidebar-right .fluid-sidebar {
-  float: right;
-  margin-right: -240px;
-}
-.fluid-content {
-  float: left;
-  width: 100%;
-}
 a {
   color: #0088cc;
   text-decoration: none;
@@ -243,6 +194,55 @@ a:hover {
 .offset11 {
   margin-left: 900px;
 }
+.container {
+  width: 940px;
+  margin-left: auto;
+  margin-right: auto;
+  *zoom: 1;
+}
+.container:before, .container:after {
+  display: table;
+  content: "";
+}
+.container:after {
+  clear: both;
+}
+.fluid-container {
+  position: relative;
+  min-width: 940px;
+  padding-left: 20px;
+  padding-right: 20px;
+  *zoom: 1;
+}
+.fluid-container:before, .fluid-container:after {
+  display: table;
+  content: "";
+}
+.fluid-container:after {
+  clear: both;
+}
+.fluid-sidebar {
+  width: 220px;
+  margin: 0 20px 18px;
+}
+.sidebar-left {
+  padding-left: 260px;
+}
+.sidebar-right {
+  padding-right: 260px;
+}
+.sidebar-left .fluid-sidebar {
+  float: left;
+  margin-left: -240px;
+}
+.sidebar-right .fluid-sidebar {
+  float: right;
+  margin-right: -240px;
+}
+.fluid-content {
+  float: left;
+  width: 100%;
+}
 p {
   margin: 0 0 9px;
   font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;

diff --git a/bootstrap.min.css b/bootstrap.min.css
index 191784b436bd5419bb956442911e22f8d6c6766a..dc158adcf48b5d545cf2c4dbf193bf47e8bb1975 100644 (file)
--- a/bootstrap.min.css
+++ b/bootstrap.min.css
@@ -16,16 +16,6 @@ input[type="search"]{-webkit-appearance:textfield;-webkit-box-sizing:content-box
 input[type="search"]::-webkit-search-decoration,input[type="search"]::-webkit-search-cancel-button{-webkit-appearance:none;}
 textarea{overflow:auto;vertical-align:top;}
 body{margin:0;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:13px;line-height:18px;color:#555555;background-color:#ffffff;}
-.container{width:940px;margin-left:auto;margin-right:auto;*zoom:1;}.container:before,.container:after{display:table;content:"";}
-.container:after{clear:both;}
-.fluid-container{position:relative;min-width:940px;padding-left:20px;padding-right:20px;*zoom:1;}.fluid-container:before,.fluid-container:after{display:table;content:"";}
-.fluid-container:after{clear:both;}
-.fluid-sidebar{width:220px;margin:0 20px 18px;}
-.sidebar-left{padding-left:260px;}
-.sidebar-right{padding-right:260px;}
-.sidebar-left .fluid-sidebar{float:left;margin-left:-240px;}
-.sidebar-right .fluid-sidebar{float:right;margin-right:-240px;}
-.fluid-content{float:left;width:100%;}
 a{color:#0088cc;text-decoration:none;}a:hover{color:#005580;text-decoration:underline;}
 .row{margin-left:-20px;*zoom:1;}.row:before,.row:after{display:table;content:"";}
 .row:after{clear:both;}
@@ -53,6 +43,16 @@ a{color:#0088cc;text-decoration:none;}a:hover{color:#005580;text-decoration:unde
 .offset9{margin-left:740px;}
 .offset10{margin-left:820px;}
 .offset11{margin-left:900px;}
+.container{width:940px;margin-left:auto;margin-right:auto;*zoom:1;}.container:before,.container:after{display:table;content:"";}
+.container:after{clear:both;}
+.fluid-container{position:relative;min-width:940px;padding-left:20px;padding-right:20px;*zoom:1;}.fluid-container:before,.fluid-container:after{display:table;content:"";}
+.fluid-container:after{clear:both;}
+.fluid-sidebar{width:220px;margin:0 20px 18px;}
+.sidebar-left{padding-left:260px;}
+.sidebar-right{padding-right:260px;}
+.sidebar-left .fluid-sidebar{float:left;margin-left:-240px;}
+.sidebar-right .fluid-sidebar{float:right;margin-right:-240px;}
+.fluid-content{float:left;width:100%;}
 p{margin:0 0 9px;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:13px;line-height:18px;}p small{font-size:11px;color:#999999;}
 .lead{margin-bottom:18px;font-size:20px;font-weight:200;line-height:27px;}
 h1,h2,h3,h4,h5,h6{margin:0;font-weight:bold;color:#333333;text-rendering:optimizelegibility;}h1 small,h2 small,h3 small,h4 small,h5 small,h6 small{font-weight:normal;color:#999999;}

diff --git a/lib/bootstrap.less b/lib/bootstrap.less
index 8d307d427183608a2a8735c69a69bb097c0a379c..40ebd7f2f8e0b63387d6d7562724a3988274106c 100644 (file)
--- a/lib/bootstrap.less
+++ b/lib/bootstrap.less
@@ -18,6 +18,8 @@
 
 // Grid system and page structure
 @import "scaffolding.less";
+@import "grid.less";
+@import "layouts.less";
 
 // Base CSS
 @import "type.less";

diff --git a/lib/grid.less b/lib/grid.less
new file mode 100644 (file)
index 0000000..d5b5f48
--- /dev/null
+++ b/lib/grid.less
@@ -0,0 +1,41 @@
+// GRID SYSTEM
+// -----------
+// To customize the grid system, bring up the variables.less file and change the column count, size, and gutter there
+.row {
+  margin-left: @gridGutterWidth * -1;
+  .clearfix();
+}
+
+// Find all .span# classes within .row and give them the necessary properties for grid columns 
+// (supported by all browsers back to IE7)
+// Credit to @dhg for the idea
+[class*="span"] {
+  .gridColumn();
+}
+
+// Default columns
+.span1     { .columns(1); }
+.span2     { .columns(2); }
+.span3     { .columns(3); }
+.span4     { .columns(4); }
+.span5     { .columns(5); }
+.span6     { .columns(6); }
+.span7     { .columns(7); }
+.span8     { .columns(8); }
+.span9     { .columns(9); }
+.span10    { .columns(10); }
+.span11    { .columns(11); }
+.span12    { .columns(12); }
+
+// Offset column options
+.offset1   { .offset(1); }
+.offset2   { .offset(2); }
+.offset3   { .offset(3); }
+.offset4   { .offset(4); }
+.offset5   { .offset(5); }
+.offset6   { .offset(6); }
+.offset7   { .offset(7); }
+.offset8   { .offset(8); }
+.offset9   { .offset(9); }
+.offset10  { .offset(10); }
+.offset11  { .offset(11); }

diff --git a/lib/layouts.less b/lib/layouts.less
new file mode 100644 (file)
index 0000000..14435c9
--- /dev/null
+++ b/lib/layouts.less
@@ -0,0 +1,43 @@
+//
+// Layouts
+// Fixed-width and fluid (with sidebar) layouts
+// --------------------------------------------
+
+
+// Container (centered, fixed-width layouts)
+.container {
+  .container-fixed();
+}
+
+// Fluid layouts (left aligned, with sidebar, min- & max-width content)
+.fluid-container {
+  position: relative;
+  min-width: @siteWidth;
+  padding-left: @gridGutterWidth;
+  padding-right: @gridGutterWidth;
+  .clearfix();
+}
+
+// Sidebars (left and right options)
+.fluid-sidebar {
+  width: @fluidSidebarWidth;
+  margin: 0 20px 18px;
+}
+.sidebar-left   { padding-left: @fluidSidebarWidth + @gridGutterWidth * 2; }
+.sidebar-right  { padding-right: @fluidSidebarWidth + @gridGutterWidth * 2; }
+
+// Float the sidebars accordingly
+.sidebar-left .fluid-sidebar {
+  float: left;
+  margin-left: (@fluidSidebarWidth + @gridGutterWidth) * -1;
+}
+.sidebar-right .fluid-sidebar {
+  float: right;
+  margin-right: (@fluidSidebarWidth + @gridGutterWidth) * -1;
+}
+
+// The main content area
+.fluid-content {
+  float: left;
+  width: 100%;
+}

diff --git a/lib/scaffolding.less b/lib/scaffolding.less
index 7002b04083ff1e00a776429513ec06e9657cd65a..3eced0ef0978a39875a7c2dfb8a62c6e6057bc97 100644 (file)
--- a/lib/scaffolding.less
+++ b/lib/scaffolding.less
@@ -16,49 +16,10 @@ body {
   background-color: @white;
 }
 
-// Container (centered, fixed-width layouts)
-.container {
-  .container-fixed();
-}
-
-// Fluid layouts (left aligned, with sidebar, min- & max-width content)
-.fluid-container {
-  position: relative;
-  min-width: @siteWidth;
-  padding-left: @gridGutterWidth;
-  padding-right: @gridGutterWidth;
-  .clearfix();
-}
-
-// Sidebars (left and right options)
-.fluid-sidebar {
-  width: @fluidSidebarWidth;
-  margin: 0 20px 18px;
-}
-.sidebar-left   { padding-left: @fluidSidebarWidth + @gridGutterWidth * 2; }
-.sidebar-right  { padding-right: @fluidSidebarWidth + @gridGutterWidth * 2; }
-
-// Float the sidebars accordingly
-.sidebar-left .fluid-sidebar {
-  float: left;
-  margin-left: (@fluidSidebarWidth + @gridGutterWidth) * -1;
-}
-.sidebar-right .fluid-sidebar {
-  float: right;
-  margin-right: (@fluidSidebarWidth + @gridGutterWidth) * -1;
-}
-
-// The main content area
-.fluid-content {
-  float: left;
-  width: 100%;
-}
-
 
-// BASE STYLES
-// -----------
+// LINKS
+// -----
 
-// Links
 a {
   color: @linkColor;
   text-decoration: none;
@@ -67,46 +28,3 @@ a {
     text-decoration: underline;
   }
 }
-
-
-// GRID SYSTEM
-// -----------
-// To customize the grid system, bring up the variables.less file and change the column count, size, and gutter there
-.row {
-  margin-left: @gridGutterWidth * -1;
-  .clearfix();
-}
-
-// Find all .span# classes within .row and give them the necessary properties for grid columns 
-// (supported by all browsers back to IE7)
-// Credit to @dhg for the idea
-[class*="span"] {
-  .gridColumn();
-}
-
-// Default columns
-.span1     { .columns(1); }
-.span2     { .columns(2); }
-.span3     { .columns(3); }
-.span4     { .columns(4); }
-.span5     { .columns(5); }
-.span6     { .columns(6); }
-.span7     { .columns(7); }
-.span8     { .columns(8); }
-.span9     { .columns(9); }
-.span10    { .columns(10); }
-.span11    { .columns(11); }
-.span12    { .columns(12); }
-
-// Offset column options
-.offset1   { .offset(1); }
-.offset2   { .offset(2); }
-.offset3   { .offset(3); }
-.offset4   { .offset(4); }
-.offset5   { .offset(5); }
-.offset6   { .offset(6); }
-.offset7   { .offset(7); }
-.offset8   { .offset(8); }
-.offset9   { .offset(9); }
-.offset10  { .offset(10); }
-.offset11  { .offset(11); }