diff --git a/bootstrap.css b/bootstrap.css
index 8b487fb7e3302b2f25865164b500fedd66c2cae2..dffa6a8249f40c55d4d5fdb1561fdbfa902f7c5a 100644
--- 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: Sun Oct 16 03:14:23 PDT 2011
+ * Date: Sun Oct 16 11:34:52 PDT 2011
*/
/* Reset.less
* Props to Eric Meyer (meyerweb.com) for his CSS reset file. We're using an adapted version here that cuts out some of the reset HTML elements we will never need here (i.e., dfn, samp, etc).
@@ -388,13 +388,13 @@ h1 small {
}
h2 {
font-size: 24px;
- line-height: 36px;
+ line-height: 27px;
}
h2 small {
font-size: 14px;
}
h3 {
- line-height: 36px;
+ line-height: 27px;
font-size: 18px;
}
h3 small {
@@ -2269,6 +2269,26 @@ button.btn::-moz-focus-inner, input[type=submit].btn::-moz-focus-inner {
float: none;
display: block;
width: auto;
+ margin: 0;
+ }
+ .modal {
+ width: auto;
+ margin: 0;
+ }
+ .form-horizontal .control-group > label {
+ float: none;
+ width: auto;
+ padding-top: 0;
+ text-align: left;
+ }
+ .form-horizontal .controls {
+ margin-left: 0;
+ }
+ .form-horizontal .control-list {
+ padding-top: 0;
+ }
+ .form-horizontal .form-actions {
+ padding-left: 0;
}
}
@media (min-width: 480px) and (max-width: 768px) {
@@ -2288,76 +2308,76 @@ button.btn::-moz-focus-inner, input[type=submit].btn::-moz-focus-inner {
width: 748px;
}
.span1 {
- width: 28px;
+ width: 44px;
}
.span2 {
- width: 76px;
+ width: 108px;
}
.span3 {
- width: 124px;
+ width: 172px;
}
.span4 {
- width: 172px;
+ width: 236px;
}
.span5 {
- width: 220px;
+ width: 300px;
}
.span6 {
- width: 268px;
+ width: 364px;
}
.span7 {
- width: 316px;
+ width: 428px;
}
.span8 {
- width: 364px;
+ width: 492px;
}
.span9 {
- width: 412px;
+ width: 556px;
}
.span10 {
- width: 460px;
+ width: 620px;
}
.span11 {
- width: 508px;
+ width: 684px;
}
.span12 {
- width: 556px;
+ width: 748px;
}
.offset1 {
- margin-left: 68px;
+ margin-left: 64px;
}
.offset2 {
- margin-left: 116px;
+ margin-left: 128px;
}
.offset3 {
- margin-left: 164px;
+ margin-left: 192px;
}
.offset4 {
- margin-left: 212px;
+ margin-left: 256px;
}
.offset5 {
- margin-left: 260px;
+ margin-left: 320px;
}
.offset6 {
- margin-left: 308px;
+ margin-left: 384px;
}
.offset7 {
- margin-left: 356px;
+ margin-left: 448px;
}
.offset8 {
- margin-left: 404px;
+ margin-left: 512px;
}
.offset9 {
- margin-left: 452px;
+ margin-left: 576px;
}
.offset10 {
- margin-left: 500px;
+ margin-left: 640px;
}
.offset11 {
- margin-left: 548px;
+ margin-left: 704px;
}
.offset12 {
- margin-left: 596px;
+ margin-left: 768px;
}
}
@media (min-width: 1170px) {
diff --git a/bootstrap.min.css b/bootstrap.min.css
index cfec72ec12b765a8185c2a975d88b434e2bf9b50..a6ef9baf5379bfc9c58b299397f5073310f48d21 100644
--- a/bootstrap.min.css
+++ b/bootstrap.min.css
@@ -66,8 +66,8 @@ a{color:#0069d6;text-decoration:none;line-height:inherit;font-weight:inherit;}a:
p{font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:13px;line-height:18px;margin-bottom:9px;}p small{font-size:11px;color:#bfbfbf;}
h1,h2,h3,h4,h5,h6{font-weight:bold;color:#404040;}h1 small,h2 small,h3 small,h4 small,h5 small,h6 small{color:#bfbfbf;}
h1{margin-bottom:18px;font-size:30px;line-height:36px;}h1 small{font-size:18px;}
-h2{font-size:24px;line-height:36px;}h2 small{font-size:14px;}
-h3{line-height:36px;font-size:18px;}h3 small{font-size:14px;}
+h2{font-size:24px;line-height:27px;}h2 small{font-size:14px;}
+h3{line-height:27px;font-size:18px;}h3 small{font-size:14px;}
h4{font-size:16px;line-height:36px;}h4 small{font-size:12px;}
h5{font-size:14px;line-height:18px;}
h6{font-size:13px;line-height:18px;color:#bfbfbf;text-transform:uppercase;}
@@ -322,4 +322,4 @@ button.btn::-moz-focus-inner,input[type=submit].btn::-moz-focus-inner{padding:0;
.media-grid li{display:inline;}
.media-grid a{float:left;padding:4px;margin:0 0 20px 20px;border:1px solid #ddd;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;-webkit-box-shadow:0 1px 1px rgba(0, 0, 0, 0.075);-moz-box-shadow:0 1px 1px rgba(0, 0, 0, 0.075);box-shadow:0 1px 1px rgba(0, 0, 0, 0.075);}.media-grid a img{display:block;}
.media-grid a:hover{border-color:#0069d6;-webkit-box-shadow:0 1px 4px rgba(0, 105, 214, 0.25);-moz-box-shadow:0 1px 4px rgba(0, 105, 214, 0.25);box-shadow:0 1px 4px rgba(0, 105, 214, 0.25);}
-@media (max-width: 480px){.container{width:auto;padding:0 10px;} [class*="span"]{float:none;display:block;width:auto;}}@media (min-width: 480px) and (max-width: 768px){.container{width:auto;padding:0 10px;} [class*="span"]{float:none;display:block;width:auto;margin:0;}}@media (min-width: 768px) and (max-width: 940px){.container{width:748px;} .span1{width:28px;} .span2{width:76px;} .span3{width:124px;} .span4{width:172px;} .span5{width:220px;} .span6{width:268px;} .span7{width:316px;} .span8{width:364px;} .span9{width:412px;} .span10{width:460px;} .span11{width:508px;} .span12{width:556px;} .offset1{margin-left:68px;} .offset2{margin-left:116px;} .offset3{margin-left:164px;} .offset4{margin-left:212px;} .offset5{margin-left:260px;} .offset6{margin-left:308px;} .offset7{margin-left:356px;} .offset8{margin-left:404px;} .offset9{margin-left:452px;} .offset10{margin-left:500px;} .offset11{margin-left:548px;} .offset12{margin-left:596px;}}@media (min-width: 1170px){.container{width:1170px;} [class*="span"]{margin-left:30px;} .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{width:1170px;} .offset1{margin-left:100px;} .offset2{margin-left:200px;} .offset3{margin-left:300px;} .offset4{margin-left:400px;} .offset5{margin-left:500px;} .offset6{margin-left:600px;} .offset7{margin-left:700px;} .offset8{margin-left:800px;} .offset9{margin-left:900px;} .offset10{margin-left:1000px;} .offset11{margin-left:1100px;} .offset12{margin-left:1200px;}}
+@media (max-width: 480px){.container{width:auto;padding:0 10px;} [class*="span"]{float:none;display:block;width:auto;margin:0;} .modal{width:auto;margin:0;} .form-horizontal .control-group>label{float:none;width:auto;padding-top:0;text-align:left;} .form-horizontal .controls{margin-left:0;} .form-horizontal .control-list{padding-top:0;} .form-horizontal .form-actions{padding-left:0;}}@media (min-width: 480px) and (max-width: 768px){.container{width:auto;padding:0 10px;} [class*="span"]{float:none;display:block;width:auto;margin:0;}}@media (min-width: 768px) and (max-width: 940px){.container{width:748px;} .span1{width:44px;} .span2{width:108px;} .span3{width:172px;} .span4{width:236px;} .span5{width:300px;} .span6{width:364px;} .span7{width:428px;} .span8{width:492px;} .span9{width:556px;} .span10{width:620px;} .span11{width:684px;} .span12{width:748px;} .offset1{margin-left:64px;} .offset2{margin-left:128px;} .offset3{margin-left:192px;} .offset4{margin-left:256px;} .offset5{margin-left:320px;} .offset6{margin-left:384px;} .offset7{margin-left:448px;} .offset8{margin-left:512px;} .offset9{margin-left:576px;} .offset10{margin-left:640px;} .offset11{margin-left:704px;} .offset12{margin-left:768px;}}@media (min-width: 1170px){.container{width:1170px;} [class*="span"]{margin-left:30px;} .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{width:1170px;} .offset1{margin-left:100px;} .offset2{margin-left:200px;} .offset3{margin-left:300px;} .offset4{margin-left:400px;} .offset5{margin-left:500px;} .offset6{margin-left:600px;} .offset7{margin-left:700px;} .offset8{margin-left:800px;} .offset9{margin-left:900px;} .offset10{margin-left:1000px;} .offset11{margin-left:1100px;} .offset12{margin-left:1200px;}}
diff --git a/docs/assets/css/docs.css b/docs/assets/css/docs.css
index 52714d199114cd6adad94514782d975da970de93..fb7482edc788310f3c69bc28cdd1497d9c98960e 100644
--- a/docs/assets/css/docs.css
+++ b/docs/assets/css/docs.css
@@ -231,7 +231,7 @@ section > .row {
.mini-layout .mini-layout-body {
background-color: #dceaf4;
margin: 0 auto;
- width: 240px;
+ width: 70%;
height: 240px;
}
.mini-layout.fluid .mini-layout-sidebar,
@@ -241,11 +241,11 @@ section > .row {
}
.mini-layout.fluid .mini-layout-sidebar {
background-color: #bbd8e9;
- width: 90px;
+ width: 20%;
height: 240px;
}
.mini-layout.fluid .mini-layout-body {
- width: 300px;
+ width: 60%;
margin-left: 10px;
}
@@ -328,23 +328,22 @@ pre.prettyprint {
}
+.browser-support {
+ max-width: 100%;
+}
+
/* Responsive Docs
-------------------------------------------------- */
-
-/* Tablet to Medium Desktop
-------------------------- */
+@media (max-width: 480px) {
+ .large-bird {
+ display: none;
+ }
+}
@media (min-width: 768px) and (max-width: 900px) {
-
.footer,
.jumbotron {
min-width: 748px;
}
- .jumbotron .inner h1,
- .jumbotron .inner p {
- margin-left: 40px;
- margin-right: 40px;
- }
-
}
diff --git a/docs/index.html b/docs/index.html
index 0e49e9cbd29030f86537b941604dbacedeaf6407..b9004e6bfd44c8e68fe770605f57243008c6ea32 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -128,7 +128,7 @@
<div class="span4">
<h2>Cross-everything</h2>
<p>Bootstrap is tested and supported in major modern browsers like Chrome, Safari, Internet Explorer, and Firefox.</p>
- <img src="assets/img/browsers.png" alt="Tested and supported in Chrome, Safari, Internet Explorer, and Firefox">
+ <img class="browser-support" src="assets/img/browsers.png" alt="Tested and supported in Chrome, Safari, Internet Explorer, and Firefox">
<ul>
<li>Latest Safari</li>
<li>Latest Google Chrome</li>
diff --git a/lib/responsive.less b/lib/responsive.less
index ee974d3e18af4cfeae4f4c18f9570d6d25f2fd99..5c8e0539e822f1ddc2c2519d33a61d31e7b4d192 100644
--- a/lib/responsive.less
+++ b/lib/responsive.less
@@ -3,6 +3,9 @@
* ------------------------------------------------------------- */
+// UP TO LANDSCAPE PHONE
+// ---------------------
+
@media (max-width: 480px) {
// Remove width from containers
.container {
@@ -14,10 +17,40 @@
float: none;
display: block;
width: auto;
+ margin: 0;
+ }
+ // Resize modals
+ .modal {
+ width: auto;
+ margin: 0;
}
+
+ // Remove the horizontal form styles
+ .form-horizontal .control-group > label {
+ float: none;
+ width: auto;
+ padding-top: 0;
+ text-align: left;
+ }
+ // Move over all input controls and content
+ .form-horizontal .controls {
+ margin-left: 0;
+ }
+ // Move the options list down to align with labels
+ .form-horizontal .control-list {
+ padding-top: 0; // has to be padding because margin collaspes
+ }
+ // Move over buttons in .form-actions to align with .controls
+ .form-horizontal .form-actions {
+ padding-left: 0;
+ }
+
}
+// LANDSCAPE PHONE TO SMALL DESKTOP & PORTRAIT TABLET
+// --------------------------------------------------
+
@media (min-width: 480px) and (max-width: 768px) {
// Remove width from containers
.container {
@@ -34,24 +67,23 @@
}
-// TABLET TO MEDIUM DESKTOP
-// ------------------------
+// PORTRAIT TABLET TO DEFAULT DESKTOP
+// ----------------------------------
@media (min-width: 768px) and (max-width: 940px) {
// Reset grid variables
@gridColumns: 16;
- @gridColumnWidth: 28px;
+ @gridColumnWidth: 44px;
@gridGutterWidth: 20px;
@siteWidth: 748px;
- @extraSpace: (@gridGutterWidth * 2);
// Bring grid mixins to recalculate widths
.columns(@columnSpan: 1) {
width: (@gridColumnWidth * @columnSpan) + (@gridGutterWidth * (@columnSpan - 1));
}
.offset(@columnOffset: 1) {
- margin-left: (@gridColumnWidth * @columnOffset) + (@gridGutterWidth * (@columnOffset - 1)) + @extraSpace;
+ margin-left: (@gridColumnWidth * @columnOffset) + (@gridGutterWidth * (@columnOffset - 1)) + @gridGutterWidth;
}
// 16cols at 30px wide with 16px gutters
@@ -90,8 +122,8 @@
}
-// LARGE DESKTOP
-// -------------
+// LARGE DESKTOP & UP
+// ------------------
@media (min-width: 1170px) {
diff --git a/lib/type.less b/lib/type.less
index 4232a24dffca443a2ff4e8f1b5d6064bd9a8d6b2..7cf9e6ccd9aed1ae72640e2278477f66e67667f1 100644
--- a/lib/type.less
+++ b/lib/type.less
@@ -38,13 +38,13 @@ h1 {
}
h2 {
font-size: 24px;
- line-height: @baseLineHeight * 2;
+ line-height: @baseLineHeight * 1.5;
small {
font-size: 14px;
}
}
h3 {
- line-height: @baseLineHeight * 2;
+ line-height: @baseLineHeight * 1.5;
font-size: 18px;
small {
font-size: 14px;