Merge branch '2.0.2-wip' of github.com:twitter/bootstrap into 2.0.2-wip

Conflicts:
	docs/assets/bootstrap.zip
This commit is contained in:
Mark Otto 2012-03-10 14:12:29 -08:00
commit f7d4fb61ce
4 changed files with 772 additions and 594 deletions

Binary file not shown.

View File

@ -10,7 +10,8 @@
.clearfix { .clearfix {
*zoom: 1; *zoom: 1;
} }
.clearfix:before, .clearfix:after { .clearfix:before,
.clearfix:after {
display: table; display: table;
content: ""; content: "";
} }
@ -99,10 +100,12 @@
/* CSS3 spec*/ /* CSS3 spec*/
} }
.input-prepend input[class*="span"], .input-append input[class*="span"] { .input-prepend input[class*="span"],
.input-append input[class*="span"] {
width: auto; width: auto;
} }
input[type="checkbox"], input[type="radio"] { input[type="checkbox"],
input[type="radio"] {
border: 1px solid #ccc; border: 1px solid #ccc;
} }
.form-horizontal .control-group > label { .form-horizontal .control-group > label {
@ -158,7 +161,8 @@
.row { .row {
margin-left: 0; margin-left: 0;
} }
.row > [class*="span"], .row-fluid > [class*="span"] { .row > [class*="span"],
.row-fluid > [class*="span"] {
float: none; float: none;
display: block; display: block;
width: auto; width: auto;
@ -170,7 +174,8 @@
margin-left: -20px; margin-left: -20px;
*zoom: 1; *zoom: 1;
} }
.row:before, .row:after { .row:before,
.row:after {
display: table; display: table;
content: ""; content: "";
} }
@ -181,86 +186,89 @@
float: left; float: left;
margin-left: 20px; margin-left: 20px;
} }
.container, .navbar-fixed-top .container, .navbar-fixed-bottom .container { .container,
.navbar-fixed-top .container,
.navbar-fixed-bottom .container {
width: 724px; width: 724px;
} }
.span1 {
width: 42px;
}
.span2 {
width: 104px;
}
.span3 {
width: 166px;
}
.span4 {
width: 228px;
}
.span5 {
width: 290px;
}
.span6 {
width: 352px;
}
.span7 {
width: 414px;
}
.span8 {
width: 476px;
}
.span9 {
width: 538px;
}
.span10 {
width: 600px;
}
.span11 {
width: 662px;
}
.span12 { .span12 {
width: 724px; width: 724px;
} }
.offset1 { .span11 {
margin-left: 82px; width: 662px;
} }
.offset2 { .span10 {
margin-left: 144px; width: 600px;
} }
.offset3 { .span9 {
margin-left: 206px; width: 538px;
} }
.offset4 { .span8 {
margin-left: 268px; width: 476px;
} }
.offset5 { .span7 {
margin-left: 330px; width: 414px;
} }
.offset6 { .span6 {
margin-left: 392px; width: 352px;
} }
.offset7 { .span5 {
margin-left: 454px; width: 290px;
} }
.offset8 { .span4 {
margin-left: 516px; width: 228px;
} }
.offset9 { .span3 {
margin-left: 578px; width: 166px;
} }
.offset10 { .span2 {
margin-left: 640px; width: 104px;
}
.span1 {
width: 42px;
}
.offset12 {
margin-left: 764px;
} }
.offset11 { .offset11 {
margin-left: 702px; margin-left: 702px;
} }
.offset12 { .offset10 {
margin-left: 764px; margin-left: 640px;
}
.offset9 {
margin-left: 578px;
}
.offset8 {
margin-left: 516px;
}
.offset7 {
margin-left: 454px;
}
.offset6 {
margin-left: 392px;
}
.offset5 {
margin-left: 330px;
}
.offset4 {
margin-left: 268px;
}
.offset3 {
margin-left: 206px;
}
.offset2 {
margin-left: 144px;
}
.offset1 {
margin-left: 82px;
} }
.row-fluid { .row-fluid {
width: 100%; width: 100%;
*zoom: 1; *zoom: 1;
} }
.row-fluid:before, .row-fluid:after { .row-fluid:before,
.row-fluid:after {
display: table; display: table;
content: ""; content: "";
} }
@ -274,80 +282,82 @@
.row-fluid > [class*="span"]:first-child { .row-fluid > [class*="span"]:first-child {
margin-left: 0; margin-left: 0;
} }
.row-fluid > .span1 { .row-fluid > .span12 {
width: 5.801104972%; width: 99.999999993%;
}
.row-fluid > .span2 {
width: 14.364640883%;
}
.row-fluid > .span3 {
width: 22.928176794%;
}
.row-fluid > .span4 {
width: 31.491712705%;
}
.row-fluid > .span5 {
width: 40.055248616%;
}
.row-fluid > .span6 {
width: 48.618784527%;
}
.row-fluid > .span7 {
width: 57.182320438000005%;
}
.row-fluid > .span8 {
width: 65.74585634900001%;
}
.row-fluid > .span9 {
width: 74.30939226%;
}
.row-fluid > .span10 {
width: 82.87292817100001%;
} }
.row-fluid > .span11 { .row-fluid > .span11 {
width: 91.436464082%; width: 91.436464082%;
} }
.row-fluid > .span12 { .row-fluid > .span10 {
width: 99.999999993%; width: 82.87292817100001%;
} }
input, textarea, .uneditable-input { .row-fluid > .span9 {
width: 74.30939226%;
}
.row-fluid > .span8 {
width: 65.74585634900001%;
}
.row-fluid > .span7 {
width: 57.182320438000005%;
}
.row-fluid > .span6 {
width: 48.618784527%;
}
.row-fluid > .span5 {
width: 40.055248616%;
}
.row-fluid > .span4 {
width: 31.491712705%;
}
.row-fluid > .span3 {
width: 22.928176794%;
}
.row-fluid > .span2 {
width: 14.364640883%;
}
.row-fluid > .span1 {
width: 5.801104972%;
}
input,
textarea,
.uneditable-input {
margin-left: 0; margin-left: 0;
} }
input.span1, textarea.span1, .uneditable-input.span1 { input.span12, textarea.span12, .uneditable-input.span12 {
width: 32px; width: 714px;
}
input.span2, textarea.span2, .uneditable-input.span2 {
width: 94px;
}
input.span3, textarea.span3, .uneditable-input.span3 {
width: 156px;
}
input.span4, textarea.span4, .uneditable-input.span4 {
width: 218px;
}
input.span5, textarea.span5, .uneditable-input.span5 {
width: 280px;
}
input.span6, textarea.span6, .uneditable-input.span6 {
width: 342px;
}
input.span7, textarea.span7, .uneditable-input.span7 {
width: 404px;
}
input.span8, textarea.span8, .uneditable-input.span8 {
width: 466px;
}
input.span9, textarea.span9, .uneditable-input.span9 {
width: 528px;
}
input.span10, textarea.span10, .uneditable-input.span10 {
width: 590px;
} }
input.span11, textarea.span11, .uneditable-input.span11 { input.span11, textarea.span11, .uneditable-input.span11 {
width: 652px; width: 652px;
} }
input.span12, textarea.span12, .uneditable-input.span12 { input.span10, textarea.span10, .uneditable-input.span10 {
width: 714px; width: 590px;
}
input.span9, textarea.span9, .uneditable-input.span9 {
width: 528px;
}
input.span8, textarea.span8, .uneditable-input.span8 {
width: 466px;
}
input.span7, textarea.span7, .uneditable-input.span7 {
width: 404px;
}
input.span6, textarea.span6, .uneditable-input.span6 {
width: 342px;
}
input.span5, textarea.span5, .uneditable-input.span5 {
width: 280px;
}
input.span4, textarea.span4, .uneditable-input.span4 {
width: 218px;
}
input.span3, textarea.span3, .uneditable-input.span3 {
width: 156px;
}
input.span2, textarea.span2, .uneditable-input.span2 {
width: 94px;
}
input.span1, textarea.span1, .uneditable-input.span1 {
width: 32px;
} }
} }
@media (max-width: 979px) { @media (max-width: 979px) {
@ -390,7 +400,8 @@
color: #999999; color: #999999;
text-shadow: none; text-shadow: none;
} }
.navbar .nav > li > a, .navbar .dropdown-menu a { .navbar .nav > li > a,
.navbar .dropdown-menu a {
padding: 6px 15px; padding: 6px 15px;
font-weight: bold; font-weight: bold;
color: #999999; color: #999999;
@ -401,7 +412,8 @@
.navbar .dropdown-menu li + li a { .navbar .dropdown-menu li + li a {
margin-bottom: 2px; margin-bottom: 2px;
} }
.navbar .nav > li > a:hover, .navbar .dropdown-menu a:hover { .navbar .nav > li > a:hover,
.navbar .dropdown-menu a:hover {
background-color: #222222; background-color: #222222;
} }
.navbar .dropdown-menu { .navbar .dropdown-menu {
@ -422,13 +434,15 @@
-moz-box-shadow: none; -moz-box-shadow: none;
box-shadow: none; box-shadow: none;
} }
.navbar .dropdown-menu:before, .navbar .dropdown-menu:after { .navbar .dropdown-menu:before,
.navbar .dropdown-menu:after {
display: none; display: none;
} }
.navbar .dropdown-menu .divider { .navbar .dropdown-menu .divider {
display: none; display: none;
} }
.navbar-form, .navbar-search { .navbar-form,
.navbar-search {
float: none; float: none;
padding: 9px 15px; padding: 9px 15px;
margin: 9px 0; margin: 9px 0;
@ -465,7 +479,8 @@
margin-left: -30px; margin-left: -30px;
*zoom: 1; *zoom: 1;
} }
.row:before, .row:after { .row:before,
.row:after {
display: table; display: table;
content: ""; content: "";
} }
@ -476,86 +491,89 @@
float: left; float: left;
margin-left: 30px; margin-left: 30px;
} }
.container, .navbar-fixed-top .container, .navbar-fixed-bottom .container { .container,
.navbar-fixed-top .container,
.navbar-fixed-bottom .container {
width: 1170px; width: 1170px;
} }
.span1 {
width: 70px;
}
.span2 {
width: 170px;
}
.span3 {
width: 270px;
}
.span4 {
width: 370px;
}
.span5 {
width: 470px;
}
.span6 {
width: 570px;
}
.span7 {
width: 670px;
}
.span8 {
width: 770px;
}
.span9 {
width: 870px;
}
.span10 {
width: 970px;
}
.span11 {
width: 1070px;
}
.span12 { .span12 {
width: 1170px; width: 1170px;
} }
.offset1 { .span11 {
margin-left: 130px; width: 1070px;
} }
.offset2 { .span10 {
margin-left: 230px; width: 970px;
} }
.offset3 { .span9 {
margin-left: 330px; width: 870px;
} }
.offset4 { .span8 {
margin-left: 430px; width: 770px;
} }
.offset5 { .span7 {
margin-left: 530px; width: 670px;
} }
.offset6 { .span6 {
margin-left: 630px; width: 570px;
} }
.offset7 { .span5 {
margin-left: 730px; width: 470px;
} }
.offset8 { .span4 {
margin-left: 830px; width: 370px;
} }
.offset9 { .span3 {
margin-left: 930px; width: 270px;
} }
.offset10 { .span2 {
margin-left: 1030px; width: 170px;
}
.span1 {
width: 70px;
}
.offset12 {
margin-left: 1230px;
} }
.offset11 { .offset11 {
margin-left: 1130px; margin-left: 1130px;
} }
.offset12 { .offset10 {
margin-left: 1230px; margin-left: 1030px;
}
.offset9 {
margin-left: 930px;
}
.offset8 {
margin-left: 830px;
}
.offset7 {
margin-left: 730px;
}
.offset6 {
margin-left: 630px;
}
.offset5 {
margin-left: 530px;
}
.offset4 {
margin-left: 430px;
}
.offset3 {
margin-left: 330px;
}
.offset2 {
margin-left: 230px;
}
.offset1 {
margin-left: 130px;
} }
.row-fluid { .row-fluid {
width: 100%; width: 100%;
*zoom: 1; *zoom: 1;
} }
.row-fluid:before, .row-fluid:after { .row-fluid:before,
.row-fluid:after {
display: table; display: table;
content: ""; content: "";
} }
@ -569,80 +587,82 @@
.row-fluid > [class*="span"]:first-child { .row-fluid > [class*="span"]:first-child {
margin-left: 0; margin-left: 0;
} }
.row-fluid > .span1 { .row-fluid > .span12 {
width: 5.982905983%; width: 100%;
}
.row-fluid > .span2 {
width: 14.529914530000001%;
}
.row-fluid > .span3 {
width: 23.076923077%;
}
.row-fluid > .span4 {
width: 31.623931624%;
}
.row-fluid > .span5 {
width: 40.170940171000005%;
}
.row-fluid > .span6 {
width: 48.717948718%;
}
.row-fluid > .span7 {
width: 57.264957265%;
}
.row-fluid > .span8 {
width: 65.81196581200001%;
}
.row-fluid > .span9 {
width: 74.358974359%;
}
.row-fluid > .span10 {
width: 82.905982906%;
} }
.row-fluid > .span11 { .row-fluid > .span11 {
width: 91.45299145300001%; width: 91.45299145300001%;
} }
.row-fluid > .span12 { .row-fluid > .span10 {
width: 100%; width: 82.905982906%;
} }
input, textarea, .uneditable-input { .row-fluid > .span9 {
width: 74.358974359%;
}
.row-fluid > .span8 {
width: 65.81196581200001%;
}
.row-fluid > .span7 {
width: 57.264957265%;
}
.row-fluid > .span6 {
width: 48.717948718%;
}
.row-fluid > .span5 {
width: 40.170940171000005%;
}
.row-fluid > .span4 {
width: 31.623931624%;
}
.row-fluid > .span3 {
width: 23.076923077%;
}
.row-fluid > .span2 {
width: 14.529914530000001%;
}
.row-fluid > .span1 {
width: 5.982905983%;
}
input,
textarea,
.uneditable-input {
margin-left: 0; margin-left: 0;
} }
input.span1, textarea.span1, .uneditable-input.span1 { input.span12, textarea.span12, .uneditable-input.span12 {
width: 60px; width: 1160px;
}
input.span2, textarea.span2, .uneditable-input.span2 {
width: 160px;
}
input.span3, textarea.span3, .uneditable-input.span3 {
width: 260px;
}
input.span4, textarea.span4, .uneditable-input.span4 {
width: 360px;
}
input.span5, textarea.span5, .uneditable-input.span5 {
width: 460px;
}
input.span6, textarea.span6, .uneditable-input.span6 {
width: 560px;
}
input.span7, textarea.span7, .uneditable-input.span7 {
width: 660px;
}
input.span8, textarea.span8, .uneditable-input.span8 {
width: 760px;
}
input.span9, textarea.span9, .uneditable-input.span9 {
width: 860px;
}
input.span10, textarea.span10, .uneditable-input.span10 {
width: 960px;
} }
input.span11, textarea.span11, .uneditable-input.span11 { input.span11, textarea.span11, .uneditable-input.span11 {
width: 1060px; width: 1060px;
} }
input.span12, textarea.span12, .uneditable-input.span12 { input.span10, textarea.span10, .uneditable-input.span10 {
width: 1160px; width: 960px;
}
input.span9, textarea.span9, .uneditable-input.span9 {
width: 860px;
}
input.span8, textarea.span8, .uneditable-input.span8 {
width: 760px;
}
input.span7, textarea.span7, .uneditable-input.span7 {
width: 660px;
}
input.span6, textarea.span6, .uneditable-input.span6 {
width: 560px;
}
input.span5, textarea.span5, .uneditable-input.span5 {
width: 460px;
}
input.span4, textarea.span4, .uneditable-input.span4 {
width: 360px;
}
input.span3, textarea.span3, .uneditable-input.span3 {
width: 260px;
}
input.span2, textarea.span2, .uneditable-input.span2 {
width: 160px;
}
input.span1, textarea.span1, .uneditable-input.span1 {
width: 60px;
} }
.thumbnails { .thumbnails {
margin-left: -30px; margin-left: -30px;

File diff suppressed because it is too large Load Diff

View File

@ -283,7 +283,7 @@
// Opacity // Opacity
.opacity(@opacity: 100) { .opacity(@opacity: 100) {
opacity: @opacity / 100; opacity: @opacity / 100;
filter: e(%("alpha(opacity=%d)", @opacity)); filter: ~"alpha(opacity=@{opacity})";
} }
@ -320,7 +320,7 @@
background-image: -o-linear-gradient(left, @startColor, @endColor); // Opera 11.10 background-image: -o-linear-gradient(left, @startColor, @endColor); // Opera 11.10
background-image: linear-gradient(left, @startColor, @endColor); // Le standard background-image: linear-gradient(left, @startColor, @endColor); // Le standard
background-repeat: repeat-x; background-repeat: repeat-x;
filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)",@startColor,@endColor)); // IE9 and down filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=@startColor, endColorstr=@endColor, GradientType=1); // IE9 and down
} }
.vertical(@startColor: #555, @endColor: #333) { .vertical(@startColor: #555, @endColor: #333) {
background-color: mix(@startColor, @endColor, 60%); background-color: mix(@startColor, @endColor, 60%);
@ -331,7 +331,7 @@
background-image: -o-linear-gradient(top, @startColor, @endColor); // Opera 11.10 background-image: -o-linear-gradient(top, @startColor, @endColor); // Opera 11.10
background-image: linear-gradient(top, @startColor, @endColor); // The standard background-image: linear-gradient(top, @startColor, @endColor); // The standard
background-repeat: repeat-x; background-repeat: repeat-x;
filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",@startColor,@endColor)); // IE9 and down filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=@startColor, endColorstr=@endColor, GradientType=0); // IE9 and down
} }
.directional(@startColor: #555, @endColor: #333, @deg: 45deg) { .directional(@startColor: #555, @endColor: #333, @deg: 45deg) {
background-color: @endColor; background-color: @endColor;
@ -351,7 +351,7 @@
background-image: -o-linear-gradient(@startColor, @midColor @colorStop, @endColor); background-image: -o-linear-gradient(@startColor, @midColor @colorStop, @endColor);
background-image: linear-gradient(@startColor, @midColor @colorStop, @endColor); background-image: linear-gradient(@startColor, @midColor @colorStop, @endColor);
background-repeat: no-repeat; background-repeat: no-repeat;
filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",@startColor,@endColor)); // IE9 and down, gets no color-stop at all for proper fallback filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=@startColor, endColorstr=@endColor, GradientType=0); // IE9 and down, gets no color-stop at all for proper fallback
} }
.radial(@innerColor: #555, @outerColor: #333) { .radial(@innerColor: #555, @outerColor: #333) {
background-color: @outerColor; background-color: @outerColor;
@ -374,7 +374,7 @@
} }
// Reset filters for IE // Reset filters for IE
.reset-filter() { .reset-filter() {
filter: e(%("progid:DXImageTransform.Microsoft.gradient(enabled = false)")); filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
} }
@ -484,14 +484,26 @@
.core (@gridColumnWidth, @gridGutterWidth) { .core (@gridColumnWidth, @gridGutterWidth) {
.span (@columns) { .spanX (@index) when (@index > 0) {
width: (@gridColumnWidth * @columns) + (@gridGutterWidth * (@columns - 1)); (~".span@{index}") { .span(@index); }
.spanX(@index - 1);
} }
.spanX (0) {}
.offsetX (@index) when (@index > 0) {
(~".offset@{index}") { .offset(@index); }
.offsetX(@index - 1);
}
.offsetX (0) {}
.offset (@columns) { .offset (@columns) {
margin-left: (@gridColumnWidth * @columns) + (@gridGutterWidth * (@columns - 1)) + (@gridGutterWidth * 2); margin-left: (@gridColumnWidth * @columns) + (@gridGutterWidth * (@columns - 1)) + (@gridGutterWidth * 2);
} }
.span (@columns) {
width: (@gridColumnWidth * @columns) + (@gridGutterWidth * (@columns - 1));
}
.row { .row {
margin-left: @gridGutterWidth * -1; margin-left: @gridGutterWidth * -1;
.clearfix(); .clearfix();
@ -505,38 +517,22 @@
// Set the container width, and override it for fixed navbars in media queries // Set the container width, and override it for fixed navbars in media queries
.container, .container,
.navbar-fixed-top .container, .navbar-fixed-top .container,
.navbar-fixed-bottom .container { .span(12); } .navbar-fixed-bottom .container { .span(@gridColumns); }
.span1 { .span(1); } // generate .spanX and .offsetX
.span2 { .span(2); } .spanX (@gridColumns);
.span3 { .span(3); } .offsetX (@gridColumns);
.span4 { .span(4); }
.span5 { .span(5); }
.span6 { .span(6); }
.span7 { .span(7); }
.span8 { .span(8); }
.span9 { .span(9); }
.span10 { .span(10); }
.span11 { .span(11); }
.span12 { .span(12); }
.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); }
.offset12 { .offset(12); }
} }
.fluid (@fluidGridColumnWidth, @fluidGridGutterWidth) { .fluid (@fluidGridColumnWidth, @fluidGridGutterWidth) {
.spanX (@index) when (@index > 0) {
(~"> .span@{index}") { .span(@index); }
.spanX(@index - 1);
}
.spanX (0) {}
.span (@columns) { .span (@columns) {
width: 1% * (@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1)); width: 1% * (@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1));
} }
@ -551,24 +547,21 @@
> [class*="span"]:first-child { > [class*="span"]:first-child {
margin-left: 0; margin-left: 0;
} }
> .span1 { .span(1); }
> .span2 { .span(2); } // generate .spanX
> .span3 { .span(3); } .spanX (@gridColumns);
> .span4 { .span(4); }
> .span5 { .span(5); }
> .span6 { .span(6); }
> .span7 { .span(7); }
> .span8 { .span(8); }
> .span9 { .span(9); }
> .span10 { .span(10); }
> .span11 { .span(11); }
> .span12 { .span(12); }
} }
} }
.input(@gridColumnWidth, @gridGutterWidth) { .input(@gridColumnWidth, @gridGutterWidth) {
.spanX (@index) when (@index > 0) {
(~"input.span@{index}, textarea.span@{index}, .uneditable-input.span@{index}") { .span(@index); }
.spanX(@index - 1);
}
.spanX (0) {}
.span(@columns) { .span(@columns) {
width: ((@gridColumnWidth) * @columns) + (@gridGutterWidth * (@columns - 1)) - 10; width: ((@gridColumnWidth) * @columns) + (@gridGutterWidth * (@columns - 1)) - 10;
} }
@ -577,20 +570,11 @@
textarea, textarea,
.uneditable-input { .uneditable-input {
margin-left: 0; // override margin-left from core grid system margin-left: 0; // override margin-left from core grid system
&.span1 { .span(1); }
&.span2 { .span(2); }
&.span3 { .span(3); }
&.span4 { .span(4); }
&.span5 { .span(5); }
&.span6 { .span(6); }
&.span7 { .span(7); }
&.span8 { .span(8); }
&.span9 { .span(9); }
&.span10 { .span(10); }
&.span11 { .span(11); }
&.span12 { .span(12); }
} }
// generate .spanX
.spanX (@gridColumns);
} }
} }