From 782c994060a984c10d73fdd3cc8e3fe33a2e4477 Mon Sep 17 00:00:00 2001 From: Nicolas Gallagher Date: Fri, 20 Jan 2012 21:16:40 +0000 Subject: [PATCH 1/8] Remove global reset in favour of contextual reset. Rather than having a partial reset with individual elements having their styles built back up, only elements without replacement styles have specific properties 'reset'. This commit also includes: a correction to the font mixin arguments used on forms (the output is now valid CSS); the removal of `overflow-y:scroll` from the `html` element which is now known to cause some problems for jQuery modal plugins in Firefox. --- bootstrap.css | 146 ++++++++++++++----------------------------- bootstrap.min.css | 38 +++++------ lib/forms.less | 13 +++- lib/reset.less | 69 +++++++------------- lib/scaffolding.less | 2 - lib/tables.less | 9 +++ lib/type.less | 31 ++++++--- 7 files changed, 132 insertions(+), 176 deletions(-) diff --git a/bootstrap.css b/bootstrap.css index 959eb24214..b2aaece91f 100644 --- a/bootstrap.css +++ b/bootstrap.css @@ -6,95 +6,8 @@ * 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 19 Jan 2012 22:27:04 GMT + * Date: Fri 20 Jan 2012 21:21:51 GMT */ -html, body { - margin: 0; - padding: 0; -} -h1, -h2, -h3, -h4, -h5, -h6, -p, -blockquote, -pre, -a, -abbr, -acronym, -address, -cite, -code, -del, -dfn, -em, -img, -q, -s, -samp, -small, -strike, -strong, -sub, -sup, -tt, -var, -dd, -dl, -dt, -li, -ol, -ul, -fieldset, -form, -label, -legend, -button, -table, -caption, -tbody, -tfoot, -thead, -tr, -th, -td { - margin: 0; - padding: 0; - border: 0; - font-weight: normal; - font-style: normal; - font-size: 100%; - line-height: 1; - font-family: inherit; -} -table { - max-width: 100%; - border-collapse: collapse; - border-spacing: 0; -} -ol, ul { - list-style: none; -} -q:before, -q:after, -blockquote:before, -blockquote:after { - content: ""; -} -html { - overflow-y: scroll; - font-size: 100%; - -webkit-text-size-adjust: 100%; - -ms-text-size-adjust: 100%; -} -a:focus { - outline: thin dotted; -} -a:hover, a:active { - outline: 0; -} article, aside, details, @@ -115,6 +28,17 @@ audio, canvas, video { audio:not([controls]) { display: none; } +html { + font-size: 100%; + -webkit-text-size-adjust: 100%; + -ms-text-size-adjust: 100%; +} +a:focus { + outline: thin dotted; +} +a:hover, a:active { + outline: 0; +} sub, sup { position: relative; font-size: 75%; @@ -228,8 +152,6 @@ body { width: 100%; } a { - font-weight: inherit; - line-height: inherit; color: #0088cc; text-decoration: none; } @@ -322,7 +244,7 @@ a:hover { margin-left: 900px; } p { - margin-bottom: 9px; + margin: 0 0 9px; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 13px; line-height: 18px; @@ -337,6 +259,7 @@ h3, h4, h5, h6 { + margin: 0; font-weight: bold; color: #333333; text-rendering: optimizelegibility; @@ -347,6 +270,7 @@ h3 small, h4 small, h5 small, h6 small { + font-weight: normal; color: #999999; } h1 { @@ -388,6 +312,7 @@ h6 { text-transform: uppercase; } ul, ol { + padding: 0; margin: 0 0 9px 25px; } ul ul, @@ -428,13 +353,10 @@ hr { border-bottom: 1px solid #fff; } strong { - font-style: inherit; font-weight: bold; } em { font-style: italic; - font-weight: inherit; - line-height: inherit; } .muted { color: #999999; @@ -446,8 +368,8 @@ abbr { cursor: help; } blockquote { - padding-left: 15px; - margin-bottom: 18px; + padding: 0 0 0 15px; + margin: 0 0 18px; border-left: 5px solid #eee; } blockquote p { @@ -474,10 +396,17 @@ blockquote.pull-right { blockquote.pull-right p, blockquote.pull-right small { text-align: right; } +q:before, +q:after, +blockquote:before, +blockquote:after { + content: ""; +} address { display: block; margin-bottom: 18px; line-height: 18px; + font-style: normal; } code, pre { padding: 0 3px 2px; @@ -515,26 +444,40 @@ pre code { padding: 0; background-color: transparent; } +small { + font-size: 100%; +} +cite { + font-style: normal; +} form { - margin-bottom: 18px; + margin: 0 0 18px; +} +fieldset { + padding: 0; + margin: 0; + border: 0; } legend { display: block; width: 100%; + padding: 0; margin-bottom: 27px; font-size: 19.5px; line-height: 36px; color: #333333; + border: 0; border-bottom: 1px solid #eee; -webkit-margin-collapse: separate; } label, input, +button, select, textarea { font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; - font-size: normal; - font-weight: 13px; + font-size: 13px; + font-weight: normal; line-height: 18px; } label { @@ -967,6 +910,11 @@ input:invalid:focus, textarea:invalid:focus, select:invalid:focus { .form-horizontal .form-actions { padding-left: 160px; } +table { + max-width: 100%; + border-collapse: collapse; + border-spacing: 0; +} .table { width: 100%; margin-bottom: 18px; diff --git a/bootstrap.min.css b/bootstrap.min.css index f71a05e047..d709e87a9c 100644 --- a/bootstrap.min.css +++ b/bootstrap.min.css @@ -1,14 +1,9 @@ -html,body{margin:0;padding:0;} -h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,cite,code,del,dfn,em,img,q,s,samp,small,strike,strong,sub,sup,tt,var,dd,dl,dt,li,ol,ul,fieldset,form,label,legend,button,table,caption,tbody,tfoot,thead,tr,th,td{margin:0;padding:0;border:0;font-weight:normal;font-style:normal;font-size:100%;line-height:1;font-family:inherit;} -table{max-width:100%;border-collapse:collapse;border-spacing:0;} -ol,ul{list-style:none;} -q:before,q:after,blockquote:before,blockquote:after{content:"";} -html{overflow-y:scroll;font-size:100%;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;} -a:focus{outline:thin dotted;} -a:hover,a:active{outline:0;} article,aside,details,figcaption,figure,footer,header,hgroup,nav,section{display:block;} audio,canvas,video{display:inline-block;*display:inline;*zoom:1;} audio:not([controls]){display:none;} +html{font-size:100%;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;} +a:focus{outline:thin dotted;} +a:hover,a:active{outline:0;} sub,sup{position:relative;font-size:75%;line-height:0;vertical-align:baseline;} sup{top:-0.5em;} sub{bottom:-0.25em;} @@ -31,7 +26,7 @@ body{margin:0;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size: .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{font-weight:inherit;line-height:inherit;color:#0088cc;text-decoration:none;}a:hover{color:#005580;text-decoration:underline;} +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;} [class*="span"]{float:left;margin-left:20px;} @@ -58,8 +53,8 @@ a{font-weight:inherit;line-height:inherit;color:#0088cc;text-decoration:none;}a: .offset9{margin-left:740px;} .offset10{margin-left:820px;} .offset11{margin-left:900px;} -p{margin-bottom:9px;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:13px;line-height:18px;}p small{font-size:11px;color:#999999;} -h1,h2,h3,h4,h5,h6{font-weight:bold;color:#333333;text-rendering:optimizelegibility;}h1 small,h2 small,h3 small,h4 small,h5 small,h6 small{color:#999999;} +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;} +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;} h1{font-size:30px;line-height:36px;}h1 small{font-size:18px;} h2{font-size:24px;line-height:36px;}h2 small{font-size:18px;} h3{line-height:27px;font-size:18px;}h3 small{font-size:14px;} @@ -67,7 +62,7 @@ h4,h5,h6{line-height:18px;} h4{font-size:14px;}h4 small{font-size:12px;} h5{font-size:12px;} h6{font-size:11px;color:#999999;text-transform:uppercase;} -ul,ol{margin:0 0 9px 25px;} +ul,ol{padding:0;margin:0 0 9px 25px;} ul ul,ul ol,ol ol,ol ul{margin-bottom:0;} ul{list-style:disc;} ol{list-style:decimal;} @@ -78,21 +73,25 @@ dt,dd{line-height:18px;} dt{font-weight:bold;} dd{margin-left:9px;} hr{margin:18px 0;border:0;border-top:1px solid #e5e5e5;border-bottom:1px solid #fff;} -strong{font-style:inherit;font-weight:bold;} -em{font-style:italic;font-weight:inherit;line-height:inherit;} +strong{font-weight:bold;} +em{font-style:italic;} .muted{color:#999999;} abbr{font-size:90%;text-transform:uppercase;border-bottom:1px dotted #ddd;cursor:help;} -blockquote{padding-left:15px;margin-bottom:18px;border-left:5px solid #eee;}blockquote p{margin-bottom:0;font-size:16px;font-weight:300;line-height:22.5px;} +blockquote{padding:0 0 0 15px;margin:0 0 18px;border-left:5px solid #eee;}blockquote p{margin-bottom:0;font-size:16px;font-weight:300;line-height:22.5px;} blockquote small{display:block;line-height:18px;color:#999999;}blockquote small:before{content:'\2014 \00A0';} blockquote.pull-right{float:right;padding-left:0;padding-right:15px;border-left:0;border-right:5px solid #eee;}blockquote.pull-right p,blockquote.pull-right small{text-align:right;} -address{display:block;margin-bottom:18px;line-height:18px;} +q:before,q:after,blockquote:before,blockquote:after{content:"";} +address{display:block;margin-bottom:18px;line-height:18px;font-style:normal;} code,pre{padding:0 3px 2px;font-family:Menlo,Monaco,"Courier New",monospace;font-size:12px;color:#333333;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;} code{padding:1px 3px;background-color:#fee9cc;} pre{display:block;padding:8.5px;margin:0 0 9px;font-size:12px;line-height:18px;background-color:#f5f5f5;border:1px solid #ccc;border:1px solid rgba(0, 0, 0, 0.15);-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;white-space:pre;white-space:pre-wrap;word-break:break-all;}pre.prettyprint{margin-bottom:18px;} pre code{padding:0;background-color:transparent;} -form{margin-bottom:18px;} -legend{display:block;width:100%;margin-bottom:27px;font-size:19.5px;line-height:36px;color:#333333;border-bottom:1px solid #eee;-webkit-margin-collapse:separate;} -label,input,select,textarea{font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:normal;font-weight:13px;line-height:18px;} +small{font-size:100%;} +cite{font-style:normal;} +form{margin:0 0 18px;} +fieldset{padding:0;margin:0;border:0;} +legend{display:block;width:100%;padding:0;margin-bottom:27px;font-size:19.5px;line-height:36px;color:#333333;border:0;border-bottom:1px solid #eee;-webkit-margin-collapse:separate;} +label,input,button,select,textarea{font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:13px;font-weight:normal;line-height:18px;} label{display:block;margin-bottom:5px;color:#333333;} input,textarea,select,.uneditable-input{display:block;width:210px;height:18px;padding:4px;margin-bottom:9px;font-size:13px;line-height:18px;color:#555555;border:1px solid #ccc;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;} input[type=image],input[type=checkbox],input[type=radio]{width:auto;height:auto;padding:0;margin:3px 0;*margin-top:0;line-height:normal;border:none;cursor:pointer;} @@ -176,6 +175,7 @@ input:invalid,textarea:invalid,select:invalid{color:#b94a48;border-color:#ee5f5b .form-horizontal .control-group>label{float:left;width:140px;padding-top:5px;text-align:right;} .form-horizontal .controls{margin-left:160px;} .form-horizontal .form-actions{padding-left:160px;} +table{max-width:100%;border-collapse:collapse;border-spacing:0;} .table{width:100%;margin-bottom:18px;}.table th,.table td{padding:8px;line-height:18px;text-align:left;border-top:1px solid #ddd;} .table th{font-weight:bold;vertical-align:bottom;} .table td{vertical-align:top;} diff --git a/lib/forms.less b/lib/forms.less index e956b0046f..0cc7f2035c 100644 --- a/lib/forms.less +++ b/lib/forms.less @@ -8,17 +8,25 @@ // Make all forms have space below them form { - margin-bottom: @baseLineHeight; + margin: 0 0 @baseLineHeight; +} + +fieldset { + padding: 0; + margin: 0; + border: 0; } // Groups of fields with labels on top (legends) legend { display: block; width: 100%; + padding: 0; margin-bottom: @baseLineHeight * 1.5; font-size: @baseFontSize * 1.5; line-height: @baseLineHeight * 2; color: @grayDark; + border: 0; border-bottom: 1px solid #eee; -webkit-margin-collapse: separate; } @@ -26,9 +34,10 @@ legend { // Set font for forms label, input, +button, select, textarea { - #font > .sans-serif(normal,@baseFontSize,@baseLineHeight); + #font > .sans-serif(@baseFontSize,normal,@baseLineHeight); } // Identify controls by their labels diff --git a/lib/reset.less b/lib/reset.less index 8fe04d6d1e..31e7160f2d 100644 --- a/lib/reset.less +++ b/lib/reset.less @@ -1,50 +1,10 @@ // 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). +// Adapted from Normalize.css http://github.com/necolas/normalize.css // ------------------------------------------------------------------------ - -// ERIC MEYER RESET -// -------------------------------------------------- - -html, body { margin: 0; padding: 0; } -h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, cite, code, del, dfn, em, img, q, s, samp, small, strike, strong, sub, sup, tt, var, dd, dl, dt, li, ol, ul, fieldset, form, label, legend, button, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; font-weight: normal; font-style: normal; font-size: 100%; line-height: 1; font-family: inherit; } -table { - max-width: 100%; - border-collapse: collapse; - border-spacing: 0; -} -ol, ul { list-style: none; } -q:before, q:after, blockquote:before, blockquote:after { content: ""; } - - -// Normalize.css -// Pulling in select resets form the normalize.css project -// -------------------------------------------------- - // Display in IE6-9 and FF3 // ------------------------- -// Source: http://github.com/necolas/normalize.css -html { - overflow-y: scroll; - font-size: 100%; - -webkit-text-size-adjust: 100%; - -ms-text-size-adjust: 100%; -} -// Focus states -a:focus { - outline: thin dotted; -} -// Hover & Active -a:hover, -a:active { - outline: 0; -} -// Display in IE6-9 and FF3 -// ------------------------- -// Source: http://github.com/necolas/normalize.css article, aside, details, @@ -60,7 +20,7 @@ section { // Display block in IE6-9 and FF3 // ------------------------- -// Source: http://github.com/necolas/normalize.css + audio, canvas, video { @@ -71,14 +31,32 @@ video { // Prevents modern browsers from displaying 'audio' without controls // ------------------------- -// Source: http://github.com/necolas/normalize.css + audio:not([controls]) { display: none; } +// Base settings +// ------------------------- + +html { + font-size: 100%; + -webkit-text-size-adjust: 100%; + -ms-text-size-adjust: 100%; +} +// Focus states +a:focus { + outline: thin dotted; +} +// Hover & Active +a:hover, +a:active { + outline: 0; +} + // Prevents sub and sup affecting line-height in all browsers // ------------------------- -// Source: http://github.com/necolas/normalize.css + sub, sup { position: relative; @@ -95,7 +73,7 @@ sub { // Img border in a's and image quality // ------------------------- -// Source: http://github.com/necolas/normalize.css + img { max-width: 100%; height: auto; @@ -105,7 +83,6 @@ img { // Forms // ------------------------- -// Source: http://github.com/necolas/normalize.css // Font size in all browsers, margin changes, misc consistency button, diff --git a/lib/scaffolding.less b/lib/scaffolding.less index a0d54a8865..d6fac06f09 100644 --- a/lib/scaffolding.less +++ b/lib/scaffolding.less @@ -60,8 +60,6 @@ body { // Links a { - font-weight: inherit; - line-height: inherit; color: @linkColor; text-decoration: none; &:hover { diff --git a/lib/tables.less b/lib/tables.less index 29e1e2d465..98b2b9f921 100644 --- a/lib/tables.less +++ b/lib/tables.less @@ -4,6 +4,15 @@ // ---------------------------------------- +// BASE TABLES +// ----------------- + +table { + max-width: 100%; + border-collapse: collapse; + border-spacing: 0; +} + // BASELINE STYLES // --------------- diff --git a/lib/type.less b/lib/type.less index 707d2215de..e2049fb71c 100644 --- a/lib/type.less +++ b/lib/type.less @@ -7,7 +7,7 @@ // --------- p { - margin-bottom: @baseLineHeight / 2; + margin: 0 0 @baseLineHeight / 2; font-family: @baseFontFamily; font-size: @baseFontSize; line-height: @baseLineHeight; @@ -17,15 +17,16 @@ p { } } - // HEADINGS // -------- h1, h2, h3, h4, h5, h6 { + margin: 0; font-weight: bold; color: @grayDark; text-rendering: optimizelegibility; // Fix the character spacing for headings small { + font-weight: normal; color: @grayLight; } } @@ -74,6 +75,7 @@ h6 { // Unordered and Ordered lists ul, ol { + padding: 0; margin: 0 0 @baseLineHeight / 2 25px; } ul ul, @@ -124,13 +126,10 @@ hr { // Emphasis strong { - font-style: inherit; font-weight: bold; } em { font-style: italic; - font-weight: inherit; - line-height: inherit; } .muted { color: @grayLight; @@ -146,8 +145,8 @@ abbr { // Blockquotes blockquote { - padding-left: 15px; - margin-bottom: @baseLineHeight; + padding: 0 0 0 15px; + margin: 0 0 @baseLineHeight; border-left: 5px solid #eee; p { margin-bottom: 0; @@ -176,11 +175,19 @@ blockquote { } } +q:before, +q:after, +blockquote:before, +blockquote:after { + content: ""; +} + // Addresses address { display: block; margin-bottom: @baseLineHeight; line-height: @baseLineHeight; + font-style: normal; } // Inline and block code styles @@ -220,4 +227,12 @@ pre { padding: 0; background-color: transparent; } -} \ No newline at end of file +} + +small { + font-size: 100%; +} + +cite { + font-style: normal; +} From 00d925819405ef46fb09d4bef83761ea121a9364 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Mon, 23 Jan 2012 11:35:39 -0800 Subject: [PATCH 2/8] revert to negative margin on grid row --- bootstrap.css | 8 +++----- bootstrap.min.css | 5 ++--- lib/scaffolding.less | 5 +---- lib/thumbnails.less | 2 +- 4 files changed, 7 insertions(+), 13 deletions(-) diff --git a/bootstrap.css b/bootstrap.css index 85a3edb6f7..fc0337f6dc 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: Mon Jan 23 11:25:06 PST 2012 + * Date: Mon Jan 23 11:35:22 PST 2012 */ article, aside, @@ -160,6 +160,7 @@ a:hover { text-decoration: underline; } .row { + margin-left: -20px; *zoom: 1; } .row:before, .row:after { @@ -169,9 +170,6 @@ a:hover { .row:after { clear: both; } -[class*="span"]:first-child { - margin-left: 0; -} [class*="span"] { float: left; margin-left: 20px; @@ -2673,7 +2671,7 @@ button.btn::-moz-focus-inner, input[type=submit].btn::-moz-focus-inner { } .thumbnails > li { float: left; - margin: 0 0 20px 20px; + margin: 0 0 18px 20px; } .thumbnail { display: block; diff --git a/bootstrap.min.css b/bootstrap.min.css index 172e7961be..bee4eb82a2 100644 --- a/bootstrap.min.css +++ b/bootstrap.min.css @@ -27,9 +27,8 @@ body{margin:0;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size: .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{*zoom:1;}.row:before,.row:after{display:table;content:"";} +.row{margin-left:-20px;*zoom:1;}.row:before,.row:after{display:table;content:"";} .row:after{clear:both;} -[class*="span"]:first-child{margin-left:0;} [class*="span"]{float:left;margin-left:20px;} .span1{width:60px;} .span2{width:140px;} @@ -493,7 +492,7 @@ button.btn::-moz-focus-inner,input[type=submit].btn::-moz-focus-inner{padding:0; .alert-block p+p{margin-top:5px;} .thumbnails{margin-left:-20px;list-style:none;*zoom:1;}.thumbnails:before,.thumbnails:after{display:table;content:"";} .thumbnails:after{clear:both;} -.thumbnails>li{float:left;margin:0 0 20px 20px;} +.thumbnails>li{float:left;margin:0 0 18px 20px;} .thumbnail{display:block;padding:4px;line-height:1;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);} a.thumbnail:hover{border-color:#0088cc;-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);} .thumbnail>img{display:block;max-width:100%;} diff --git a/lib/scaffolding.less b/lib/scaffolding.less index 13f55026d7..ff029e841b 100644 --- a/lib/scaffolding.less +++ b/lib/scaffolding.less @@ -73,13 +73,10 @@ a { // ----------- // 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(); } -[class*="span"]:first-child{ - margin-left: 0; -} - // 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 diff --git a/lib/thumbnails.less b/lib/thumbnails.less index 4f9c5f76d3..0ba749059d 100644 --- a/lib/thumbnails.less +++ b/lib/thumbnails.less @@ -8,7 +8,7 @@ } .thumbnails > li { float: left; - margin: 0 0 20px 20px; + margin: 0 0 @baseLineHeight 20px; } .thumbnail { display: block; From a7bf0295fbf3ce9abc1ca44680f4a6eaf17339b5 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Mon, 23 Jan 2012 11:55:04 -0800 Subject: [PATCH 3/8] remove dropdowns, add in sub nav instead --- docs/base-css.html | 80 +++++++++----------------------------- docs/components.html | 86 +++++++++++------------------------------ docs/index.html | 75 ++++++------------------------------ docs/javascript.html | 89 +++++++++++++------------------------------ docs/less.html | 69 +++++---------------------------- docs/scaffolding.html | 80 +++++++++----------------------------- 6 files changed, 105 insertions(+), 374 deletions(-) diff --git a/docs/base-css.html b/docs/base-css.html index 8ac9134773..df0c9c7ce9 100644 --- a/docs/base-css.html +++ b/docs/base-css.html @@ -34,71 +34,20 @@ Bootstrap @@ -112,6 +61,13 @@

Base CSS

On top of the scaffolding, basic HTML elements are styled and enhanced with extensible classes to provide a fresh, consistent look and feel.

+
diff --git a/docs/components.html b/docs/components.html index 984e8c76d8..47efee5ac7 100755 --- a/docs/components.html +++ b/docs/components.html @@ -34,71 +34,20 @@ Bootstrap @@ -112,6 +61,17 @@

Components

Dozens of reusable components are built into Bootstrap to provide navigation, alerts, popovers, and much more.

+
diff --git a/docs/index.html b/docs/index.html index ce56a04ef6..eee32e0d48 100644 --- a/docs/index.html +++ b/docs/index.html @@ -35,71 +35,20 @@ Bootstrap diff --git a/docs/javascript.html b/docs/javascript.html index 6a240c4d4b..0a0a0c9efd 100644 --- a/docs/javascript.html +++ b/docs/javascript.html @@ -35,71 +35,20 @@ Bootstrap @@ -112,6 +61,20 @@

Javascript for Bootstrap

Bring Bootstrap's components to life—now with 12 custom jQuery plugins. +

diff --git a/docs/less.html b/docs/less.html index 09ff3e8e10..0348c0cafa 100644 --- a/docs/less.html +++ b/docs/less.html @@ -34,71 +34,20 @@ Bootstrap diff --git a/docs/scaffolding.html b/docs/scaffolding.html index f068c837c7..4a27104c33 100644 --- a/docs/scaffolding.html +++ b/docs/scaffolding.html @@ -34,71 +34,20 @@ Bootstrap @@ -112,6 +61,11 @@

Scaffolding

Bootstrap is built on a responsive 12-column grid. We've also included fixed- and fluid-width layouts based on that system.

+
From ea8f5883fd58ff5e356944e4a93543c05abf2220 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Mon, 23 Jan 2012 12:04:48 -0800 Subject: [PATCH 4/8] clean up subnav aesthetics --- docs/assets/css/docs.css | 34 ++++++++++++++++++++++++++++++++-- docs/components.html | 4 ++-- 2 files changed, 34 insertions(+), 4 deletions(-) diff --git a/docs/assets/css/docs.css b/docs/assets/css/docs.css index 416b1830cd..e7714fd5c4 100644 --- a/docs/assets/css/docs.css +++ b/docs/assets/css/docs.css @@ -115,8 +115,8 @@ section { ------------------------- */ /* supporting docs pages */ .subhead { - padding-bottom: 14px; - border-bottom: 3px solid #e5e5e5; + padding-bottom: 0; + border-bottom: 0; } .subhead h1, .subhead p { @@ -126,6 +126,36 @@ section { font-size: 45px; } +/* Subnav */ +.subhead .nav { + padding: 0 10px; + background-color: #eeeeee; /* Old browsers */ + background-repeat: repeat-x; /* Repeat the gradient */ + background-image: -moz-linear-gradient(top, #f5f5f5 0%, #eeeeee 100%); /* FF3.6+ */ + background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f5f5f5), color-stop(100%,#eeeeee)); /* Chrome,Safari4+ */ + background-image: -webkit-linear-gradient(top, #f5f5f5 0%,#eeeeee 100%); /* Chrome 10+,Safari 5.1+ */ + background-image: -ms-linear-gradient(top, #f5f5f5 0%,#eeeeee 100%); /* IE10+ */ + background-image: -o-linear-gradient(top, #f5f5f5 0%,#eeeeee 100%); /* Opera 11.10+ */ + filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f5f5f5', endColorstr='#eeeeee',GradientType=0 ); /* IE6-9 */ + background-image: linear-gradient(top, #f5f5f5 0%,#eeeeee 100%); /* W3C */ + border: 1px solid #eee; + -webkit-border-radius: 4px; + -moz-border-radius: 4px; + border-radius: 4px; +} +.subhead .nav a { + margin: 0; + padding-top: 11px; + padding-bottom: 11px; + -webkit-border-radius: 0; + -moz-border-radius: 0; + border-radius: 0; +} +.subhead .nav .active a { + background-color: #fff; + color: #333; +} + /* Quick links -------------------------------------------------- */ diff --git a/docs/components.html b/docs/components.html index 47efee5ac7..8cd76bedc8 100755 --- a/docs/components.html +++ b/docs/components.html @@ -63,13 +63,13 @@

Dozens of reusable components are built into Bootstrap to provide navigation, alerts, popovers, and much more.

From ff113acba88806380b995fba894d77b562ca0e0a Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Mon, 23 Jan 2012 12:21:00 -0800 Subject: [PATCH 5/8] cut margin in half on default forms --- bootstrap.css | 5 ++++- bootstrap.min.css | 3 ++- lib/forms.less | 5 ++++- 3 files changed, 10 insertions(+), 3 deletions(-) diff --git a/bootstrap.css b/bootstrap.css index fc0337f6dc..6f2a8c7518 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: Mon Jan 23 11:35:22 PST 2012 + * Date: Mon Jan 23 12:20:49 PST 2012 */ article, aside, @@ -896,6 +896,9 @@ input:focus:required:invalid:focus, textarea:focus:required:invalid:focus, selec display: inline-block; } .control-group { + margin-bottom: 9px; +} +.form-horizontal .control-group { margin-bottom: 18px; } .form-horizontal .control-group > label { diff --git a/bootstrap.min.css b/bootstrap.min.css index bee4eb82a2..3f6c6a825c 100644 --- a/bootstrap.min.css +++ b/bootstrap.min.css @@ -171,7 +171,8 @@ input:focus:required:invalid,textarea:focus:required:invalid,select:focus:requir .search-query{padding-left:14px;padding-right:14px;margin-bottom:0;-webkit-border-radius:14px;-moz-border-radius:14px;border-radius:14px;} .form-search input,.form-inline input,.form-horizontal input,.form-search textarea,.form-inline textarea,.form-horizontal textarea,.form-search select,.form-inline select,.form-horizontal select,.form-search .uneditable-input,.form-inline .uneditable-input,.form-horizontal .uneditable-input{display:inline-block;margin-bottom:0;} .form-search label,.form-inline label{display:inline-block;} -.control-group{margin-bottom:18px;} +.control-group{margin-bottom:9px;} +.form-horizontal .control-group{margin-bottom:18px;} .form-horizontal .control-group>label{float:left;width:140px;padding-top:5px;text-align:right;} .form-horizontal .controls{margin-left:160px;} .form-horizontal .form-actions{padding-left:160px;} diff --git a/lib/forms.less b/lib/forms.less index 85bf261633..bf3dbe64c8 100644 --- a/lib/forms.less +++ b/lib/forms.less @@ -463,13 +463,16 @@ select:focus:required:invalid { // Margin to space out fieldsets .control-group { - margin-bottom: @baseLineHeight; + margin-bottom: @baseLineHeight / 2; } // Horizontal-specific styles // -------------------------- .form-horizontal { + .control-group { + margin-bottom: @baseLineHeight; + } // Float the labels left .control-group > label { float: left; From 1fa2801c2f8ad1e3c319fd6fc0d2e8baddccf6cc Mon Sep 17 00:00:00 2001 From: Olivier Laviale Date: Mon, 23 Jan 2012 21:22:08 +0100 Subject: [PATCH 6/8] .alert-message no longer exists --- lib/buttons.less | 1 - 1 file changed, 1 deletion(-) diff --git a/lib/buttons.less b/lib/buttons.less index 5da34a5257..f13a9acbfd 100644 --- a/lib/buttons.less +++ b/lib/buttons.less @@ -102,7 +102,6 @@ } } // Super jank hack for removing border-radius from IE9 so we can keep filter gradients on alerts and buttons -:root .alert-message, :root .btn { border-radius: 0 \0; } From 1954cf001926a94f7a4d51f16beaf9f2ba671d13 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Mon, 23 Jan 2012 13:46:26 -0800 Subject: [PATCH 7/8] comment in forms' --- docs/assets/css/docs.css | 13 +++++++++++++ lib/forms.less | 1 + 2 files changed, 14 insertions(+) diff --git a/docs/assets/css/docs.css b/docs/assets/css/docs.css index e7714fd5c4..69d9dac568 100644 --- a/docs/assets/css/docs.css +++ b/docs/assets/css/docs.css @@ -448,6 +448,7 @@ h2 + .row { margin: -18px 0 27px; font-size: 18px; font-weight: 300; + line-height: 24px; color: #999; text-align: center; } @@ -563,6 +564,18 @@ form.well { margin: 0 auto 10px; } + /* Subnav */ + .subhead .nav { + padding: 0; + background: none; + } + .subhead .nav > li { + float: none; + } + .subhead .nav li + li a { + border-top: 1px solid #eee; + } + /* Don't space out quick links so much */ .quick-links { margin: 40px 0 0; diff --git a/lib/forms.less b/lib/forms.less index bf3dbe64c8..be53c60cbc 100644 --- a/lib/forms.less +++ b/lib/forms.less @@ -470,6 +470,7 @@ select:focus:required:invalid { // -------------------------- .form-horizontal { + // Increase spacing between groups .control-group { margin-bottom: @baseLineHeight; } From cd5ffbe39626303a395448a6c9a507f3ad04ff5e Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Mon, 23 Jan 2012 13:50:55 -0800 Subject: [PATCH 8/8] fix up the modals in responsive a bit --- bootstrap.css | 3 ++- bootstrap.min.css | 2 +- lib/responsive.less | 3 ++- 3 files changed, 5 insertions(+), 3 deletions(-) diff --git a/bootstrap.css b/bootstrap.css index 6f2a8c7518..91c4ca7012 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: Mon Jan 23 12:20:49 PST 2012 + * Date: Mon Jan 23 13:48:03 PST 2012 */ article, aside, @@ -3068,6 +3068,7 @@ a.thumbnail:hover { left: 20px; right: 20px; width: auto; + margin: 0; } .modal.fade.in { top: auto; diff --git a/bootstrap.min.css b/bootstrap.min.css index 3f6c6a825c..733ad5d11e 100644 --- a/bootstrap.min.css +++ b/bootstrap.min.css @@ -539,4 +539,4 @@ a.thumbnail:hover{border-color:#0088cc;-webkit-box-shadow:0 1px 4px rgba(0, 105, .show{display:block;} .invisible{visibility:hidden;} .hidden{display:none;visibility:hidden;} -@media (max-width: 480px){.navbar .nav{position:absolute;top:0;left:0;width:180px;padding-top:40px;list-style:none;} .navbar .nav,.navbar .nav>li:last-child a{-webkit-border-radius:0 0 4px 0;-moz-border-radius:0 0 4px 0;border-radius:0 0 4px 0;} .navbar .nav>li{float:none;display:none;} .navbar .nav>li>a{float:none;background-color:#222;} .navbar .nav>.active{display:block;position:absolute;top:0;left:0;} .navbar .nav>.active>a{background-color:transparent;} .navbar .nav>.active>a:hover{background-color:#333;} .navbar .nav>.active>a:after{display:inline-block;width:0;height:0;margin-top:8px;margin-left:6px;text-indent:-99999px;vertical-align:top;border-left:4px solid transparent;border-right:4px solid transparent;border-top:4px solid #ffffff;filter:alpha(opacity=100);-moz-opacity:1;opacity:1;content:"↓";} .navbar .nav:hover>li{display:block;} .navbar .nav:hover>li>a:hover{background-color:#333;} .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;} .modal{position:fixed;top:20px;left:20px;right:20px;width:auto;}.modal.fade.in{top:auto;} .modal-header .close{padding:10px;}}@media (max-width: 768px){.navbar-fixed{position:absolute;} .navbar-fixed .nav{float:none;} .container{width:auto;padding:0 20px;} .row{margin-left:0;} .row>[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 (max-width: 480px){.navbar .nav{position:absolute;top:0;left:0;width:180px;padding-top:40px;list-style:none;} .navbar .nav,.navbar .nav>li:last-child a{-webkit-border-radius:0 0 4px 0;-moz-border-radius:0 0 4px 0;border-radius:0 0 4px 0;} .navbar .nav>li{float:none;display:none;} .navbar .nav>li>a{float:none;background-color:#222;} .navbar .nav>.active{display:block;position:absolute;top:0;left:0;} .navbar .nav>.active>a{background-color:transparent;} .navbar .nav>.active>a:hover{background-color:#333;} .navbar .nav>.active>a:after{display:inline-block;width:0;height:0;margin-top:8px;margin-left:6px;text-indent:-99999px;vertical-align:top;border-left:4px solid transparent;border-right:4px solid transparent;border-top:4px solid #ffffff;filter:alpha(opacity=100);-moz-opacity:1;opacity:1;content:"↓";} .navbar .nav:hover>li{display:block;} .navbar .nav:hover>li>a:hover{background-color:#333;} .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;} .modal{position:fixed;top:20px;left:20px;right:20px;width:auto;margin:0;}.modal.fade.in{top:auto;} .modal-header .close{padding:10px;}}@media (max-width: 768px){.navbar-fixed{position:absolute;} .navbar-fixed .nav{float:none;} .container{width:auto;padding:0 20px;} .row{margin-left:0;} .row>[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;}} diff --git a/lib/responsive.less b/lib/responsive.less index f5c23df3cd..416a8da7b7 100644 --- a/lib/responsive.less +++ b/lib/responsive.less @@ -97,11 +97,12 @@ // Modals .modal { - position: fixed; + position: absolute; top: 20px; left: 20px; right: 20px; width: auto; + margin: 0; &.fade.in { top: auto; } } .modal-header .close {