diff --git a/docs/assets/css/bootstrap-responsive.css b/docs/assets/css/bootstrap-responsive.css
index 631c904e79..b0fbd9d7ba 100644
--- a/docs/assets/css/bootstrap-responsive.css
+++ b/docs/assets/css/bootstrap-responsive.css
@@ -175,22 +175,23 @@
margin-bottom: 36px;
}
.navbar-inner {
- padding: 10px;
+ padding: 5px;
background-image: none;
}
.navbar .container {
padding: 0;
}
.navbar .brand {
- float: none;
- display: block;
- padding-left: 15px;
- padding-right: 15px;
- margin: 0;
+ padding-left: 10px;
+ padding-right: 10px;
+ margin: 0 0 0 -5px;
+ }
+ .navbar .nav-collapse {
+ clear: left;
}
.navbar .nav {
float: none;
- margin: 9px 0;
+ margin: 0 0 9px;
}
.navbar .nav > li {
float: none;
@@ -217,8 +218,10 @@
}
.navbar .dropdown-menu {
position: static;
- display: block;
+ top: auto;
+ left: auto;
float: none;
+ display: block;
max-width: none;
margin: 0 15px;
padding: 0;
@@ -263,60 +266,83 @@
height: 0;
}
}
-/*
@media (min-width: 1210px) {
-
- // Reset grid variables
- @gridColumns: 12;
- @gridColumnWidth: 70px;
- @gridGutterWidth: 30px;
- @siteWidth: 1170px;
-
- // Bring grid mixins to recalculate widths
- .columns(@columns: 1) {
- width: (@gridColumnWidth * @columns) + (@gridGutterWidth * (@columns - 1));
- }
- .offset(@columns: 1) {
- margin-left: (@gridColumnWidth * @columns) + (@gridGutterWidth * (@columns - 1)) + (@gridGutterWidth * 2);
- }
-
.container {
- width: @siteWidth;
+ width: 1170px;
}
.row {
- margin-left: @gridGutterWidth * -1;
+ margin-left: -30px;
}
[class*="span"] {
- margin-left: @gridGutterWidth;
+ 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: 130px;
+ }
+ .offset2 {
+ margin-left: 230px;
+ }
+ .offset3 {
+ margin-left: 330px;
+ }
+ .offset4 {
+ margin-left: 430px;
+ }
+ .offset5 {
+ margin-left: 530px;
+ }
+ .offset6 {
+ margin-left: 630px;
+ }
+ .offset7 {
+ margin-left: 730px;
+ }
+ .offset8 {
+ margin-left: 830px;
+ }
+ .offset9 {
+ margin-left: 930px;
+ }
+ .offset10 {
+ margin-left: 1030px;
+ }
+ .offset11 {
+ margin-left: 1130px;
}
-
- // 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); }
- .offset12 { .offset(12); }
-
}
-*/
\ No newline at end of file
diff --git a/docs/assets/css/bootstrap.css b/docs/assets/css/bootstrap.css
index bf1116f538..6916e9361a 100644
--- a/docs/assets/css/bootstrap.css
+++ b/docs/assets/css/bootstrap.css
@@ -2315,8 +2315,8 @@ button.btn.small, input[type="submit"].btn.small {
display: none;
float: right;
padding: 7px 10px;
- margin-left: 10px;
- margin-right: 10px;
+ margin-left: 5px;
+ margin-right: 5px;
background-color: #2c2c2c;
background-image: -moz-linear-gradient(top, #333333, #222222);
background-image: -ms-linear-gradient(top, #333333, #222222);
diff --git a/docs/assets/css/docs.css b/docs/assets/css/docs.css
index b06065365f..cc7ca0c639 100644
--- a/docs/assets/css/docs.css
+++ b/docs/assets/css/docs.css
@@ -522,6 +522,7 @@ h2 + .row {
/* Example sites showcase */
.example-sites img {
max-width: 100%;
+ margin: 0 auto;
}
.marketing-byline {
margin: -18px 0 27px;
@@ -646,6 +647,10 @@ form.well {
padding: 10px 14px;
margin: 0 auto 10px;
}
+ /* Masthead (home page jumbotron) */
+ .masthead {
+ padding-top: 0;
+ }
/* Don't space out quick links so much */
.quick-links {
@@ -669,8 +674,9 @@ form.well {
display: block;
max-width: 300px;
margin: 0 auto 18px;
+ text-align: center;
}
- .example-sites img {
+ .example-sites .thumbnail > img {
max-width: 270px;
}
@@ -796,11 +802,20 @@ form.well {
/* Unfloat brand */
.navbar-fixed-top .brand {
- float: none;
+ float: left;
margin-left: 0;
- padding-left: 15px;
- padding-right: 15px;
+ padding-left: 10px;
+ padding-right: 10px;
}
}
+/* LARGE DESKTOP SCREENS */
+@media (min-width: 1210px) {
+
+ /* Update subnav container */
+ .subnav-fixed .nav {
+ width: 1168px; /* 2px less to account for left/right borders being removed when in fixed mode */
+ }
+
+}
diff --git a/docs/base-css.html b/docs/base-css.html
index c68391261c..4651e9789c 100644
--- a/docs/base-css.html
+++ b/docs/base-css.html
@@ -1497,7 +1497,7 @@ For example, <code>section</code> should be wrapped as inline.
diff --git a/docs/components.html b/docs/components.html
index a2fac7360b..950d1f35c7 100644
--- a/docs/components.html
+++ b/docs/components.html
@@ -662,40 +662,47 @@
@@ -733,7 +740,7 @@
<input type="text" class="search-query pull-left" placeholder="Search">
</form>
-
+
Nav links
Nav items are simple to add via unordered lists.
@@ -763,9 +770,9 @@
</li>
</ul>
-
Get the javascript →
-
-
+ Get the javascript →
+
+
diff --git a/docs/templates/pages/base-css.mustache b/docs/templates/pages/base-css.mustache
index 6cbb111acb..c15fcebd39 100644
--- a/docs/templates/pages/base-css.mustache
+++ b/docs/templates/pages/base-css.mustache
@@ -1425,7 +1425,7 @@
diff --git a/docs/templates/pages/components.mustache b/docs/templates/pages/components.mustache
index 363ed1ba13..3a92953ae7 100644
--- a/docs/templates/pages/components.mustache
+++ b/docs/templates/pages/components.mustache
@@ -590,40 +590,47 @@
@@ -661,7 +668,7 @@
<input type="text" class="search-query pull-left" placeholder="{{_i}}Search{{/i}}">
</form>
-
+
-
+ {{_i}}Get the javascript →{{/i}}
+
+
diff --git a/less/navbar.less b/less/navbar.less
index 379cbb56d9..4fd8a9073d 100644
--- a/less/navbar.less
+++ b/less/navbar.less
@@ -21,8 +21,8 @@
display: none;
float: right;
padding: 7px 10px;
- margin-left: 10px;
- margin-right: 10px;
+ margin-left: 5px;
+ margin-right: 5px;
.buttonBackground(@navbarBackgroundHighlight, @navbarBackground);
@shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 1px 0 rgba(255,255,255,.075);
.box-shadow(@shadow);
diff --git a/less/responsive.less b/less/responsive.less
index 6c3102c14f..0955710b6f 100644
--- a/less/responsive.less
+++ b/less/responsive.less
@@ -202,7 +202,7 @@
margin-bottom: @baseLineHeight * 2;
}
.navbar-inner {
- padding: 10px;
+ padding: 5px;
background-image: none;
}
.navbar .container {
@@ -210,16 +210,18 @@
}
// Account for brand name
.navbar .brand {
- float: none;
- display: block;
- padding-left: 15px;
- padding-right: 15px;
- margin: 0;
+ padding-left: 10px;
+ padding-right: 10px;
+ margin: 0 0 0 -5px;
+ }
+ // Nav collapse clears brand
+ .navbar .nav-collapse {
+ clear: left;
}
// Block-level the nav
.navbar .nav {
float: none;
- margin: (@baseLineHeight / 2) 0;
+ margin: 0 0 (@baseLineHeight / 2);
}
.navbar .nav > li {
float: none;
@@ -248,8 +250,10 @@
// Dropdowns in the navbar
.navbar .dropdown-menu {
position: static;
- display: block;
+ top: auto;
+ left: auto;
float: none;
+ display: block;
max-width: none;
margin: 0 15px;
padding: 0;
@@ -301,7 +305,7 @@
// LARGE DESKTOP & UP
// ------------------
-/*
+
@media (min-width: 1210px) {
// Reset grid variables
@@ -317,7 +321,6 @@
.offset(@columns: 1) {
margin-left: (@gridColumnWidth * @columns) + (@gridGutterWidth * (@columns - 1)) + (@gridGutterWidth * 2);
}
-
.container {
width: @siteWidth;
}
@@ -354,7 +357,5 @@
.offset9 { .offset(9); }
.offset10 { .offset(10); }
.offset11 { .offset(11); }
- .offset12 { .offset(12); }
}
-*/
\ No newline at end of file