diff options
Diffstat (limited to 'docs')
-rw-r--r-- | docs/assets/css/bootstrap-responsive.css | 11 | ||||
-rw-r--r-- | docs/assets/css/bootstrap.css | 231 | ||||
-rw-r--r-- | docs/assets/css/docs.css | 5 | ||||
-rw-r--r-- | docs/assets/js/bootstrap-tooltip.js | 4 | ||||
-rw-r--r-- | docs/assets/js/bootstrap.js | 5 | ||||
-rw-r--r-- | docs/assets/js/bootstrap.min.js | 2 | ||||
-rw-r--r-- | docs/base-css.html | 15 | ||||
-rw-r--r-- | docs/components.html | 21 | ||||
-rw-r--r-- | docs/download.html | 7 | ||||
-rw-r--r-- | docs/examples.html | 5 | ||||
-rw-r--r-- | docs/index.html | 9 | ||||
-rw-r--r-- | docs/javascript.html | 97 | ||||
-rw-r--r-- | docs/less.html | 993 | ||||
-rw-r--r-- | docs/scaffolding.html | 56 | ||||
-rw-r--r-- | docs/templates/layout.mustache | 17 | ||||
-rw-r--r-- | docs/templates/pages/base-css.mustache | 10 | ||||
-rw-r--r-- | docs/templates/pages/components.mustache | 18 | ||||
-rw-r--r-- | docs/templates/pages/download.mustache | 2 | ||||
-rw-r--r-- | docs/templates/pages/index.mustache | 4 | ||||
-rw-r--r-- | docs/templates/pages/javascript.mustache | 92 | ||||
-rw-r--r-- | docs/templates/pages/less.mustache | 988 | ||||
-rw-r--r-- | docs/templates/pages/scaffolding.mustache | 51 | ||||
-rw-r--r-- | docs/upgrading.html | 5 |
23 files changed, 1336 insertions, 1312 deletions
diff --git a/docs/assets/css/bootstrap-responsive.css b/docs/assets/css/bootstrap-responsive.css index 7f669d573f..cf8aa011c4 100644 --- a/docs/assets/css/bootstrap-responsive.css +++ b/docs/assets/css/bootstrap-responsive.css @@ -683,11 +683,18 @@ body { padding-top: 0; } - .navbar-fixed-top { + .navbar-fixed-top, + .navbar-fixed-bottom { position: static; + } + .navbar-fixed-top { margin-bottom: 18px; } - .navbar-fixed-top .navbar-inner { + .navbar-fixed-bottom { + margin-top: 18px; + } + .navbar-fixed-top .navbar-inner, + .navbar-fixed-bottom .navbar-inner { padding: 5px; } .navbar .container { diff --git a/docs/assets/css/bootstrap.css b/docs/assets/css/bootstrap.css index 09e2833dcd..7902e6a72f 100644 --- a/docs/assets/css/bootstrap.css +++ b/docs/assets/css/bootstrap.css @@ -73,6 +73,10 @@ img { -ms-interpolation-mode: bicubic; } +#map_canvas img { + max-width: none; +} + button, input, select, @@ -418,9 +422,6 @@ a:hover { p { margin: 0 0 9px; - font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; - font-size: 13px; - line-height: 18px; } p small { @@ -603,7 +604,7 @@ em { abbr[title] { cursor: help; - border-bottom: 1px dotted #ddd; + border-bottom: 1px dotted #999999; } abbr.initialism { @@ -740,7 +741,7 @@ legend { line-height: 36px; color: #333333; border: 0; - border-bottom: 1px solid #eee; + border-bottom: 1px solid #e5e5e5; } legend small { @@ -768,79 +769,119 @@ textarea { label { display: block; margin-bottom: 5px; - color: #333333; } -input, -textarea, select, +textarea, +input[type="text"], +input[type="password"], +input[type="datetime"], +input[type="datetime-local"], +input[type="date"], +input[type="month"], +input[type="time"], +input[type="week"], +input[type="number"], +input[type="email"], +input[type="url"], +input[type="search"], +input[type="tel"], +input[type="color"], .uneditable-input { display: inline-block; - width: 210px; height: 18px; padding: 4px; margin-bottom: 9px; font-size: 13px; line-height: 18px; color: #555555; +} + +input, +textarea { + width: 210px; +} + +textarea { + height: auto; +} + +textarea, +input[type="text"], +input[type="password"], +input[type="datetime"], +input[type="datetime-local"], +input[type="date"], +input[type="month"], +input[type="time"], +input[type="week"], +input[type="number"], +input[type="email"], +input[type="url"], +input[type="search"], +input[type="tel"], +input[type="color"], +.uneditable-input { background-color: #ffffff; border: 1px solid #cccccc; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; + -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); + -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); + box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); + -webkit-transition: border linear 0.2s, box-shadow linear 0.2s; + -moz-transition: border linear 0.2s, box-shadow linear 0.2s; + -ms-transition: border linear 0.2s, box-shadow linear 0.2s; + -o-transition: border linear 0.2s, box-shadow linear 0.2s; + transition: border linear 0.2s, box-shadow linear 0.2s; } -.uneditable-textarea { - width: auto; - height: auto; -} +textarea:focus, +input[type="text"]:focus, +input[type="password"]:focus, +input[type="datetime"]:focus, +input[type="datetime-local"]:focus, +input[type="date"]:focus, +input[type="month"]:focus, +input[type="time"]:focus, +input[type="week"]:focus, +input[type="number"]:focus, +input[type="email"]:focus, +input[type="url"]:focus, +input[type="search"]:focus, +input[type="tel"]:focus, +input[type="color"]:focus, +.uneditable-input:focus { + border-color: rgba(82, 168, 236, 0.8); + outline: 0; + outline: thin dotted \9; + /* IE6-9 */ -label input, -label textarea, -label select { - display: block; + -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6); + -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6); + box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6); } -input[type="image"], -input[type="checkbox"], -input[type="radio"] { - width: auto; - height: auto; - padding: 0; +input[type="radio"], +input[type="checkbox"] { margin: 3px 0; *margin-top: 0; /* IE7 */ line-height: normal; cursor: pointer; - background-color: transparent; - border: 0 \9; - /* IE9 and down */ - - -webkit-border-radius: 0; - -moz-border-radius: 0; - border-radius: 0; -} - -input[type="image"] { - border: 0; } -input[type="file"] { +input[type="submit"], +input[type="reset"], +input[type="button"], +input[type="radio"], +input[type="checkbox"] { width: auto; - padding: initial; - line-height: initial; - background-color: #ffffff; - background-color: initial; - border: initial; - -webkit-box-shadow: none; - -moz-box-shadow: none; - box-shadow: none; } -input[type="button"], -input[type="reset"], -input[type="submit"] { +.uneditable-textarea { width: auto; height: auto; } @@ -856,13 +897,9 @@ input[type="file"] { line-height: 28px; } -input[type="file"] { - line-height: 18px \9; -} - select { width: 220px; - background-color: #ffffff; + border: 1px solid #bbb; } select[multiple], @@ -870,18 +907,13 @@ select[size] { height: auto; } -input[type="image"] { - -webkit-box-shadow: none; - -moz-box-shadow: none; - box-shadow: none; -} - -textarea { - height: auto; -} - -input[type="hidden"] { - display: none; +select:focus, +input[type="file"]:focus, +input[type="radio"]:focus, +input[type="checkbox"]:focus { + outline: thin dotted #333; + outline: 5px auto -webkit-focus-ring-color; + outline-offset: -2px; } .radio, @@ -914,42 +946,6 @@ input[type="hidden"] { margin-left: 10px; } -input, -textarea { - -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); - -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); - box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); - -webkit-transition: border linear 0.2s, box-shadow linear 0.2s; - -moz-transition: border linear 0.2s, box-shadow linear 0.2s; - -ms-transition: border linear 0.2s, box-shadow linear 0.2s; - -o-transition: border linear 0.2s, box-shadow linear 0.2s; - transition: border linear 0.2s, box-shadow linear 0.2s; -} - -input:focus, -textarea:focus { - border-color: rgba(82, 168, 236, 0.8); - outline: 0; - outline: thin dotted \9; - /* IE6-9 */ - - -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6); - -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6); - box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6); -} - -input[type="file"]:focus, -input[type="radio"]:focus, -input[type="checkbox"]:focus, -select:focus { - outline: thin dotted #333; - outline: 5px auto -webkit-focus-ring-color; - outline-offset: -2px; - -webkit-box-shadow: none; - -moz-box-shadow: none; - box-shadow: none; -} - .input-mini { width: 60px; } @@ -986,6 +982,15 @@ textarea[class*="span"], margin-left: 0; } +.input-append input[class*="span"], +.input-append .uneditable-input[class*="span"], +.input-prepend input[class*="span"], +.input-prepend .uneditable-input[class*="span"], +.row-fluid .input-prepend [class*="span"], +.row-fluid .input-append [class*="span"] { + display: inline-block; +} + input, textarea, .uneditable-input { @@ -1088,6 +1093,8 @@ input[type="checkbox"][readonly] { color: #c09853; } +.control-group.warning .checkbox, +.control-group.warning .radio, .control-group.warning input, .control-group.warning select, .control-group.warning textarea { @@ -1095,6 +1102,8 @@ input[type="checkbox"][readonly] { border-color: #c09853; } +.control-group.warning .checkbox:focus, +.control-group.warning .radio:focus, .control-group.warning input:focus, .control-group.warning select:focus, .control-group.warning textarea:focus { @@ -1117,6 +1126,8 @@ input[type="checkbox"][readonly] { color: #b94a48; } +.control-group.error .checkbox, +.control-group.error .radio, .control-group.error input, .control-group.error select, .control-group.error textarea { @@ -1124,6 +1135,8 @@ input[type="checkbox"][readonly] { border-color: #b94a48; } +.control-group.error .checkbox:focus, +.control-group.error .radio:focus, .control-group.error input:focus, .control-group.error select:focus, .control-group.error textarea:focus { @@ -1146,6 +1159,8 @@ input[type="checkbox"][readonly] { color: #468847; } +.control-group.success .checkbox, +.control-group.success .radio, .control-group.success input, .control-group.success select, .control-group.success textarea { @@ -1153,6 +1168,8 @@ input[type="checkbox"][readonly] { border-color: #468847; } +.control-group.success .checkbox:focus, +.control-group.success .radio:focus, .control-group.success input:focus, .control-group.success select:focus, .control-group.success textarea:focus { @@ -1190,7 +1207,7 @@ select:focus:required:invalid:focus { margin-top: 18px; margin-bottom: 18px; background-color: #f5f5f5; - border-top: 1px solid #ddd; + border-top: 1px solid #e5e5e5; *zoom: 1; } @@ -1219,6 +1236,10 @@ select:focus:required:invalid:focus { color: #999999; } +:-ms-input-placeholder { + color: #999999; +} + ::-webkit-input-placeholder { color: #999999; } @@ -2433,11 +2454,11 @@ table .span24 { *z-index: 1000; } -.open .dropdown-menu { +.open > .dropdown-menu { display: block; } -.pull-right .dropdown-menu { +.pull-right > .dropdown-menu { right: 0; left: auto; } @@ -2499,7 +2520,6 @@ table .span24 { .fade { opacity: 0; - filter: alpha(opacity=0); -webkit-transition: opacity 0.15s linear; -moz-transition: opacity 0.15s linear; -ms-transition: opacity 0.15s linear; @@ -2509,7 +2529,6 @@ table .span24 { .fade.in { opacity: 1; - filter: alpha(opacity=100); } .collapse { @@ -3701,6 +3720,10 @@ input[type="submit"].btn.btn-mini { color: #cccccc; } +.navbar-search .search-query:-ms-input-placeholder { + color: #cccccc; +} + .navbar-search .search-query::-webkit-input-placeholder { color: #cccccc; } diff --git a/docs/assets/css/docs.css b/docs/assets/css/docs.css index b7e0c8dbfa..92a4ec8e67 100644 --- a/docs/assets/css/docs.css +++ b/docs/assets/css/docs.css @@ -649,6 +649,11 @@ form.well { margin-top: 18px; } + /* icons */ + .marketing .bs-icon { + margin: 0; + } + /* Adjust the jumbotron */ .jumbotron h1, .jumbotron p { diff --git a/docs/assets/js/bootstrap-tooltip.js b/docs/assets/js/bootstrap-tooltip.js index 577ead48b5..6ff2b47086 100644 --- a/docs/assets/js/bootstrap-tooltip.js +++ b/docs/assets/js/bootstrap-tooltip.js @@ -84,9 +84,9 @@ , leave: function (e) { var self = $(e.currentTarget)[this.type](this._options).data(this.type) + if (this.timeout) clearTimeout(this.timeout) if (!self.options.delay || !self.options.delay.hide) return self.hide() - clearTimeout(this.timeout) self.hoverState = 'out' this.timeout = setTimeout(function() { if (self.hoverState == 'out') self.hide() @@ -272,4 +272,4 @@ , delay: 0 } -}(window.jQuery);
\ No newline at end of file +}(window.jQuery); diff --git a/docs/assets/js/bootstrap.js b/docs/assets/js/bootstrap.js index 7244954107..7b267fc23f 100644 --- a/docs/assets/js/bootstrap.js +++ b/docs/assets/js/bootstrap.js @@ -968,9 +968,9 @@ , leave: function (e) { var self = $(e.currentTarget)[this.type](this._options).data(this.type) + if (this.timeout) clearTimeout(this.timeout) if (!self.options.delay || !self.options.delay.hide) return self.hide() - clearTimeout(this.timeout) self.hoverState = 'out' this.timeout = setTimeout(function() { if (self.hoverState == 'out') self.hide() @@ -1156,7 +1156,8 @@ , delay: 0 } -}(window.jQuery);/* =========================================================== +}(window.jQuery); +/* =========================================================== * bootstrap-popover.js v2.0.3 * http://twitter.github.com/bootstrap/javascript.html#popovers * =========================================================== diff --git a/docs/assets/js/bootstrap.min.js b/docs/assets/js/bootstrap.min.js index 8c06421e10..d5ccdee2fe 100644 --- a/docs/assets/js/bootstrap.min.js +++ b/docs/assets/js/bootstrap.min.js @@ -3,4 +3,4 @@ * Copyright 2012 Twitter, Inc. * http://www.apache.org/licenses/LICENSE-2.0.txt */ -!function(a){a(function(){"use strict",a.support.transition=function(){var a=function(){var a=document.createElement("bootstrap"),b={WebkitTransition:"webkitTransitionEnd",MozTransition:"transitionend",OTransition:"oTransitionEnd",msTransition:"MSTransitionEnd",transition:"transitionend"},c;for(c in b)if(a.style[c]!==undefined)return b[c]}();return a&&{end:a}}()})}(window.jQuery),!function(a){"use strict";var b='[data-dismiss="alert"]',c=function(c){a(c).on("click",b,this.close)};c.prototype.close=function(b){function f(){e.trigger("closed").remove()}var c=a(this),d=c.attr("data-target"),e;d||(d=c.attr("href"),d=d&&d.replace(/.*(?=#[^\s]*$)/,"")),e=a(d),b&&b.preventDefault(),e.length||(e=c.hasClass("alert")?c:c.parent()),e.trigger(b=a.Event("close"));if(b.isDefaultPrevented())return;e.removeClass("in"),a.support.transition&&e.hasClass("fade")?e.on(a.support.transition.end,f):f()},a.fn.alert=function(b){return this.each(function(){var d=a(this),e=d.data("alert");e||d.data("alert",e=new c(this)),typeof b=="string"&&e[b].call(d)})},a.fn.alert.Constructor=c,a(function(){a("body").on("click.alert.data-api",b,c.prototype.close)})}(window.jQuery),!function(a){"use strict";var b=function(b,c){this.$element=a(b),this.options=a.extend({},a.fn.button.defaults,c)};b.prototype.setState=function(a){var b="disabled",c=this.$element,d=c.data(),e=c.is("input")?"val":"html";a+="Text",d.resetText||c.data("resetText",c[e]()),c[e](d[a]||this.options[a]),setTimeout(function(){a=="loadingText"?c.addClass(b).attr(b,b):c.removeClass(b).removeAttr(b)},0)},b.prototype.toggle=function(){var a=this.$element.parent('[data-toggle="buttons-radio"]');a&&a.find(".active").removeClass("active"),this.$element.toggleClass("active")},a.fn.button=function(c){return this.each(function(){var d=a(this),e=d.data("button"),f=typeof c=="object"&&c;e||d.data("button",e=new b(this,f)),c=="toggle"?e.toggle():c&&e.setState(c)})},a.fn.button.defaults={loadingText:"loading..."},a.fn.button.Constructor=b,a(function(){a("body").on("click.button.data-api","[data-toggle^=button]",function(b){var c=a(b.target);c.hasClass("btn")||(c=c.closest(".btn")),c.button("toggle")})})}(window.jQuery),!function(a){"use strict";var b=function(b,c){this.$element=a(b),this.options=c,this.options.slide&&this.slide(this.options.slide),this.options.pause=="hover"&&this.$element.on("mouseenter",a.proxy(this.pause,this)).on("mouseleave",a.proxy(this.cycle,this))};b.prototype={cycle:function(b){return b||(this.paused=!1),this.options.interval&&!this.paused&&(this.interval=setInterval(a.proxy(this.next,this),this.options.interval)),this},to:function(b){var c=this.$element.find(".active"),d=c.parent().children(),e=d.index(c),f=this;if(b>d.length-1||b<0)return;return this.sliding?this.$element.one("slid",function(){f.to(b)}):e==b?this.pause().cycle():this.slide(b>e?"next":"prev",a(d[b]))},pause:function(a){return a||(this.paused=!0),clearInterval(this.interval),this.interval=null,this},next:function(){if(this.sliding)return;return this.slide("next")},prev:function(){if(this.sliding)return;return this.slide("prev")},slide:function(b,c){var d=this.$element.find(".active"),e=c||d[b](),f=this.interval,g=b=="next"?"left":"right",h=b=="next"?"first":"last",i=this,j=a.Event("slide");this.sliding=!0,f&&this.pause(),e=e.length?e:this.$element.find(".item")[h]();if(e.hasClass("active"))return;if(a.support.transition&&this.$element.hasClass("slide")){this.$element.trigger(j);if(j.isDefaultPrevented())return;e.addClass(b),e[0].offsetWidth,d.addClass(g),e.addClass(g),this.$element.one(a.support.transition.end,function(){e.removeClass([b,g].join(" ")).addClass("active"),d.removeClass(["active",g].join(" ")),i.sliding=!1,setTimeout(function(){i.$element.trigger("slid")},0)})}else{this.$element.trigger(j);if(j.isDefaultPrevented())return;d.removeClass("active"),e.addClass("active"),this.sliding=!1,this.$element.trigger("slid")}return f&&this.cycle(),this}},a.fn.carousel=function(c){return this.each(function(){var d=a(this),e=d.data("carousel"),f=a.extend({},a.fn.carousel.defaults,typeof c=="object"&&c);e||d.data("carousel",e=new b(this,f)),typeof c=="number"?e.to(c):typeof c=="string"||(c=f.slide)?e[c]():f.interval&&e.cycle()})},a.fn.carousel.defaults={interval:5e3,pause:"hover"},a.fn.carousel.Constructor=b,a(function(){a("body").on("click.carousel.data-api","[data-slide]",function(b){var c=a(this),d,e=a(c.attr("data-target")||(d=c.attr("href"))&&d.replace(/.*(?=#[^\s]+$)/,"")),f=!e.data("modal")&&a.extend({},e.data(),c.data());e.carousel(f),b.preventDefault()})})}(window.jQuery),!function(a){"use strict";var b=function(b,c){this.$element=a(b),this.options=a.extend({},a.fn.collapse.defaults,c),this.options.parent&&(this.$parent=a(this.options.parent)),this.options.toggle&&this.toggle()};b.prototype={constructor:b,dimension:function(){var a=this.$element.hasClass("width");return a?"width":"height"},show:function(){var b,c,d,e;if(this.transitioning)return;b=this.dimension(),c=a.camelCase(["scroll",b].join("-")),d=this.$parent&&this.$parent.find("> .accordion-group > .in");if(d&&d.length){e=d.data("collapse");if(e&&e.transitioning)return;d.collapse("hide"),e||d.data("collapse",null)}this.$element[b](0),this.transition("addClass",a.Event("show"),"shown"),this.$element[b](this.$element[0][c])},hide:function(){var b;if(this.transitioning)return;b=this.dimension(),this.reset(this.$element[b]()),this.transition("removeClass",a.Event("hide"),"hidden"),this.$element[b](0)},reset:function(a){var b=this.dimension();return this.$element.removeClass("collapse")[b](a||"auto")[0].offsetWidth,this.$element[a!==null?"addClass":"removeClass"]("collapse"),this},transition:function(b,c,d){var e=this,f=function(){c.type=="show"&&e.reset(),e.transitioning=0,e.$element.trigger(d)};this.$element.trigger(c);if(c.isDefaultPrevented())return;this.transitioning=1,this.$element[b]("in"),a.support.transition&&this.$element.hasClass("collapse")?this.$element.one(a.support.transition.end,f):f()},toggle:function(){this[this.$element.hasClass("in")?"hide":"show"]()}},a.fn.collapse=function(c){return this.each(function(){var d=a(this),e=d.data("collapse"),f=typeof c=="object"&&c;e||d.data("collapse",e=new b(this,f)),typeof c=="string"&&e[c]()})},a.fn.collapse.defaults={toggle:!0},a.fn.collapse.Constructor=b,a(function(){a("body").on("click.collapse.data-api","[data-toggle=collapse]",function(b){var c=a(this),d,e=c.attr("data-target")||b.preventDefault()||(d=c.attr("href"))&&d.replace(/.*(?=#[^\s]+$)/,""),f=a(e).data("collapse")?"toggle":c.data();a(e).collapse(f)})})}(window.jQuery),!function(a){function d(){a(b).parent().removeClass("open")}"use strict";var b='[data-toggle="dropdown"]',c=function(b){var c=a(b).on("click.dropdown.data-api",this.toggle);a("html").on("click.dropdown.data-api",function(){c.parent().removeClass("open")})};c.prototype={constructor:c,toggle:function(b){var c=a(this),e,f,g;if(c.is(".disabled, :disabled"))return;return f=c.attr("data-target"),f||(f=c.attr("href"),f=f&&f.replace(/.*(?=#[^\s]*$)/,"")),e=a(f),e.length||(e=c.parent()),g=e.hasClass("open"),d(),g||e.toggleClass("open"),!1}},a.fn.dropdown=function(b){return this.each(function(){var d=a(this),e=d.data("dropdown");e||d.data("dropdown",e=new c(this)),typeof b=="string"&&e[b].call(d)})},a.fn.dropdown.Constructor=c,a(function(){a("html").on("click.dropdown.data-api",d),a("body").on("click.dropdown",".dropdown form",function(a){a.stopPropagation()}).on("click.dropdown.data-api",b,c.prototype.toggle)})}(window.jQuery),!function(a){function c(){var b=this,c=setTimeout(function(){b.$element.off(a.support.transition.end),d.call(b)},500);this.$element.one(a.support.transition.end,function(){clearTimeout(c),d.call(b)})}function d(a){this.$element.hide().trigger("hidden"),e.call(this)}function e(b){var c=this,d=this.$element.hasClass("fade")?"fade":"";if(this.isShown&&this.options.backdrop){var e=a.support.transition&&d;this.$backdrop=a('<div class="modal-backdrop '+d+'" />').appendTo(document.body),this.options.backdrop!="static"&&this.$backdrop.click(a.proxy(this.hide,this)),e&&this.$backdrop[0].offsetWidth,this.$backdrop.addClass("in"),e?this.$backdrop.one(a.support.transition.end,b):b()}else!this.isShown&&this.$backdrop?(this.$backdrop.removeClass("in"),a.support.transition&&this.$element.hasClass("fade")?this.$backdrop.one(a.support.transition.end,a.proxy(f,this)):f.call(this)):b&&b()}function f(){this.$backdrop.remove(),this.$backdrop=null}function g(){var b=this;this.isShown&&this.options.keyboard?a(document).on("keyup.dismiss.modal",function(a){a.which==27&&b.hide()}):this.isShown||a(document).off("keyup.dismiss.modal")}"use strict";var b=function(b,c){this.options=c,this.$element=a(b).delegate('[data-dismiss="modal"]',"click.dismiss.modal",a.proxy(this.hide,this))};b.prototype={constructor:b,toggle:function(){return this[this.isShown?"hide":"show"]()},show:function(){var b=this,c=a.Event("show");this.$element.trigger(c);if(this.isShown||c.isDefaultPrevented())return;a("body").addClass("modal-open"),this.isShown=!0,g.call(this),e.call(this,function(){var c=a.support.transition&&b.$element.hasClass("fade");b.$element.parent().length||b.$element.appendTo(document.body),b.$element.show(),c&&b.$element[0].offsetWidth,b.$element.addClass("in"),c?b.$element.one(a.support.transition.end,function(){b.$element.trigger("shown")}):b.$element.trigger("shown")})},hide:function(b){b&&b.preventDefault();var e=this;b=a.Event("hide"),this.$element.trigger(b);if(!this.isShown||b.isDefaultPrevented())return;this.isShown=!1,a("body").removeClass("modal-open"),g.call(this),this.$element.removeClass("in"),a.support.transition&&this.$element.hasClass("fade")?c.call(this):d.call(this)}},a.fn.modal=function(c){return this.each(function(){var d=a(this),e=d.data("modal"),f=a.extend({},a.fn.modal.defaults,d.data(),typeof c=="object"&&c);e||d.data("modal",e=new b(this,f)),typeof c=="string"?e[c]():f.show&&e.show()})},a.fn.modal.defaults={backdrop:!0,keyboard:!0,show:!0},a.fn.modal.Constructor=b,a(function(){a("body").on("click.modal.data-api",'[data-toggle="modal"]',function(b){var c=a(this),d,e=a(c.attr("data-target")||(d=c.attr("href"))&&d.replace(/.*(?=#[^\s]+$)/,"")),f=e.data("modal")?"toggle":a.extend({},e.data(),c.data());b.preventDefault(),e.modal(f)})})}(window.jQuery),!function(a){"use strict";var b=function(a,b){this.init("tooltip",a,b)};b.prototype={constructor:b,init:function(b,c,d){var e,f;this.type=b,this.$element=a(c),this.options=this.getOptions(d),this.enabled=!0,this.options.trigger!="manual"&&(e=this.options.trigger=="hover"?"mouseenter":"focus",f=this.options.trigger=="hover"?"mouseleave":"blur",this.$element.on(e,this.options.selector,a.proxy(this.enter,this)),this.$element.on(f,this.options.selector,a.proxy(this.leave,this))),this.options.selector?this._options=a.extend({},this.options,{trigger:"manual",selector:""}):this.fixTitle()},getOptions:function(b){return b=a.extend({},a.fn[this.type].defaults,b,this.$element.data()),b.delay&&typeof b.delay=="number"&&(b.delay={show:b.delay,hide:b.delay}),b},enter:function(b){var c=a(b.currentTarget)[this.type](this._options).data(this.type);if(!c.options.delay||!c.options.delay.show)return c.show();clearTimeout(this.timeout),c.hoverState="in",this.timeout=setTimeout(function(){c.hoverState=="in"&&c.show()},c.options.delay.show)},leave:function(b){var c=a(b.currentTarget)[this.type](this._options).data(this.type);if(!c.options.delay||!c.options.delay.hide)return c.hide();clearTimeout(this.timeout),c.hoverState="out",this.timeout=setTimeout(function(){c.hoverState=="out"&&c.hide()},c.options.delay.hide)},show:function(){var a,b,c,d,e,f,g;if(this.hasContent()&&this.enabled){a=this.tip(),this.setContent(),this.options.animation&&a.addClass("fade"),f=typeof this.options.placement=="function"?this.options.placement.call(this,a[0],this.$element[0]):this.options.placement,b=/in/.test(f),a.remove().css({top:0,left:0,display:"block"}).appendTo(b?this.$element:document.body),c=this.getPosition(b),d=a[0].offsetWidth,e=a[0].offsetHeight;switch(b?f.split(" ")[1]:f){case"bottom":g={top:c.top+c.height,left:c.left+c.width/2-d/2};break;case"top":g={top:c.top-e,left:c.left+c.width/2-d/2};break;case"left":g={top:c.top+c.height/2-e/2,left:c.left-d};break;case"right":g={top:c.top+c.height/2-e/2,left:c.left+c.width}}a.css(g).addClass(f).addClass("in")}},isHTML:function(a){return typeof a!="string"||a.charAt(0)==="<"&&a.charAt(a.length-1)===">"&&a.length>=3||/^(?:[^<]*<[\w\W]+>[^>]*$)/.exec(a)},setContent:function(){var a=this.tip(),b=this.getTitle();a.find(".tooltip-inner")[this.isHTML(b)?"html":"text"](b),a.removeClass("fade in top bottom left right")},hide:function(){function d(){var b=setTimeout(function(){c.off(a.support.transition.end).remove()},500);c.one(a.support.transition.end,function(){clearTimeout(b),c.remove()})}var b=this,c=this.tip();c.removeClass("in"),a.support.transition&&this.$tip.hasClass("fade")?d():c.remove()},fixTitle:function(){var a=this.$element;(a.attr("title")||typeof a.attr("data-original-title")!="string")&&a.attr("data-original-title",a.attr("title")||"").removeAttr("title")},hasContent:function(){return this.getTitle()},getPosition:function(b){return a.extend({},b?{top:0,left:0}:this.$element.offset(),{width:this.$element[0].offsetWidth,height:this.$element[0].offsetHeight})},getTitle:function(){var a,b=this.$element,c=this.options;return a=b.attr("data-original-title")||(typeof c.title=="function"?c.title.call(b[0]):c.title),a},tip:function(){return this.$tip=this.$tip||a(this.options.template)},validate:function(){this.$element[0].parentNode||(this.hide(),this.$element=null,this.options=null)},enable:function(){this.enabled=!0},disable:function(){this.enabled=!1},toggleEnabled:function(){this.enabled=!this.enabled},toggle:function(){this[this.tip().hasClass("in")?"hide":"show"]()}},a.fn.tooltip=function(c){return this.each(function(){var d=a(this),e=d.data("tooltip"),f=typeof c=="object"&&c;e||d.data("tooltip",e=new b(this,f)),typeof c=="string"&&e[c]()})},a.fn.tooltip.Constructor=b,a.fn.tooltip.defaults={animation:!0,placement:"top",selector:!1,template:'<div class="tooltip"><div class="tooltip-arrow"></div><div class="tooltip-inner"></div></div>',trigger:"hover",title:"",delay:0}}(window.jQuery),!function(a){"use strict";var b=function(a,b){this.init("popover",a,b)};b.prototype=a.extend({},a.fn.tooltip.Constructor.prototype,{constructor:b,setContent:function(){var a=this.tip(),b=this.getTitle(),c=this.getContent();a.find(".popover-title")[this.isHTML(b)?"html":"text"](b),a.find(".popover-content > *")[this.isHTML(c)?"html":"text"](c),a.removeClass("fade top bottom left right in")},hasContent:function(){return this.getTitle()||this.getContent()},getContent:function(){var a,b=this.$element,c=this.options;return a=b.attr("data-content")||(typeof c.content=="function"?c.content.call(b[0]):c.content),a},tip:function(){return this.$tip||(this.$tip=a(this.options.template)),this.$tip}}),a.fn.popover=function(c){return this.each(function(){var d=a(this),e=d.data("popover"),f=typeof c=="object"&&c;e||d.data("popover",e=new b(this,f)),typeof c=="string"&&e[c]()})},a.fn.popover.Constructor=b,a.fn.popover.defaults=a.extend({},a.fn.tooltip.defaults,{placement:"right",content:"",template:'<div class="popover"><div class="arrow"></div><div class="popover-inner"><h3 class="popover-title"></h3><div class="popover-content"><p></p></div></div></div>'})}(window.jQuery),!function(a){function b(b,c){var d=a.proxy(this.process,this),e=a(b).is("body")?a(window):a(b),f;this.options=a.extend({},a.fn.scrollspy.defaults,c),this.$scrollElement=e.on("scroll.scroll.data-api",d),this.selector=(this.options.target||(f=a(b).attr("href"))&&f.replace(/.*(?=#[^\s]+$)/,"")||"")+" .nav li > a",this.$body=a("body"),this.refresh(),this.process()}"use strict",b.prototype={constructor:b,refresh:function(){var b=this,c;this.offsets=a([]),this.targets=a([]),c=this.$body.find(this.selector).map(function(){var b=a(this),c=b.data("target")||b.attr("href"),d=/^#\w/.test(c)&&a(c);return d&&c.length&&[[d.position().top,c]]||null}).sort(function(a,b){return a[0]-b[0]}).each(function(){b.offsets.push(this[0]),b.targets.push(this[1])})},process:function(){var a=this.$scrollElement.scrollTop()+this.options.offset,b=this.$scrollElement[0].scrollHeight||this.$body[0].scrollHeight,c=b-this.$scrollElement.height(),d=this.offsets,e=this.targets,f=this.activeTarget,g;if(a>=c)return f!=(g=e.last()[0])&&this.activate(g);for(g=d.length;g--;)f!=e[g]&&a>=d[g]&&(!d[g+1]||a<=d[g+1])&&this.activate(e[g])},activate:function(b){var c,d;this.activeTarget=b,a(this.selector).parent(".active").removeClass("active"),d=this.selector+'[data-target="'+b+'"],'+this.selector+'[href="'+b+'"]',c=a(d).parent("li").addClass("active"),c.parent(".dropdown-menu")&&(c=c.closest("li.dropdown").addClass("active")),c.trigger("activate")}},a.fn.scrollspy=function(c){return this.each(function(){var d=a(this),e=d.data("scrollspy"),f=typeof c=="object"&&c;e||d.data("scrollspy",e=new b(this,f)),typeof c=="string"&&e[c]()})},a.fn.scrollspy.Constructor=b,a.fn.scrollspy.defaults={offset:10},a(function(){a('[data-spy="scroll"]').each(function(){var b=a(this);b.scrollspy(b.data())})})}(window.jQuery),!function(a){"use strict";var b=function(b){this.element=a(b)};b.prototype={constructor:b,show:function(){var b=this.element,c=b.closest("ul:not(.dropdown-menu)"),d=b.attr("data-target"),e,f,g;d||(d=b.attr("href"),d=d&&d.replace(/.*(?=#[^\s]*$)/,""));if(b.parent("li").hasClass("active"))return;e=c.find(".active a").last()[0],g=a.Event("show",{relatedTarget:e}),b.trigger(g);if(g.isDefaultPrevented())return;f=a(d),this.activate(b.parent("li"),c),this.activate(f,f.parent(),function(){b.trigger({type:"shown",relatedTarget:e})})},activate:function(b,c,d){function g(){e.removeClass("active").find("> .dropdown-menu > .active").removeClass("active"),b.addClass("active"),f?(b[0].offsetWidth,b.addClass("in")):b.removeClass("fade"),b.parent(".dropdown-menu")&&b.closest("li.dropdown").addClass("active"),d&&d()}var e=c.find("> .active"),f=d&&a.support.transition&&e.hasClass("fade");f?e.one(a.support.transition.end,g):g(),e.removeClass("in")}},a.fn.tab=function(c){return this.each(function(){var d=a(this),e=d.data("tab");e||d.data("tab",e=new b(this)),typeof c=="string"&&e[c]()})},a.fn.tab.Constructor=b,a(function(){a("body").on("click.tab.data-api",'[data-toggle="tab"], [data-toggle="pill"]',function(b){b.preventDefault(),a(this).tab("show")})})}(window.jQuery),!function(a){"use strict";var b=function(b,c){this.$element=a(b),this.options=a.extend({},a.fn.typeahead.defaults,c),this.matcher=this.options.matcher||this.matcher,this.sorter=this.options.sorter||this.sorter,this.highlighter=this.options.highlighter||this.highlighter,this.updater=this.options.updater||this.updater,this.$menu=a(this.options.menu).appendTo("body"),this.source=this.options.source,this.shown=!1,this.listen()};b.prototype={constructor:b,select:function(){var a=this.$menu.find(".active").attr("data-value");return this.$element.val(this.updater(a)).change(),this.hide()},updater:function(a){return a},show:function(){var b=a.extend({},this.$element.offset(),{height:this.$element[0].offsetHeight});return this.$menu.css({top:b.top+b.height,left:b.left}),this.$menu.show(),this.shown=!0,this},hide:function(){return this.$menu.hide(),this.shown=!1,this},lookup:function(b){var c=this,d,e;return this.query=this.$element.val(),this.query?(d=a.grep(this.source,function(a){return c.matcher(a)}),d=this.sorter(d),d.length?this.render(d.slice(0,this.options.items)).show():this.shown?this.hide():this):this.shown?this.hide():this},matcher:function(a){return~a.toLowerCase().indexOf(this.query.toLowerCase())},sorter:function(a){var b=[],c=[],d=[],e;while(e=a.shift())e.toLowerCase().indexOf(this.query.toLowerCase())?~e.indexOf(this.query)?c.push(e):d.push(e):b.push(e);return b.concat(c,d)},highlighter:function(a){var b=this.query.replace(/[\-\[\]{}()*+?.,\\\^$|#\s]/g,"\\$&");return a.replace(new RegExp("("+b+")","ig"),function(a,b){return"<strong>"+b+"</strong>"})},render:function(b){var c=this;return b=a(b).map(function(b,d){return b=a(c.options.item).attr("data-value",d),b.find("a").html(c.highlighter(d)),b[0]}),b.first().addClass("active"),this.$menu.html(b),this},next:function(b){var c=this.$menu.find(".active").removeClass("active"),d=c.next();d.length||(d=a(this.$menu.find("li")[0])),d.addClass("active")},prev:function(a){var b=this.$menu.find(".active").removeClass("active"),c=b.prev();c.length||(c=this.$menu.find("li").last()),c.addClass("active")},listen:function(){this.$element.on("blur",a.proxy(this.blur,this)).on("keypress",a.proxy(this.keypress,this)).on("keyup",a.proxy(this.keyup,this)),(a.browser.webkit||a.browser.msie)&&this.$element.on("keydown",a.proxy(this.keypress,this)),this.$menu.on("click",a.proxy(this.click,this)).on("mouseenter","li",a.proxy(this.mouseenter,this))},keyup:function(a){switch(a.keyCode){case 40:case 38:break;case 9:case 13:if(!this.shown)return;this.select();break;case 27:if(!this.shown)return;this.hide();break;default:this.lookup()}a.stopPropagation(),a.preventDefault()},keypress:function(a){if(!this.shown)return;switch(a.keyCode){case 9:case 13:case 27:a.preventDefault();break;case 38:if(a.type!="keydown")break;a.preventDefault(),this.prev();break;case 40:if(a.type!="keydown")break;a.preventDefault(),this.next()}a.stopPropagation()},blur:function(a){var b=this;setTimeout(function(){b.hide()},150)},click:function(a){a.stopPropagation(),a.preventDefault(),this.select()},mouseenter:function(b){this.$menu.find(".active").removeClass("active"),a(b.currentTarget).addClass("active")}},a.fn.typeahead=function(c){return this.each(function(){var d=a(this),e=d.data("typeahead"),f=typeof c=="object"&&c;e||d.data("typeahead",e=new b(this,f)),typeof c=="string"&&e[c]()})},a.fn.typeahead.defaults={source:[],items:8,menu:'<ul class="typeahead dropdown-menu"></ul>',item:'<li><a href="#"></a></li>'},a.fn.typeahead.Constructor=b,a(function(){a("body").on("focus.typeahead.data-api",'[data-provide="typeahead"]',function(b){var c=a(this);if(c.data("typeahead"))return;b.preventDefault(),c.typeahead(c.data())})})}(window.jQuery);
\ No newline at end of file +!function(a){a(function(){"use strict",a.support.transition=function(){var a=function(){var a=document.createElement("bootstrap"),b={WebkitTransition:"webkitTransitionEnd",MozTransition:"transitionend",OTransition:"oTransitionEnd",msTransition:"MSTransitionEnd",transition:"transitionend"},c;for(c in b)if(a.style[c]!==undefined)return b[c]}();return a&&{end:a}}()})}(window.jQuery),!function(a){"use strict";var b='[data-dismiss="alert"]',c=function(c){a(c).on("click",b,this.close)};c.prototype.close=function(b){function f(){e.trigger("closed").remove()}var c=a(this),d=c.attr("data-target"),e;d||(d=c.attr("href"),d=d&&d.replace(/.*(?=#[^\s]*$)/,"")),e=a(d),b&&b.preventDefault(),e.length||(e=c.hasClass("alert")?c:c.parent()),e.trigger(b=a.Event("close"));if(b.isDefaultPrevented())return;e.removeClass("in"),a.support.transition&&e.hasClass("fade")?e.on(a.support.transition.end,f):f()},a.fn.alert=function(b){return this.each(function(){var d=a(this),e=d.data("alert");e||d.data("alert",e=new c(this)),typeof b=="string"&&e[b].call(d)})},a.fn.alert.Constructor=c,a(function(){a("body").on("click.alert.data-api",b,c.prototype.close)})}(window.jQuery),!function(a){"use strict";var b=function(b,c){this.$element=a(b),this.options=a.extend({},a.fn.button.defaults,c)};b.prototype.setState=function(a){var b="disabled",c=this.$element,d=c.data(),e=c.is("input")?"val":"html";a+="Text",d.resetText||c.data("resetText",c[e]()),c[e](d[a]||this.options[a]),setTimeout(function(){a=="loadingText"?c.addClass(b).attr(b,b):c.removeClass(b).removeAttr(b)},0)},b.prototype.toggle=function(){var a=this.$element.parent('[data-toggle="buttons-radio"]');a&&a.find(".active").removeClass("active"),this.$element.toggleClass("active")},a.fn.button=function(c){return this.each(function(){var d=a(this),e=d.data("button"),f=typeof c=="object"&&c;e||d.data("button",e=new b(this,f)),c=="toggle"?e.toggle():c&&e.setState(c)})},a.fn.button.defaults={loadingText:"loading..."},a.fn.button.Constructor=b,a(function(){a("body").on("click.button.data-api","[data-toggle^=button]",function(b){var c=a(b.target);c.hasClass("btn")||(c=c.closest(".btn")),c.button("toggle")})})}(window.jQuery),!function(a){"use strict";var b=function(b,c){this.$element=a(b),this.options=c,this.options.slide&&this.slide(this.options.slide),this.options.pause=="hover"&&this.$element.on("mouseenter",a.proxy(this.pause,this)).on("mouseleave",a.proxy(this.cycle,this))};b.prototype={cycle:function(b){return b||(this.paused=!1),this.options.interval&&!this.paused&&(this.interval=setInterval(a.proxy(this.next,this),this.options.interval)),this},to:function(b){var c=this.$element.find(".active"),d=c.parent().children(),e=d.index(c),f=this;if(b>d.length-1||b<0)return;return this.sliding?this.$element.one("slid",function(){f.to(b)}):e==b?this.pause().cycle():this.slide(b>e?"next":"prev",a(d[b]))},pause:function(a){return a||(this.paused=!0),clearInterval(this.interval),this.interval=null,this},next:function(){if(this.sliding)return;return this.slide("next")},prev:function(){if(this.sliding)return;return this.slide("prev")},slide:function(b,c){var d=this.$element.find(".active"),e=c||d[b](),f=this.interval,g=b=="next"?"left":"right",h=b=="next"?"first":"last",i=this,j=a.Event("slide");this.sliding=!0,f&&this.pause(),e=e.length?e:this.$element.find(".item")[h]();if(e.hasClass("active"))return;if(a.support.transition&&this.$element.hasClass("slide")){this.$element.trigger(j);if(j.isDefaultPrevented())return;e.addClass(b),e[0].offsetWidth,d.addClass(g),e.addClass(g),this.$element.one(a.support.transition.end,function(){e.removeClass([b,g].join(" ")).addClass("active"),d.removeClass(["active",g].join(" ")),i.sliding=!1,setTimeout(function(){i.$element.trigger("slid")},0)})}else{this.$element.trigger(j);if(j.isDefaultPrevented())return;d.removeClass("active"),e.addClass("active"),this.sliding=!1,this.$element.trigger("slid")}return f&&this.cycle(),this}},a.fn.carousel=function(c){return this.each(function(){var d=a(this),e=d.data("carousel"),f=a.extend({},a.fn.carousel.defaults,typeof c=="object"&&c);e||d.data("carousel",e=new b(this,f)),typeof c=="number"?e.to(c):typeof c=="string"||(c=f.slide)?e[c]():f.interval&&e.cycle()})},a.fn.carousel.defaults={interval:5e3,pause:"hover"},a.fn.carousel.Constructor=b,a(function(){a("body").on("click.carousel.data-api","[data-slide]",function(b){var c=a(this),d,e=a(c.attr("data-target")||(d=c.attr("href"))&&d.replace(/.*(?=#[^\s]+$)/,"")),f=!e.data("modal")&&a.extend({},e.data(),c.data());e.carousel(f),b.preventDefault()})})}(window.jQuery),!function(a){"use strict";var b=function(b,c){this.$element=a(b),this.options=a.extend({},a.fn.collapse.defaults,c),this.options.parent&&(this.$parent=a(this.options.parent)),this.options.toggle&&this.toggle()};b.prototype={constructor:b,dimension:function(){var a=this.$element.hasClass("width");return a?"width":"height"},show:function(){var b,c,d,e;if(this.transitioning)return;b=this.dimension(),c=a.camelCase(["scroll",b].join("-")),d=this.$parent&&this.$parent.find("> .accordion-group > .in");if(d&&d.length){e=d.data("collapse");if(e&&e.transitioning)return;d.collapse("hide"),e||d.data("collapse",null)}this.$element[b](0),this.transition("addClass",a.Event("show"),"shown"),this.$element[b](this.$element[0][c])},hide:function(){var b;if(this.transitioning)return;b=this.dimension(),this.reset(this.$element[b]()),this.transition("removeClass",a.Event("hide"),"hidden"),this.$element[b](0)},reset:function(a){var b=this.dimension();return this.$element.removeClass("collapse")[b](a||"auto")[0].offsetWidth,this.$element[a!==null?"addClass":"removeClass"]("collapse"),this},transition:function(b,c,d){var e=this,f=function(){c.type=="show"&&e.reset(),e.transitioning=0,e.$element.trigger(d)};this.$element.trigger(c);if(c.isDefaultPrevented())return;this.transitioning=1,this.$element[b]("in"),a.support.transition&&this.$element.hasClass("collapse")?this.$element.one(a.support.transition.end,f):f()},toggle:function(){this[this.$element.hasClass("in")?"hide":"show"]()}},a.fn.collapse=function(c){return this.each(function(){var d=a(this),e=d.data("collapse"),f=typeof c=="object"&&c;e||d.data("collapse",e=new b(this,f)),typeof c=="string"&&e[c]()})},a.fn.collapse.defaults={toggle:!0},a.fn.collapse.Constructor=b,a(function(){a("body").on("click.collapse.data-api","[data-toggle=collapse]",function(b){var c=a(this),d,e=c.attr("data-target")||b.preventDefault()||(d=c.attr("href"))&&d.replace(/.*(?=#[^\s]+$)/,""),f=a(e).data("collapse")?"toggle":c.data();a(e).collapse(f)})})}(window.jQuery),!function(a){function d(){a(b).parent().removeClass("open")}"use strict";var b='[data-toggle="dropdown"]',c=function(b){var c=a(b).on("click.dropdown.data-api",this.toggle);a("html").on("click.dropdown.data-api",function(){c.parent().removeClass("open")})};c.prototype={constructor:c,toggle:function(b){var c=a(this),e,f,g;if(c.is(".disabled, :disabled"))return;return f=c.attr("data-target"),f||(f=c.attr("href"),f=f&&f.replace(/.*(?=#[^\s]*$)/,"")),e=a(f),e.length||(e=c.parent()),g=e.hasClass("open"),d(),g||e.toggleClass("open"),!1}},a.fn.dropdown=function(b){return this.each(function(){var d=a(this),e=d.data("dropdown");e||d.data("dropdown",e=new c(this)),typeof b=="string"&&e[b].call(d)})},a.fn.dropdown.Constructor=c,a(function(){a("html").on("click.dropdown.data-api",d),a("body").on("click.dropdown",".dropdown form",function(a){a.stopPropagation()}).on("click.dropdown.data-api",b,c.prototype.toggle)})}(window.jQuery),!function(a){function c(){var b=this,c=setTimeout(function(){b.$element.off(a.support.transition.end),d.call(b)},500);this.$element.one(a.support.transition.end,function(){clearTimeout(c),d.call(b)})}function d(a){this.$element.hide().trigger("hidden"),e.call(this)}function e(b){var c=this,d=this.$element.hasClass("fade")?"fade":"";if(this.isShown&&this.options.backdrop){var e=a.support.transition&&d;this.$backdrop=a('<div class="modal-backdrop '+d+'" />').appendTo(document.body),this.options.backdrop!="static"&&this.$backdrop.click(a.proxy(this.hide,this)),e&&this.$backdrop[0].offsetWidth,this.$backdrop.addClass("in"),e?this.$backdrop.one(a.support.transition.end,b):b()}else!this.isShown&&this.$backdrop?(this.$backdrop.removeClass("in"),a.support.transition&&this.$element.hasClass("fade")?this.$backdrop.one(a.support.transition.end,a.proxy(f,this)):f.call(this)):b&&b()}function f(){this.$backdrop.remove(),this.$backdrop=null}function g(){var b=this;this.isShown&&this.options.keyboard?a(document).on("keyup.dismiss.modal",function(a){a.which==27&&b.hide()}):this.isShown||a(document).off("keyup.dismiss.modal")}"use strict";var b=function(b,c){this.options=c,this.$element=a(b).delegate('[data-dismiss="modal"]',"click.dismiss.modal",a.proxy(this.hide,this))};b.prototype={constructor:b,toggle:function(){return this[this.isShown?"hide":"show"]()},show:function(){var b=this,c=a.Event("show");this.$element.trigger(c);if(this.isShown||c.isDefaultPrevented())return;a("body").addClass("modal-open"),this.isShown=!0,g.call(this),e.call(this,function(){var c=a.support.transition&&b.$element.hasClass("fade");b.$element.parent().length||b.$element.appendTo(document.body),b.$element.show(),c&&b.$element[0].offsetWidth,b.$element.addClass("in"),c?b.$element.one(a.support.transition.end,function(){b.$element.trigger("shown")}):b.$element.trigger("shown")})},hide:function(b){b&&b.preventDefault();var e=this;b=a.Event("hide"),this.$element.trigger(b);if(!this.isShown||b.isDefaultPrevented())return;this.isShown=!1,a("body").removeClass("modal-open"),g.call(this),this.$element.removeClass("in"),a.support.transition&&this.$element.hasClass("fade")?c.call(this):d.call(this)}},a.fn.modal=function(c){return this.each(function(){var d=a(this),e=d.data("modal"),f=a.extend({},a.fn.modal.defaults,d.data(),typeof c=="object"&&c);e||d.data("modal",e=new b(this,f)),typeof c=="string"?e[c]():f.show&&e.show()})},a.fn.modal.defaults={backdrop:!0,keyboard:!0,show:!0},a.fn.modal.Constructor=b,a(function(){a("body").on("click.modal.data-api",'[data-toggle="modal"]',function(b){var c=a(this),d,e=a(c.attr("data-target")||(d=c.attr("href"))&&d.replace(/.*(?=#[^\s]+$)/,"")),f=e.data("modal")?"toggle":a.extend({},e.data(),c.data());b.preventDefault(),e.modal(f)})})}(window.jQuery),!function(a){"use strict";var b=function(a,b){this.init("tooltip",a,b)};b.prototype={constructor:b,init:function(b,c,d){var e,f;this.type=b,this.$element=a(c),this.options=this.getOptions(d),this.enabled=!0,this.options.trigger!="manual"&&(e=this.options.trigger=="hover"?"mouseenter":"focus",f=this.options.trigger=="hover"?"mouseleave":"blur",this.$element.on(e,this.options.selector,a.proxy(this.enter,this)),this.$element.on(f,this.options.selector,a.proxy(this.leave,this))),this.options.selector?this._options=a.extend({},this.options,{trigger:"manual",selector:""}):this.fixTitle()},getOptions:function(b){return b=a.extend({},a.fn[this.type].defaults,b,this.$element.data()),b.delay&&typeof b.delay=="number"&&(b.delay={show:b.delay,hide:b.delay}),b},enter:function(b){var c=a(b.currentTarget)[this.type](this._options).data(this.type);if(!c.options.delay||!c.options.delay.show)return c.show();clearTimeout(this.timeout),c.hoverState="in",this.timeout=setTimeout(function(){c.hoverState=="in"&&c.show()},c.options.delay.show)},leave:function(b){var c=a(b.currentTarget)[this.type](this._options).data(this.type);this.timeout&&clearTimeout(this.timeout);if(!c.options.delay||!c.options.delay.hide)return c.hide();c.hoverState="out",this.timeout=setTimeout(function(){c.hoverState=="out"&&c.hide()},c.options.delay.hide)},show:function(){var a,b,c,d,e,f,g;if(this.hasContent()&&this.enabled){a=this.tip(),this.setContent(),this.options.animation&&a.addClass("fade"),f=typeof this.options.placement=="function"?this.options.placement.call(this,a[0],this.$element[0]):this.options.placement,b=/in/.test(f),a.remove().css({top:0,left:0,display:"block"}).appendTo(b?this.$element:document.body),c=this.getPosition(b),d=a[0].offsetWidth,e=a[0].offsetHeight;switch(b?f.split(" ")[1]:f){case"bottom":g={top:c.top+c.height,left:c.left+c.width/2-d/2};break;case"top":g={top:c.top-e,left:c.left+c.width/2-d/2};break;case"left":g={top:c.top+c.height/2-e/2,left:c.left-d};break;case"right":g={top:c.top+c.height/2-e/2,left:c.left+c.width}}a.css(g).addClass(f).addClass("in")}},isHTML:function(a){return typeof a!="string"||a.charAt(0)==="<"&&a.charAt(a.length-1)===">"&&a.length>=3||/^(?:[^<]*<[\w\W]+>[^>]*$)/.exec(a)},setContent:function(){var a=this.tip(),b=this.getTitle();a.find(".tooltip-inner")[this.isHTML(b)?"html":"text"](b),a.removeClass("fade in top bottom left right")},hide:function(){function d(){var b=setTimeout(function(){c.off(a.support.transition.end).remove()},500);c.one(a.support.transition.end,function(){clearTimeout(b),c.remove()})}var b=this,c=this.tip();c.removeClass("in"),a.support.transition&&this.$tip.hasClass("fade")?d():c.remove()},fixTitle:function(){var a=this.$element;(a.attr("title")||typeof a.attr("data-original-title")!="string")&&a.attr("data-original-title",a.attr("title")||"").removeAttr("title")},hasContent:function(){return this.getTitle()},getPosition:function(b){return a.extend({},b?{top:0,left:0}:this.$element.offset(),{width:this.$element[0].offsetWidth,height:this.$element[0].offsetHeight})},getTitle:function(){var a,b=this.$element,c=this.options;return a=b.attr("data-original-title")||(typeof c.title=="function"?c.title.call(b[0]):c.title),a},tip:function(){return this.$tip=this.$tip||a(this.options.template)},validate:function(){this.$element[0].parentNode||(this.hide(),this.$element=null,this.options=null)},enable:function(){this.enabled=!0},disable:function(){this.enabled=!1},toggleEnabled:function(){this.enabled=!this.enabled},toggle:function(){this[this.tip().hasClass("in")?"hide":"show"]()}},a.fn.tooltip=function(c){return this.each(function(){var d=a(this),e=d.data("tooltip"),f=typeof c=="object"&&c;e||d.data("tooltip",e=new b(this,f)),typeof c=="string"&&e[c]()})},a.fn.tooltip.Constructor=b,a.fn.tooltip.defaults={animation:!0,placement:"top",selector:!1,template:'<div class="tooltip"><div class="tooltip-arrow"></div><div class="tooltip-inner"></div></div>',trigger:"hover",title:"",delay:0}}(window.jQuery),!function(a){"use strict";var b=function(a,b){this.init("popover",a,b)};b.prototype=a.extend({},a.fn.tooltip.Constructor.prototype,{constructor:b,setContent:function(){var a=this.tip(),b=this.getTitle(),c=this.getContent();a.find(".popover-title")[this.isHTML(b)?"html":"text"](b),a.find(".popover-content > *")[this.isHTML(c)?"html":"text"](c),a.removeClass("fade top bottom left right in")},hasContent:function(){return this.getTitle()||this.getContent()},getContent:function(){var a,b=this.$element,c=this.options;return a=b.attr("data-content")||(typeof c.content=="function"?c.content.call(b[0]):c.content),a},tip:function(){return this.$tip||(this.$tip=a(this.options.template)),this.$tip}}),a.fn.popover=function(c){return this.each(function(){var d=a(this),e=d.data("popover"),f=typeof c=="object"&&c;e||d.data("popover",e=new b(this,f)),typeof c=="string"&&e[c]()})},a.fn.popover.Constructor=b,a.fn.popover.defaults=a.extend({},a.fn.tooltip.defaults,{placement:"right",content:"",template:'<div class="popover"><div class="arrow"></div><div class="popover-inner"><h3 class="popover-title"></h3><div class="popover-content"><p></p></div></div></div>'})}(window.jQuery),!function(a){function b(b,c){var d=a.proxy(this.process,this),e=a(b).is("body")?a(window):a(b),f;this.options=a.extend({},a.fn.scrollspy.defaults,c),this.$scrollElement=e.on("scroll.scroll.data-api",d),this.selector=(this.options.target||(f=a(b).attr("href"))&&f.replace(/.*(?=#[^\s]+$)/,"")||"")+" .nav li > a",this.$body=a("body"),this.refresh(),this.process()}"use strict",b.prototype={constructor:b,refresh:function(){var b=this,c;this.offsets=a([]),this.targets=a([]),c=this.$body.find(this.selector).map(function(){var b=a(this),c=b.data("target")||b.attr("href"),d=/^#\w/.test(c)&&a(c);return d&&c.length&&[[d.position().top,c]]||null}).sort(function(a,b){return a[0]-b[0]}).each(function(){b.offsets.push(this[0]),b.targets.push(this[1])})},process:function(){var a=this.$scrollElement.scrollTop()+this.options.offset,b=this.$scrollElement[0].scrollHeight||this.$body[0].scrollHeight,c=b-this.$scrollElement.height(),d=this.offsets,e=this.targets,f=this.activeTarget,g;if(a>=c)return f!=(g=e.last()[0])&&this.activate(g);for(g=d.length;g--;)f!=e[g]&&a>=d[g]&&(!d[g+1]||a<=d[g+1])&&this.activate(e[g])},activate:function(b){var c,d;this.activeTarget=b,a(this.selector).parent(".active").removeClass("active"),d=this.selector+'[data-target="'+b+'"],'+this.selector+'[href="'+b+'"]',c=a(d).parent("li").addClass("active"),c.parent(".dropdown-menu")&&(c=c.closest("li.dropdown").addClass("active")),c.trigger("activate")}},a.fn.scrollspy=function(c){return this.each(function(){var d=a(this),e=d.data("scrollspy"),f=typeof c=="object"&&c;e||d.data("scrollspy",e=new b(this,f)),typeof c=="string"&&e[c]()})},a.fn.scrollspy.Constructor=b,a.fn.scrollspy.defaults={offset:10},a(function(){a('[data-spy="scroll"]').each(function(){var b=a(this);b.scrollspy(b.data())})})}(window.jQuery),!function(a){"use strict";var b=function(b){this.element=a(b)};b.prototype={constructor:b,show:function(){var b=this.element,c=b.closest("ul:not(.dropdown-menu)"),d=b.attr("data-target"),e,f,g;d||(d=b.attr("href"),d=d&&d.replace(/.*(?=#[^\s]*$)/,""));if(b.parent("li").hasClass("active"))return;e=c.find(".active a").last()[0],g=a.Event("show",{relatedTarget:e}),b.trigger(g);if(g.isDefaultPrevented())return;f=a(d),this.activate(b.parent("li"),c),this.activate(f,f.parent(),function(){b.trigger({type:"shown",relatedTarget:e})})},activate:function(b,c,d){function g(){e.removeClass("active").find("> .dropdown-menu > .active").removeClass("active"),b.addClass("active"),f?(b[0].offsetWidth,b.addClass("in")):b.removeClass("fade"),b.parent(".dropdown-menu")&&b.closest("li.dropdown").addClass("active"),d&&d()}var e=c.find("> .active"),f=d&&a.support.transition&&e.hasClass("fade");f?e.one(a.support.transition.end,g):g(),e.removeClass("in")}},a.fn.tab=function(c){return this.each(function(){var d=a(this),e=d.data("tab");e||d.data("tab",e=new b(this)),typeof c=="string"&&e[c]()})},a.fn.tab.Constructor=b,a(function(){a("body").on("click.tab.data-api",'[data-toggle="tab"], [data-toggle="pill"]',function(b){b.preventDefault(),a(this).tab("show")})})}(window.jQuery),!function(a){"use strict";var b=function(b,c){this.$element=a(b),this.options=a.extend({},a.fn.typeahead.defaults,c),this.matcher=this.options.matcher||this.matcher,this.sorter=this.options.sorter||this.sorter,this.highlighter=this.options.highlighter||this.highlighter,this.updater=this.options.updater||this.updater,this.$menu=a(this.options.menu).appendTo("body"),this.source=this.options.source,this.shown=!1,this.listen()};b.prototype={constructor:b,select:function(){var a=this.$menu.find(".active").attr("data-value");return this.$element.val(this.updater(a)).change(),this.hide()},updater:function(a){return a},show:function(){var b=a.extend({},this.$element.offset(),{height:this.$element[0].offsetHeight});return this.$menu.css({top:b.top+b.height,left:b.left}),this.$menu.show(),this.shown=!0,this},hide:function(){return this.$menu.hide(),this.shown=!1,this},lookup:function(b){var c=this,d,e;return this.query=this.$element.val(),this.query?(d=a.grep(this.source,function(a){return c.matcher(a)}),d=this.sorter(d),d.length?this.render(d.slice(0,this.options.items)).show():this.shown?this.hide():this):this.shown?this.hide():this},matcher:function(a){return~a.toLowerCase().indexOf(this.query.toLowerCase())},sorter:function(a){var b=[],c=[],d=[],e;while(e=a.shift())e.toLowerCase().indexOf(this.query.toLowerCase())?~e.indexOf(this.query)?c.push(e):d.push(e):b.push(e);return b.concat(c,d)},highlighter:function(a){var b=this.query.replace(/[\-\[\]{}()*+?.,\\\^$|#\s]/g,"\\$&");return a.replace(new RegExp("("+b+")","ig"),function(a,b){return"<strong>"+b+"</strong>"})},render:function(b){var c=this;return b=a(b).map(function(b,d){return b=a(c.options.item).attr("data-value",d),b.find("a").html(c.highlighter(d)),b[0]}),b.first().addClass("active"),this.$menu.html(b),this},next:function(b){var c=this.$menu.find(".active").removeClass("active"),d=c.next();d.length||(d=a(this.$menu.find("li")[0])),d.addClass("active")},prev:function(a){var b=this.$menu.find(".active").removeClass("active"),c=b.prev();c.length||(c=this.$menu.find("li").last()),c.addClass("active")},listen:function(){this.$element.on("blur",a.proxy(this.blur,this)).on("keypress",a.proxy(this.keypress,this)).on("keyup",a.proxy(this.keyup,this)),(a.browser.webkit||a.browser.msie)&&this.$element.on("keydown",a.proxy(this.keypress,this)),this.$menu.on("click",a.proxy(this.click,this)).on("mouseenter","li",a.proxy(this.mouseenter,this))},keyup:function(a){switch(a.keyCode){case 40:case 38:break;case 9:case 13:if(!this.shown)return;this.select();break;case 27:if(!this.shown)return;this.hide();break;default:this.lookup()}a.stopPropagation(),a.preventDefault()},keypress:function(a){if(!this.shown)return;switch(a.keyCode){case 9:case 13:case 27:a.preventDefault();break;case 38:if(a.type!="keydown")break;a.preventDefault(),this.prev();break;case 40:if(a.type!="keydown")break;a.preventDefault(),this.next()}a.stopPropagation()},blur:function(a){var b=this;setTimeout(function(){b.hide()},150)},click:function(a){a.stopPropagation(),a.preventDefault(),this.select()},mouseenter:function(b){this.$menu.find(".active").removeClass("active"),a(b.currentTarget).addClass("active")}},a.fn.typeahead=function(c){return this.each(function(){var d=a(this),e=d.data("typeahead"),f=typeof c=="object"&&c;e||d.data("typeahead",e=new b(this,f)),typeof c=="string"&&e[c]()})},a.fn.typeahead.defaults={source:[],items:8,menu:'<ul class="typeahead dropdown-menu"></ul>',item:'<li><a href="#"></a></li>'},a.fn.typeahead.Constructor=b,a(function(){a("body").on("focus.typeahead.data-api",'[data-provide="typeahead"]',function(b){var c=a(this);if(c.data("typeahead"))return;b.preventDefault(),c.typeahead(c.data())})})}(window.jQuery);
\ No newline at end of file diff --git a/docs/base-css.html b/docs/base-css.html index 5c55e04323..cb3bd8b95a 100644 --- a/docs/base-css.html +++ b/docs/base-css.html @@ -24,6 +24,7 @@ <link rel="apple-touch-icon-precomposed" sizes="114x114" href="assets/ico/apple-touch-icon-114-precomposed.png"> <link rel="apple-touch-icon-precomposed" sizes="72x72" href="assets/ico/apple-touch-icon-72-precomposed.png"> <link rel="apple-touch-icon-precomposed" href="assets/ico/apple-touch-icon-57-precomposed.png"> + </head> <body data-spy="scroll" data-target=".subnav" data-offset="50"> @@ -34,11 +35,11 @@ <div class="navbar navbar-fixed-top"> <div class="navbar-inner"> <div class="container"> - <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"> + <button type="button"class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> - </a> + </button> <a class="brand" href="./index.html">Bootstrap</a> <div class="nav-collapse collapse"> <ul class="nav"> @@ -111,8 +112,10 @@ </div> <div class="span4"> <h3>Example body text</h3> - <p>Nullam quis risus eget urna mollis ornare vel eu leo. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p> - <p>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec sed odio dui.</p> + <p>Nullam quis risus eget urna mollis ornare vel eu leo. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nullam id dolor id nibh ultricies vehicula.</p> + <h3>Lead body copy</h3> + <p>Make a paragraph stand out by adding <code>.lead</code>.</p> + <p class="lead">Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Duis mollis, est non commodo luctus.</p> </div> <div class="span4"> <div class="well"> @@ -1272,7 +1275,7 @@ For example, <code>section</code> should be wrapped as inline. </label> <label class="radio"> <input type="radio" name="optionsRadios" id="optionsRadios2" value="option2"> - Option two can is something else and selecting it will deselect option one + Option two can be something else and selecting it will deselect option one </label> </div> </div> @@ -1590,7 +1593,7 @@ For example, <code>section</code> should be wrapped as inline. <pre class="prettyprint linenums"> <i class="icon-search icon-white"></i> </pre> - <p>There are 120 classes to choose from for your icons. Just add an <code><i></code> tag with the right classes and you're set. You can find the full list in <strong>sprites.less</strong> or right here in this document.</p> + <p>There are 140 classes to choose from for your icons. Just add an <code><i></code> tag with the right classes and you're set. You can find the full list in <strong>sprites.less</strong> or right here in this document.</p> <p> <span class="label label-info">Heads up!</span> When using beside strings of text, as in buttons or nav links, be sure to leave a space after the <code><i></code> tag for proper spacing. diff --git a/docs/components.html b/docs/components.html index 1678e58aa5..55eb2e4a13 100644 --- a/docs/components.html +++ b/docs/components.html @@ -24,6 +24,7 @@ <link rel="apple-touch-icon-precomposed" sizes="114x114" href="assets/ico/apple-touch-icon-114-precomposed.png"> <link rel="apple-touch-icon-precomposed" sizes="72x72" href="assets/ico/apple-touch-icon-72-precomposed.png"> <link rel="apple-touch-icon-precomposed" href="assets/ico/apple-touch-icon-57-precomposed.png"> + </head> <body data-spy="scroll" data-target=".subnav" data-offset="50"> @@ -34,11 +35,11 @@ <div class="navbar navbar-fixed-top"> <div class="navbar-inner"> <div class="container"> - <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"> + <button type="button"class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> - </a> + </button> <a class="brand" href="./index.html">Bootstrap</a> <div class="nav-collapse collapse"> <ul class="nav"> @@ -813,7 +814,7 @@ <h3>Straightforward markup</h3> <p>Using tabbable tabs requires a wrapping div, a set of tabs, and a set of tabbable panes of content.</p> <pre class="prettyprint linenums"> -<div class="tabbable"> <-- Only required for left/right tabs --> +<div class="tabbable"> <!-- Only required for left/right tabs --> <ul class="nav nav-tabs"> <li class="active"><a href="#tab1" data-toggle="tab">Section 1</a></li> <li><a href="#tab2" data-toggle="tab">Section 2</a></li> @@ -1665,7 +1666,7 @@ -<!-- Alerts & Messages +<!-- Alerts ================================================== --> <section id="alerts"> <div class="page-header"> @@ -1688,7 +1689,7 @@ <h3>Example alerts</h3> <p>Wrap your message and an optional close icon in a div with simple class.</p> <div class="alert"> - <button class="close" data-dismiss="alert">×</button> + <button type="button" class="close" data-dismiss="alert">×</button> <strong>Warning!</strong> Best check yo self, you're not looking too good. </div> <pre class="prettyprint linenums"> @@ -1697,10 +1698,10 @@ <strong>Warning!</strong> Best check yo self, you're not looking too good. </div> </pre> - <p><span class="label label-info">Heads up!</span> iOS devices require an <code>href="#"</code> for the dismissal of alerts. Be sure to include it and the data attribute for anchor close icons. Alternatively, you may use a <code>button</code> element with the data attribute, which we have opted to do for our docs.</p> + <p><span class="label label-info">Heads up!</span> iOS devices require an <code>href="#"</code> for the dismissal of alerts. Be sure to include it and the data attribute for anchor close icons. Alternatively, you may use a <code><button></code> element with the data attribute, which we have opted to do for our docs. When using <code><button></code>, you must include <code>type="button"</code> or your forms may not submit.</p> <p>Easily extend the standard alert message with two optional classes: <code>.alert-block</code> for more padding and text controls and <code>.alert-heading</code> for a matching heading.</p> <div class="alert alert-block"> - <button class="close" data-dismiss="alert">×</button> + <button type="button" class="close" data-dismiss="alert">×</button> <h4 class="alert-heading">Warning!</h4> <p>Best check yo self, you're not looking too good. Nulla vitae elit libero, a pharetra augue. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.</p> </div> @@ -1719,7 +1720,7 @@ <div class="span4"> <h3>Error or danger</h3> <div class="alert alert-error"> - <button class="close" data-dismiss="alert">×</button> + <button type="button" class="close" data-dismiss="alert">×</button> <strong>Oh snap!</strong> Change a few things up and try submitting again. </div> <pre class="prettyprint linenums"> @@ -1731,7 +1732,7 @@ <div class="span4"> <h3>Success</h3> <div class="alert alert-success"> - <button class="close" data-dismiss="alert">×</button> + <button type="button" class="close" data-dismiss="alert">×</button> <strong>Well done!</strong> You successfully read this important alert message. </div> <pre class="prettyprint linenums"> @@ -1743,7 +1744,7 @@ <div class="span4"> <h3>Information</h3> <div class="alert alert-info"> - <button class="close" data-dismiss="alert">×</button> + <button type="button" class="close" data-dismiss="alert">×</button> <strong>Heads up!</strong> This alert needs your attention, but it's not super important. </div> <pre class="prettyprint linenums"> diff --git a/docs/download.html b/docs/download.html index 8b4a385f72..00700388c1 100644 --- a/docs/download.html +++ b/docs/download.html @@ -24,6 +24,7 @@ <link rel="apple-touch-icon-precomposed" sizes="114x114" href="assets/ico/apple-touch-icon-114-precomposed.png"> <link rel="apple-touch-icon-precomposed" sizes="72x72" href="assets/ico/apple-touch-icon-72-precomposed.png"> <link rel="apple-touch-icon-precomposed" href="assets/ico/apple-touch-icon-57-precomposed.png"> + </head> <body data-spy="scroll" data-target=".subnav" data-offset="50"> @@ -34,11 +35,11 @@ <div class="navbar navbar-fixed-top"> <div class="navbar-inner"> <div class="container"> - <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"> + <button type="button"class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> - </a> + </button> <a class="brand" href="./index.html">Bootstrap</a> <div class="nav-collapse collapse"> <ul class="nav"> @@ -408,7 +409,7 @@ </h1> </div> <div class="download-btn"> - <a class="btn btn-primary" href="#">Customize and Download</a> + <a class="btn btn-primary" href="#" >Customize and Download</a> <h4>What's included?</h4> <p>Downloads include compiled CSS, compiled and minified CSS, and compiled jQuery plugins, all nicely packed up into a zipball for your convenience.</p> </div> diff --git a/docs/examples.html b/docs/examples.html index 7872a39e85..5e8d74a3b5 100644 --- a/docs/examples.html +++ b/docs/examples.html @@ -24,6 +24,7 @@ <link rel="apple-touch-icon-precomposed" sizes="114x114" href="assets/ico/apple-touch-icon-114-precomposed.png"> <link rel="apple-touch-icon-precomposed" sizes="72x72" href="assets/ico/apple-touch-icon-72-precomposed.png"> <link rel="apple-touch-icon-precomposed" href="assets/ico/apple-touch-icon-57-precomposed.png"> + </head> <body data-spy="scroll" data-target=".subnav" data-offset="50"> @@ -34,11 +35,11 @@ <div class="navbar navbar-fixed-top"> <div class="navbar-inner"> <div class="container"> - <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"> + <button type="button"class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> - </a> + </button> <a class="brand" href="./index.html">Bootstrap</a> <div class="nav-collapse collapse"> <ul class="nav"> diff --git a/docs/index.html b/docs/index.html index 19e6a676ad..60a784160c 100644 --- a/docs/index.html +++ b/docs/index.html @@ -24,6 +24,7 @@ <link rel="apple-touch-icon-precomposed" sizes="114x114" href="assets/ico/apple-touch-icon-114-precomposed.png"> <link rel="apple-touch-icon-precomposed" sizes="72x72" href="assets/ico/apple-touch-icon-72-precomposed.png"> <link rel="apple-touch-icon-precomposed" href="assets/ico/apple-touch-icon-57-precomposed.png"> + </head> <body data-spy="scroll" data-target=".subnav" data-offset="50"> @@ -34,11 +35,11 @@ <div class="navbar navbar-fixed-top"> <div class="navbar-inner"> <div class="container"> - <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"> + <button type="button"class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> - </a> + </button> <a class="brand" href="./index.html">Bootstrap</a> <div class="nav-collapse collapse"> <ul class="nav"> @@ -82,8 +83,8 @@ <h1>Bootstrap, from Twitter</h1> <p>Simple and flexible HTML, CSS, and Javascript for popular user interface components and interactions.</p> <p class="download-info"> - <a href="https://github.com/twitter/bootstrap/" class="btn btn-primary btn-large">View project on GitHub</a> - <a href="assets/bootstrap.zip" class="btn btn-large">Download Bootstrap <small>(v2.0.3)</small></a> + <a href="https://github.com/twitter/bootstrap/" class="btn btn-primary btn-large" >View project on GitHub</a> + <a href="assets/bootstrap.zip" class="btn btn-large" >Download Bootstrap <small>(v2.0.4)</small></a> </p> </div> diff --git a/docs/javascript.html b/docs/javascript.html index 7ad42ae81f..6d06ff6d19 100644 --- a/docs/javascript.html +++ b/docs/javascript.html @@ -24,6 +24,7 @@ <link rel="apple-touch-icon-precomposed" sizes="114x114" href="assets/ico/apple-touch-icon-114-precomposed.png"> <link rel="apple-touch-icon-precomposed" sizes="72x72" href="assets/ico/apple-touch-icon-72-precomposed.png"> <link rel="apple-touch-icon-precomposed" href="assets/ico/apple-touch-icon-57-precomposed.png"> + </head> <body data-spy="scroll" data-target=".subnav" data-offset="50"> @@ -34,11 +35,11 @@ <div class="navbar navbar-fixed-top"> <div class="navbar-inner"> <div class="container"> - <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"> + <button type="button"class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> - </a> + </button> <a class="brand" href="./index.html">Bootstrap</a> <div class="nav-collapse collapse"> <ul class="nav"> @@ -107,82 +108,58 @@ </div> <div class="row"> <div class="span3"> - <label> - <h3><a href="./javascript.html#modals">Modals</a></h3> - <p>A streamlined, but flexible, take on the traditional javascript modal plugin with only the minimum required functionality and smart defaults.</p> - </label> + <h3><a href="./javascript.html#modals">Modals</a></h3> + <p>A streamlined, but flexible, take on the traditional javascript modal plugin with only the minimum required functionality and smart defaults.</p> </div> <div class="span3"> - <label> - <h3><a href="./javascript.html#dropdowns">Dropdowns</a></h3> - <p>Add dropdown menus to nearly anything in Bootstrap with this simple plugin. Bootstrap features full dropdown menu support on in the navbar, tabs, and pills.</p> - </label> + <h3><a href="./javascript.html#dropdowns">Dropdowns</a></h3> + <p>Add dropdown menus to nearly anything in Bootstrap with this simple plugin. Bootstrap features full dropdown menu support on in the navbar, tabs, and pills.</p> </div> <div class="span3"> - <label> - <h3><a href="./javascript.html#scrollspy">Scrollspy</a></h3> - <p>Use scrollspy to automatically update the links in your navbar to show the current active link based on scroll position.</p> - </label> + <h3><a href="./javascript.html#scrollspy">Scrollspy</a></h3> + <p>Use scrollspy to automatically update the links in your navbar to show the current active link based on scroll position.</p> </div> <div class="span3"> - <label> - <h3><a href="./javascript.html#tabs">Togglable tabs</a></h3> - <p>Use this plugin to make tabs and pills more useful by allowing them to toggle through tabbable panes of local content.</p> - </label> + <h3><a href="./javascript.html#tabs">Togglable tabs</a></h3> + <p>Use this plugin to make tabs and pills more useful by allowing them to toggle through tabbable panes of local content.</p> </div> </div> <!-- /row --> <div class="row"> <div class="span3"> - <label> - <h3><a href="./javascript.html#tooltips">Tooltips</a></h3> - <p>A new take on the jQuery Tipsy plugin, Tooltips don't rely on images—they use CSS3 for animations and data-attributes for local title storage.</p> - </label> + <h3><a href="./javascript.html#tooltips">Tooltips</a></h3> + <p>A new take on the jQuery Tipsy plugin, Tooltips don't rely on images—they use CSS3 for animations and data-attributes for local title storage.</p> </div> <div class="span3"> - <label> - <h3><a href="./javascript.html#popovers">Popovers</a> <small class="muted">*</small></h3> - <p>Add small overlays of content, like those on the iPad, to any element for housing secondary information.</p> - <p class="muted"><strong>*</strong> Requires <a href="#tooltips">Tooltips</a> to be included</p> - </label> + <h3><a href="./javascript.html#popovers">Popovers</a> <small class="muted">*</small></h3> + <p>Add small overlays of content, like those on the iPad, to any element for housing secondary information.</p> + <p class="muted"><strong>*</strong> Requires <a href="#tooltips">Tooltips</a> to be included</p> </div> <div class="span3"> - <label> - <h3><a href="./javascript.html#alerts">Alert messages</a></h3> - <p>The alert plugin is a tiny class for adding close functionality to alerts.</p> - </label> + <h3><a href="./javascript.html#alerts">Alert messages</a></h3> + <p>The alert plugin is a tiny class for adding close functionality to alerts.</p> </div> <div class="span3"> - <label> - <h3><a href="./javascript.html#buttons">Buttons</a></h3> - <p>Do more with buttons. Control button states or create groups of buttons for more components like toolbars.</p> - </label> + <h3><a href="./javascript.html#buttons">Buttons</a></h3> + <p>Do more with buttons. Control button states or create groups of buttons for more components like toolbars.</p> </div> </div> <!-- /row --> <div class="row" style="margin-bottom: 9px;"> <div class="span3"> - <label> - <h3><a href="./javascript.html#collapse">Collapse</a></h3> - <p>Get base styles and flexible support for collapsible components like accordions and navigation.</p> - </label> + <h3><a href="./javascript.html#collapse">Collapse</a></h3> + <p>Get base styles and flexible support for collapsible components like accordions and navigation.</p> </div> <div class="span3"> - <label> - <h3><a href="./javascript.html#carousel">Carousel</a></h3> - <p>Create a merry-go-round of any content you wish to provide an interactive slideshow of content.</p> - </label> + <h3><a href="./javascript.html#carousel">Carousel</a></h3> + <p>Create a merry-go-round of any content you wish to provide an interactive slideshow of content.</p> </div> <div class="span3"> - <label> - <h3><a href="./javascript.html#typeahead">Typeahead</a></h3> - <p>A basic, easily extended plugin for quickly creating elegant typeaheads with any form text input.</p> - </label> + <h3><a href="./javascript.html#typeahead">Typeahead</a></h3> + <p>A basic, easily extended plugin for quickly creating elegant typeaheads with any form text input.</p> </div> <div class="span3"> - <label> - <h3>Transitions <small class="muted">*</small></h3> - <p>For simple transition effects, include bootstrap-transition.js once to slide in modals or fade out alerts.</p> - <p class="muted"><strong>*</strong> Required for animation in plugins</p> - </label> + <h3>Transitions <small class="muted">*</small></h3> + <p>For simple transition effects, include bootstrap-transition.js once to slide in modals or fade out alerts.</p> + <p class="muted"><strong>*</strong> Required for animation in plugins</p> </div> </div> <!-- /row --> <div class="alert alert-info"><strong>Heads up!</strong> All javascript plugins require the latest version of jQuery.</div> @@ -208,7 +185,7 @@ <div class="well modal-example" style="background-color: #888; border: none;"> <div class="modal" style="position: relative; top: auto; left: auto; margin: 0 auto; z-index: 1; max-width: 100%;"> <div class="modal-header"> - <button class="close" data-dismiss="modal">×</button> + <button type="button" class="close" data-dismiss="modal">×</button> <h3>Modal header</h3> </div> <div class="modal-body"> @@ -226,7 +203,7 @@ <!-- sample modal content --> <div id="myModal" class="modal hide fade"> <div class="modal-header"> - <button class="close" data-dismiss="modal">×</button> + <button type="button" class="close" data-dismiss="modal">×</button> <h3>Modal Heading</h3> </div> <div class="modal-body"> @@ -301,16 +278,16 @@ </pre> <pre class="prettyprint linenums"> -<div class="modal" id="myModal"> +<div class="modal hide" id="myModal"> <div class="modal-header"> - <button class="close" data-dismiss="modal">×</button> + <button type="button" class="close" data-dismiss="modal">×</button> <h3>Modal header</h3> </div> <div class="modal-body"> <p>One fine body…</p> </div> <div class="modal-footer"> - <a href="#" class="btn">Close</a> + <a href="#" class="btn" data-dismiss="modal">Close</a> <a href="#" class="btn btn-primary">Save changes</a> </div> </div> @@ -978,11 +955,11 @@ $('a[data-toggle="tab"]').on('shown', function (e) { <h2>Example alerts</h2> <p>The alerts plugin works on regular alert messages, and block messages.</p> <div class="alert fade in"> - <button class="close" data-dismiss="alert">×</button> + <button type="button" class="close" data-dismiss="alert">×</button> <strong>Holy guacamole!</strong> Best check yo self, you're not looking too good. </div> <div class="alert alert-block alert-error fade in"> - <button class="close" data-dismiss="alert">×</button> + <button type="button" class="close" data-dismiss="alert">×</button> <h4 class="alert-heading">Oh snap! You got an error!</h4> <p>Change this and that and try again. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Cras mattis consectetur purus sit amet fermentum.</p> <p> @@ -1371,7 +1348,7 @@ $('#myCollapsible').on('hidden', function () { <h3>Markup</h3> <p>Data attributes are used for the previous and next conrols. Check out the example markup below.</p> <pre class="prettyprint linenums"> -<div id="myCarousel" class="carousel"> +<div id="myCarousel" class="carousel slide"> <!-- Carousel items --> <div class="carousel-inner"> <div class="active item">…</div> diff --git a/docs/less.html b/docs/less.html index 3fecd1ade2..8f1ebf7ada 100644 --- a/docs/less.html +++ b/docs/less.html @@ -24,6 +24,7 @@ <link rel="apple-touch-icon-precomposed" sizes="114x114" href="assets/ico/apple-touch-icon-114-precomposed.png"> <link rel="apple-touch-icon-precomposed" sizes="72x72" href="assets/ico/apple-touch-icon-72-precomposed.png"> <link rel="apple-touch-icon-precomposed" href="assets/ico/apple-touch-icon-57-precomposed.png"> + </head> <body data-spy="scroll" data-target=".subnav" data-offset="50"> @@ -34,11 +35,11 @@ <div class="navbar navbar-fixed-top"> <div class="navbar-inner"> <div class="container"> - <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"> + <button type="button"class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> - </a> + </button> <a class="brand" href="./index.html">Bootstrap</a> <div class="nav-collapse collapse"> <ul class="nav"> @@ -138,506 +139,507 @@ <h1>Bootstrap variables <small>LESS variables, their values, and usage guidelines</small></h1> </div> - <div class="row"> - <div class="span6"> - <h3>Scaffolding and links</h3> - <table class="table table-bordered table-striped"> - <tbody> - <tr> - <td class="span2"><code>@bodyBackground</code></td> - <td><code>@white</code></td> - <td>Page background color</td> - <td class="swatch-col"><span class="swatch" style="background-color: #fff;"></span></td> - </tr> - <tr> - <td><code>@textColor</code></td> - <td><code>@grayDark</code></td> - <td>Default text color for entire body, headings, and more</td> - <td class="swatch-col"><span class="swatch" style="background-color: #333;"></span></td> - </tr> - <tr> - <td><code>@linkColor</code></td> - <td><code>#08c</code></td> - <td>Default link text color</td> - <td class="swatch-col"><span class="swatch" style="background-color: #08c;"></span></td> - </tr> - <tr> - <td><code>@linkColorHover</code></td> - <td><code>darken(@linkColor, 15%)</code></td> - <td>Default link text hover color</td> - <td><span class="swatch" style="background-color: #005580;"></span></td> - </tr> - </tbody> - </table> - <h3>Grid system</h3> - <table class="table table-bordered table-striped"> - <tbody> - <tr> - <td class="span2"><code>@gridColumns</code></td> - <td>12</td> - </tr> - <tr> - <td><code>@gridColumnWidth</code></td> - <td>60px</td> - </tr> - <tr> - <td><code>@gridGutterWidth</code></td> - <td>20px</td> - </tr> - <tr> - <td><code>@fluidGridColumnWidth</code></td> - <td>6.382978723%</td> - </tr> - <tr> - <td><code>@fluidGridGutterWidth</code></td> - <td>2.127659574%</td> - </tr> - </tbody> - </table> - <h3>Typography</h3> - <table class="table table-bordered table-striped"> - <tbody> - <tr> - <td class="span2"><code>@sansFontFamily</code></td> - <td colspan="2">"Helvetica Neue", Helvetica, Arial, sans-serif</td> - </tr> - <tr> - <td><code>@serifFontFamily</code></td> - <td colspan="2"><code>Georgia, "Times New Roman", Times, serif</code></td> - </tr> - <tr> - <td><code>@monoFontFamily</code></td> - <td colspan="2">Menlo, Monaco, "Courier New", monospace</td> - </tr> + <h3>Scaffolding and links</h3> + <table class="table table-bordered table-striped"> + <tbody> + <tr> + <td class="span4"><code>@bodyBackground</code></td> + <td><code>@white</code></td> + <td>Page background color</td> + <td class="swatch-col"><span class="swatch" style="background-color: #fff;"></span></td> + </tr> + <tr> + <td><code>@textColor</code></td> + <td><code>@grayDark</code></td> + <td>Default text color for entire body, headings, and more</td> + <td class="swatch-col"><span class="swatch" style="background-color: #333;"></span></td> + </tr> + <tr> + <td><code>@linkColor</code></td> + <td><code>#08c</code></td> + <td>Default link text color</td> + <td class="swatch-col"><span class="swatch" style="background-color: #08c;"></span></td> + </tr> + <tr> + <td><code>@linkColorHover</code></td> + <td><code>darken(@linkColor, 15%)</code></td> + <td>Default link text hover color</td> + <td><span class="swatch" style="background-color: #005580;"></span></td> + </tr> + </tbody> + </table> + <h3>Grid system</h3> + <table class="table table-bordered table-striped"> + <tbody> + <tr> + <td class="span4"><code>@gridColumns</code></td> + <td>12</td> + </tr> + <tr> + <td><code>@gridColumnWidth</code></td> + <td>60px</td> + </tr> + <tr> + <td><code>@gridGutterWidth</code></td> + <td>20px</td> + </tr> + <tr> + <td><code>@fluidGridColumnWidth</code></td> + <td>6.382978723%</td> + </tr> + <tr> + <td><code>@fluidGridGutterWidth</code></td> + <td>2.127659574%</td> + </tr> + </tbody> + </table> + <h3>Typography</h3> + <table class="table table-bordered table-striped"> + <tbody> + <tr> + <td class="span4"><code>@sansFontFamily</code></td> + <td colspan="2">"Helvetica Neue", Helvetica, Arial, sans-serif</td> + </tr> + <tr> + <td><code>@serifFontFamily</code></td> + <td colspan="2"><code>Georgia, "Times New Roman", Times, serif</code></td> + </tr> + <tr> + <td><code>@monoFontFamily</code></td> + <td colspan="2">Menlo, Monaco, "Courier New", monospace</td> + </tr> - <tr> - <td class="span2"><code>@baseFontSize</code></td> - <td>13px</td> - <td><em class="muted">Must be pixels</em></td> - </tr> - <tr> - <td><code>@baseFontFamily</code></td> - <td colspan="2"><code>@sansFontFamily</code></td> - </tr> - <tr> - <td><code>@baseLineHeight</code></td> - <td>18px</td> - <td><em class="muted">Must be pixels</em></td> - </tr> - <tr> - <td><code>@altFontFamily</code></td> - <td colspan="2"><code>@serifFontFamily</code></td> - </tr> + <tr> + <td><code>@baseFontSize</code></td> + <td>13px</td> + <td><em class="muted">Must be pixels</em></td> + </tr> + <tr> + <td><code>@baseFontFamily</code></td> + <td colspan="2"><code>@sansFontFamily</code></td> + </tr> + <tr> + <td><code>@baseLineHeight</code></td> + <td>18px</td> + <td><em class="muted">Must be pixels</em></td> + </tr> + <tr> + <td><code>@altFontFamily</code></td> + <td colspan="2"><code>@serifFontFamily</code></td> + </tr> + + <tr> + <td><code>@headingsFontFamily</code></td> + <td colspan="2"><code>inherit</code></td> + </tr> + <tr> + <td><code>@headingsFontWeight</code></td> + <td colspan="2"><code>bold</code></td> + </tr> + <tr> + <td><code>@headingsColor</code></td> + <td colspan="2"><code>inherit</code></td> + </tr> + </tbody> + </table> + <h3>Tables</h3> + <table class="table table-bordered table-striped"> + <tbody> + <tr> + <td class="span4"><code>@tableBackground</code></td> + <td><code>transparent</code></td> + </tr> + <tr> + <td><code>@tableBackgroundAccent</code></td> + <td><code>#f9f9f9</code></td> + </tr> + <tr> + <td><code>@tableBackgroundHover</code></td> + <td><code>#f5f5f5</code></td> + </tr> + <tr> + <td><code>@tableBorder</code></td> + <td><code>ddd</code></td> + </tr> + </tbody> + </table> + + <h3>Grayscale colors</h3> + <table class="table table-bordered table-striped"> + <tbody> + <tr> + <td class="span4"><code>@black</code></td> + <td>#000</td> + <td class="swatch-col"><span class="swatch" style="background-color: #000;"></span></td> + </tr> + <tr> + <td><code>@grayDarker</code></td> + <td>#222</td> + <td><span class="swatch" style="background-color: #222;"></span></td> + </tr> + <tr> + <td><code>@grayDark</code></td> + <td>#333</td> + <td><span class="swatch" style="background-color: #333;"></span></td> + </tr> + <tr> + <td><code>@gray</code></td> + <td>#555</td> + <td><span class="swatch" style="background-color: #555;"></span></td> + </tr> + <tr> + <td><code>@grayLight</code></td> + <td>#999</td> + <td><span class="swatch" style="background-color: #999;"></span></td> + </tr> + <tr> + <td><code>@grayLighter</code></td> + <td>#eee</td> + <td><span class="swatch" style="background-color: #eee;"></span></td> + </tr> + <tr> + <td><code>@white</code></td> + <td>#fff</td> + <td><span class="swatch swatch-bordered" style="background-color: #fff;"></span></td> + </tr> + </tbody> + </table> + <h3>Accent colors</h3> + <table class="table table-bordered table-striped"> + <tbody> + <tr> + <td class="span4"><code>@blue</code></td> + <td>#049cdb</td> + <td class="swatch-col"><span class="swatch" style="background-color: #049cdb;"></span></td> + </tr> + <tr> + <td><code>@green</code></td> + <td>#46a546</td> + <td><span class="swatch" style="background-color: #46a546;"></span></td> + </tr> + <tr> + <td><code>@red</code></td> + <td>#9d261d</td> + <td><span class="swatch" style="background-color: #9d261d;"></span></td> + </tr> + <tr> + <td><code>@yellow</code></td> + <td>#ffc40d</td> + <td><span class="swatch" style="background-color: #ffc40d;"></span></td> + </tr> + <tr> + <td><code>@orange</code></td> + <td>#f89406</td> + <td><span class="swatch" style="background-color: #f89406;"></span></td> + </tr> + <tr> + <td><code>@pink</code></td> + <td>#c3325f</td> + <td><span class="swatch" style="background-color: #c3325f;"></span></td> + </tr> + <tr> + <td><code>@purple</code></td> + <td>#7a43b6</td> + <td><span class="swatch" style="background-color: #7a43b6;"></span></td> + </tr> + </tbody> + </table> - <tr> - <td class="span2"><code>@headingsFontFamily</code></td> - <td colspan="2"><code>inherit</code></td> - </tr> - <tr> - <td><code>@headingsFontWeight</code></td> - <td colspan="2"><code>bold</code></td> - </tr> - <tr> - <td><code>@headingsColor</code></td> - <td colspan="2"><code>inherit</code></td> - </tr> - </tbody> - </table> - <h3>Tables</h3> - <table class="table table-bordered table-striped"> - <tbody> - <tr> - <td class="span2"><code>@tableBackground</code></td> - <td><code>transparent</code></td> - </tr> - <tr> - <td><code>@tableBackgroundAccent</code></td> - <td><code>#f9f9f9</code></td> - </tr> - <tr> - <td><code>@tableBackgroundHover</code></td> - <td><code>#f5f5f5</code></td> - </tr> - <tr> - <td><code>@tableBorder</code></td> - <td><code>ddd</code></td> - </tr> - </tbody> - </table> - </div> - <div class="span6"> - <h3>Grayscale colors</h3> - <table class="table table-bordered table-striped"> - <tbody> - <tr> - <td class="span2"><code>@black</code></td> - <td>#000</td> - <td class="swatch-col"><span class="swatch" style="background-color: #000;"></span></td> - </tr> - <tr> - <td><code>@grayDarker</code></td> - <td>#222</td> - <td><span class="swatch" style="background-color: #222;"></span></td> - </tr> - <tr> - <td><code>@grayDark</code></td> - <td>#333</td> - <td><span class="swatch" style="background-color: #333;"></span></td> - </tr> - <tr> - <td><code>@gray</code></td> - <td>#555</td> - <td><span class="swatch" style="background-color: #555;"></span></td> - </tr> - <tr> - <td><code>@grayLight</code></td> - <td>#999</td> - <td><span class="swatch" style="background-color: #999;"></span></td> - </tr> - <tr> - <td><code>@grayLighter</code></td> - <td>#eee</td> - <td><span class="swatch" style="background-color: #eee;"></span></td> - </tr> - <tr> - <td><code>@white</code></td> - <td>#fff</td> - <td><span class="swatch swatch-bordered" style="background-color: #fff;"></span></td> - </tr> - </tbody> - </table> - <h3>Accent colors</h3> - <table class="table table-bordered table-striped"> - <tbody> - <tr> - <td class="span2"><code>@blue</code></td> - <td>#049cdb</td> - <td class="swatch-col"><span class="swatch" style="background-color: #049cdb;"></span></td> - </tr> - <tr> - <td><code>@green</code></td> - <td>#46a546</td> - <td><span class="swatch" style="background-color: #46a546;"></span></td> - </tr> - <tr> - <td><code>@red</code></td> - <td>#9d261d</td> - <td><span class="swatch" style="background-color: #9d261d;"></span></td> - </tr> - <tr> - <td><code>@yellow</code></td> - <td>#ffc40d</td> - <td><span class="swatch" style="background-color: #ffc40d;"></span></td> - </tr> - <tr> - <td><code>@orange</code></td> - <td>#f89406</td> - <td><span class="swatch" style="background-color: #f89406;"></span></td> - </tr> - <tr> - <td><code>@pink</code></td> - <td>#c3325f</td> - <td><span class="swatch" style="background-color: #c3325f;"></span></td> - </tr> - <tr> - <td><code>@purple</code></td> - <td>#7a43b6</td> - <td><span class="swatch" style="background-color: #7a43b6;"></span></td> - </tr> - </tbody> - </table> - </div> - </div> <!-- /row --> <h3>Components</h3> - <div class="row"> - <div class="span6"> - <h4>Buttons</h4> - <table class="table table-bordered table-striped"> - <tbody> - <tr> - <td class="span3"><code>@btnBackground</code></td> - <td><code>@white</code></td> - <td class="swatch-col"><span class="swatch" style="background-color: #fff;"></span></td> - </tr> - <tr> - <td class="span3"><code>@btnBackgroundHighlight</code></td> - <td><code>darken(@white, 10%)</code></td> - <td class="swatch-col"><span class="swatch" style="background-color: #e6e6e6;"></span></td> - </tr> - <tr> - <td class="span3"><code>@btnBorder</code></td> - <td><code>darken(@white, 20%)</code></td> - <td class="swatch-col"><span class="swatch" style="background-color: #ccc;"></span></td> - </tr> - <tr> - <td class="span3"><code>@btnPrimaryBackground</code></td> - <td><code>@linkColor</code></td> - <td class="swatch-col"><span class="swatch" style="background-color: #08c;"></span></td> - </tr> - <tr> - <td class="span3"><code>@btnPrimaryBackgroundHighlight</code></td> - <td><code>spin(@btnPrimaryBackground, 15%)</code></td> - <td class="swatch-col"><span class="swatch" style="background-color: #05c;"></span></td> - </tr> + <h4>Buttons</h4> + <table class="table table-bordered table-striped"> + <tbody> + <tr> + <td class="span4"><code>@btnBackground</code></td> + <td><code>@white</code></td> + <td class="swatch-col"><span class="swatch" style="background-color: #fff;"></span></td> + </tr> + <tr> + <td><code>@btnBackgroundHighlight</code></td> + <td><code>darken(@white, 10%)</code></td> + <td class="swatch-col"><span class="swatch" style="background-color: #e6e6e6;"></span></td> + </tr> + <tr> + <td><code>@btnBorder</code></td> + <td><code>darken(@white, 20%)</code></td> + <td class="swatch-col"><span class="swatch" style="background-color: #ccc;"></span></td> + </tr> - <tr> - <td class="span3"><code>@btnInfoBackground</code></td> - <td><code>#5bc0de</code></td> - <td class="swatch-col"><span class="swatch" style="background-color: #5bc0de;"></span></td> - </tr> - <tr> - <td class="span3"><code>@btnInfoBackgroundHighlight</code></td> - <td><code>#2f96b4</code></td> - <td class="swatch-col"><span class="swatch" style="background-color: #2f96b4;"></span></td> - </tr> + <tr> + <td><code>@btnPrimaryBackground</code></td> + <td><code>@linkColor</code></td> + <td class="swatch-col"><span class="swatch" style="background-color: #08c;"></span></td> + </tr> + <tr> + <td><code>@btnPrimaryBackgroundHighlight</code></td> + <td><code>spin(@btnPrimaryBackground, 15%)</code></td> + <td class="swatch-col"><span class="swatch" style="background-color: #05c;"></span></td> + </tr> - <tr> - <td class="span3"><code>@btnSuccessBackground</code></td> - <td><code>#62c462</code></td> - <td class="swatch-col"><span class="swatch" style="background-color: #62c462;"></span></td> - </tr> - <tr> - <td class="span3"><code>@btnSuccessBackgroundHighlight</code></td> - <td><code>51a351</code></td> - <td class="swatch-col"><span class="swatch" style="background-color: #51a351;"></span></td> - </tr> + <tr> + <td><code>@btnInfoBackground</code></td> + <td><code>#5bc0de</code></td> + <td class="swatch-col"><span class="swatch" style="background-color: #5bc0de;"></span></td> + </tr> + <tr> + <td><code>@btnInfoBackgroundHighlight</code></td> + <td><code>#2f96b4</code></td> + <td class="swatch-col"><span class="swatch" style="background-color: #2f96b4;"></span></td> + </tr> - <tr> - <td class="span3"><code>@btnWarningBackground</code></td> - <td><code>lighten(@orange, 15%)</code></td> - <td class="swatch-col"><span class="swatch" style="background-color: #fbb450;"></span></td> - </tr> - <tr> - <td class="span3"><code>@btnWarningBackgroundHighlight</code></td> - <td><code>@orange</code></td> - <td class="swatch-col"><span class="swatch" style="background-color: #f89406;"></span></td> - </tr> + <tr> + <td><code>@btnSuccessBackground</code></td> + <td><code>#62c462</code></td> + <td class="swatch-col"><span class="swatch" style="background-color: #62c462;"></span></td> + </tr> + <tr> + <td><code>@btnSuccessBackgroundHighlight</code></td> + <td><code>51a351</code></td> + <td class="swatch-col"><span class="swatch" style="background-color: #51a351;"></span></td> + </tr> - <tr> - <td class="span3"><code>@btnDangerBackground</code></td> - <td><code>#ee5f5b</code></td> - <td class="swatch-col"><span class="swatch" style="background-color: #ee5f5b;"></span></td> - </tr> - <tr> - <td class="span3"><code>@btnDangerBackgroundHighlight</code></td> - <td><code>#bd362f</code></td> - <td class="swatch-col"><span class="swatch" style="background-color: #bd362f;"></span></td> - </tr> + <tr> + <td><code>@btnWarningBackground</code></td> + <td><code>lighten(@orange, 15%)</code></td> + <td class="swatch-col"><span class="swatch" style="background-color: #fbb450;"></span></td> + </tr> + <tr> + <td><code>@btnWarningBackgroundHighlight</code></td> + <td><code>@orange</code></td> + <td class="swatch-col"><span class="swatch" style="background-color: #f89406;"></span></td> + </tr> - <tr> - <td class="span3"><code>@btnInverseBackground</code></td> - <td><code>@gray</code></td> - <td class="swatch-col"><span class="swatch" style="background-color: #555;"></span></td> - </tr> - <tr> - <td class="span3"><code>@btnInverseBackgroundHighlight</code></td> - <td><code>@grayDarker</code></td> - <td class="swatch-col"><span class="swatch" style="background-color: #222;"></span></td> - </tr> - </tbody> - </table> - <h4>Forms</h4> - <table class="table table-bordered table-striped"> - <tbody> - <tr> - <td class="span3"><code>@placeholderText</code></td> - <td><code>@grayLight</code></td> - </tr> - <tr> - <td><code>@inputBackground</code></td> - <td><code>@white</code></td> - </tr> - <tr> - <td><code>@inputBorder</code></td> - <td><code>#ccc</code></td> - </tr> - <tr> - <td><code>@inputBorderRadius</code></td> - <td><code>3px</code></td> - </tr> - <tr> - <td><code>@inputDisabledBackground</code></td> - <td><code>@grayLighter</code></td> - </tr> - <tr> - <td><code>@formActionsBackground</code></td> - <td><code>#f5f5f5</code></td> - </tr> - </tbody> - </table> - <h4>Form states and alerts</h4> - <table class="table table-bordered table-striped"> - <tbody> - <tr> - <td class="span3"><code>@warningText</code></td> - <td>#c09853</td> - <td><span class="swatch" style="background-color: #c09853;"></span></td> - </tr> - <tr> - <td><code>@warningBackground</code></td> - <td>#f3edd2</td> - <td class="swatch-col"><span class="swatch" style="background-color: #f3edd2;"></span></td> - </tr> - <tr> - <td><code>@errorText</code></td> - <td>#b94a48</td> - <td><span class="swatch" style="background-color: #b94a48;"></span></td> - </tr> - <tr> - <td><code>@errorBackground</code></td> - <td>#f2dede</td> - <td><span class="swatch" style="background-color: #f2dede;"></span></td> - </tr> - <tr> - <td><code>@successText</code></td> - <td>#468847</td> - <td><span class="swatch" style="background-color: #468847;"></span></td> - </tr> - <tr> - <td><code>@successBackground</code></td> - <td>#dff0d8</td> - <td><span class="swatch" style="background-color: #dff0d8;"></span></td> - </tr> - <tr> - <td><code>@infoText</code></td> - <td>#3a87ad</td> - <td><span class="swatch" style="background-color: #3a87ad;"></span></td> - </tr> - <tr> - <td><code>@infoBackground</code></td> - <td>#d9edf7</td> - <td><span class="swatch" style="background-color: #d9edf7;"></span></td> - </tr> - </tbody> - </table> - </div> - <div class="span6"> - <h4>Navbar</h4> - <table class="table table-bordered table-striped"> - <tbody> - <tr> - <td class="span3"><code>@navbarHeight</code></td> - <td>40px</td> - <td class="swatch-col"></td> - </tr> - <tr> - <td><code>@navbarBackground</code></td> - <td><code>@grayDarker</code></td> - <td><span class="swatch" style="background-color: #222;"></span></td> - </tr> - <tr> - <td><code>@navbarBackgroundHighlight</code></td> - <td><code>@grayDark</code></td> - <td><span class="swatch" style="background-color: #333;"></span></td> - </tr> + <tr> + <td><code>@btnDangerBackground</code></td> + <td><code>#ee5f5b</code></td> + <td class="swatch-col"><span class="swatch" style="background-color: #ee5f5b;"></span></td> + </tr> + <tr> + <td><code>@btnDangerBackgroundHighlight</code></td> + <td><code>#bd362f</code></td> + <td class="swatch-col"><span class="swatch" style="background-color: #bd362f;"></span></td> + </tr> - <tr> - <td><code>@navbarText</code></td> - <td><code>@grayLight</code></td> - <td><span class="swatch" style="background-color: #999;"></span></td> - </tr> - <tr> - <td><code>@navbarLinkColor</code></td> - <td><code>@grayLight</code></td> - <td><span class="swatch" style="background-color: #999;"></span></td> - </tr> - <tr> - <td><code>@navbarLinkColorHover</code></td> - <td><code>@white</code></td> - <td><span class="swatch swatch-bordered" style="background-color: #fff;"></span></td> - </tr> - <tr> - <td><code>@navbarLinkColorActive</code></td> - <td><code>@navbarLinkColorHover</code></td> - <td><span class="swatch swatch-bordered" style="background-color: #fff;"></span></td> - </tr> - <tr> - <td><code>@navbarLinkBackgroundHover</code></td> - <td><code>transparent</code></td> - <td><span class="swatch swatch-bordered" style="background-color: transparent;"></span></td> - </tr> - <tr> - <td><code>@navbarLinkBackgroundActive</code></td> - <td><code>@navbarBackground</code></td> - <td><span class="swatch swatch-bordered" style="background-color: #fff;"></span></td> - </tr> + <tr> + <td><code>@btnInverseBackground</code></td> + <td><code>@gray</code></td> + <td class="swatch-col"><span class="swatch" style="background-color: #555;"></span></td> + </tr> + <tr> + <td><code>@btnInverseBackgroundHighlight</code></td> + <td><code>@grayDarker</code></td> + <td class="swatch-col"><span class="swatch" style="background-color: #222;"></span></td> + </tr> + </tbody> + </table> + <h4>Forms</h4> + <table class="table table-bordered table-striped"> + <tbody> + <tr> + <td class="span4"><code>@placeholderText</code></td> + <td><code>@grayLight</code></td> + </tr> + <tr> + <td><code>@inputBackground</code></td> + <td><code>@white</code></td> + </tr> + <tr> + <td><code>@inputBorder</code></td> + <td><code>#ccc</code></td> + </tr> + <tr> + <td><code>@inputBorderRadius</code></td> + <td><code>3px</code></td> + </tr> + <tr> + <td><code>@inputDisabledBackground</code></td> + <td><code>@grayLighter</code></td> + </tr> + <tr> + <td><code>@formActionsBackground</code></td> + <td><code>#f5f5f5</code></td> + </tr> + </tbody> + </table> + <h4>Form states and alerts</h4> + <table class="table table-bordered table-striped"> + <tbody> + <tr> + <td class="span4"><code>@warningText</code></td> + <td>#c09853</td> + <td><span class="swatch" style="background-color: #c09853;"></span></td> + </tr> + <tr> + <td><code>@warningBackground</code></td> + <td>#f3edd2</td> + <td class="swatch-col"><span class="swatch" style="background-color: #f3edd2;"></span></td> + </tr> + <tr> + <td><code>@errorText</code></td> + <td>#b94a48</td> + <td><span class="swatch" style="background-color: #b94a48;"></span></td> + </tr> + <tr> + <td><code>@errorBackground</code></td> + <td>#f2dede</td> + <td><span class="swatch" style="background-color: #f2dede;"></span></td> + </tr> + <tr> + <td><code>@successText</code></td> + <td>#468847</td> + <td><span class="swatch" style="background-color: #468847;"></span></td> + </tr> + <tr> + <td><code>@successBackground</code></td> + <td>#dff0d8</td> + <td><span class="swatch" style="background-color: #dff0d8;"></span></td> + </tr> + <tr> + <td><code>@infoText</code></td> + <td>#3a87ad</td> + <td><span class="swatch" style="background-color: #3a87ad;"></span></td> + </tr> + <tr> + <td><code>@infoBackground</code></td> + <td>#d9edf7</td> + <td><span class="swatch" style="background-color: #d9edf7;"></span></td> + </tr> + </tbody> + </table> + + <h4>Navbar</h4> + <table class="table table-bordered table-striped"> + <tbody> + <tr> + <td class="span4"><code>@navbarHeight</code></td> + <td>40px</td> + <td class="swatch-col"></td> + </tr> + <tr> + <td><code>@navbarBackground</code></td> + <td><code>@grayDarker</code></td> + <td><span class="swatch" style="background-color: #222;"></span></td> + </tr> + <tr> + <td><code>@navbarBackgroundHighlight</code></td> + <td><code>@grayDark</code></td> + <td><span class="swatch" style="background-color: #333;"></span></td> + </tr> + + <tr> + <td><code>@navbarText</code></td> + <td><code>@grayLight</code></td> + <td><span class="swatch" style="background-color: #999;"></span></td> + </tr> + <tr> + <td><code>@navbarLinkColor</code></td> + <td><code>@grayLight</code></td> + <td><span class="swatch" style="background-color: #999;"></span></td> + </tr> + <tr> + <td><code>@navbarLinkColorHover</code></td> + <td><code>@white</code></td> + <td><span class="swatch swatch-bordered" style="background-color: #fff;"></span></td> + </tr> + <tr> + <td><code>@navbarLinkColorActive</code></td> + <td><code>@navbarLinkColorHover</code></td> + <td><span class="swatch swatch-bordered" style="background-color: #fff;"></span></td> + </tr> + <tr> + <td><code>@navbarLinkBackgroundHover</code></td> + <td><code>transparent</code></td> + <td><span class="swatch swatch-bordered" style="background-color: transparent;"></span></td> + </tr> + <tr> + <td><code>@navbarLinkBackgroundActive</code></td> + <td><code>@navbarBackground</code></td> + <td><span class="swatch swatch-bordered" style="background-color: #fff;"></span></td> + </tr> + + <tr> + <td><code>@navbarSearchBackground</code></td> + <td><code>lighten(@navbarBackground, 25%)</code></td> + <td><span class="swatch" style="background-color: #666;"></span></td> + </tr> + <tr> + <td><code>@navbarSearchBackgroundFocus</code></td> + <td><code>@white</code></td> + <td><span class="swatch swatch-bordered" style="background-color: #fff;"></span></td> + </tr> + <tr> + <td><code>@navbarSearchBorder</code></td> + <td><code>darken(@navbarSearchBackground, 30%)</code></td> + <td><span class="swatch" style="background-color: #111;"></span></td> + </tr> + <tr> + <td><code>@navbarSearchPlaceholderColor</code></td> + <td><code>#ccc</code></td> + <td><span class="swatch" style="background-color: #ccc;"></span></td> + </tr> + <tr> + <td><code>@navbarBrandColor</code></td> + <td><code>@navbarLinkColor</code></td> + <td><span class="swatch swatch-bordered" style="background-color: #fff;"></span></td> + </tr> + </tbody> + </table> + <h4>Dropdowns</h4> + <table class="table table-bordered table-striped"> + <tbody> + <tr> + <td class="span4"><code>@dropdownBackground</code></td> + <td><code>@white</code></td> + </tr> + <tr> + <td><code>@dropdownBorder</code></td> + <td><code>rgba(0,0,0,.2)</code></td> + </tr> + <tr> + <td><code>@dropdownLinkColor</code></td> + <td><code>@grayDark</code></td> + </tr> + <tr> + <td><code>@dropdownLinkColorHover</code></td> + <td><code>@white</code></td> + </tr> + <tr> + <td><code>@dropdownLinkBackgroundHover</code></td> + <td><code>@linkColor</code></td> + </tr> + <tr> + <td><code>@@dropdownDividerTop</code></td> + <td><code>#e5e5e5</code></td> + </tr> + <tr> + <td><code>@@dropdownDividerBottom</code></td> + <td><code>@white</code></td> + </tr> + </tbody> + </table> + <h4>Hero unit</h4> + <table class="table table-bordered table-striped"> + <tbody> + <tr> + <td class="span4"><code>@heroUnitBackground</code></td> + <td><code>@grayLighter</code></td> + <td class="swatch-col"><span class="swatch" style="background-color: #eee;"></span></td> + </tr> + <tr> + <td class="span2"><code>@heroUnitHeadingColor</code></td> + <td><code>inherit</code></td> + <td></td> + </tr> + <tr> + <td><code>@heroUnitLeadColor</code></td> + <td><code>inhereit</code></td> + <td></td> + </tr> + </tbody> + </table> - <tr> - <td><code>@navbarSearchBackground</code></td> - <td><code>lighten(@navbarBackground, 25%)</code></td> - <td><span class="swatch" style="background-color: #666;"></span></td> - </tr> - <tr> - <td><code>@navbarSearchBackgroundFocus</code></td> - <td><code>@white</code></td> - <td><span class="swatch swatch-bordered" style="background-color: #fff;"></span></td> - </tr> - <tr> - <td><code>@navbarSearchBorder</code></td> - <td><code>darken(@navbarSearchBackground, 30%)</code></td> - <td><span class="swatch" style="background-color: #111;"></span></td> - </tr> - <tr> - <td><code>@navbarSearchPlaceholderColor</code></td> - <td><code>#ccc</code></td> - <td><span class="swatch" style="background-color: #ccc;"></span></td> - </tr> - <tr> - <td><code>@navbarBrandColor</code></td> - <td><code>@navbarLinkColor</code></td> - <td><span class="swatch swatch-bordered" style="background-color: #fff;"></span></td> - </tr> - </tbody> - </table> - <h4>Dropdowns</h4> - <table class="table table-bordered table-striped"> - <tbody> - <tr> - <td class="span2"><code>@dropdownBackground</code></td> - <td><code>@white</code></td> - </tr> - <tr> - <td><code>@dropdownBorder</code></td> - <td><code>rgba(0,0,0,.2)</code></td> - </tr> - <tr> - <td><code>@dropdownLinkColor</code></td> - <td><code>@grayDark</code></td> - </tr> - <tr> - <td><code>@dropdownLinkColorHover</code></td> - <td><code>@white</code></td> - </tr> - <tr> - <td><code>@dropdownLinkBackgroundHover</code></td> - <td><code>@linkColor</code></td> - </tr> - </tbody> - </table> - <h4>Hero unit</h4> - <table class="table table-bordered table-striped"> - <tbody> - <tr> - <td class="span3"><code>@heroUnitBackground</code></td> - <td><code>@grayLighter</code></td> - <td class="swatch-col"><span class="swatch" style="background-color: #eee;"></span></td> - </tr> - <tr> - <td class="span2"><code>@heroUnitHeadingColor</code></td> - <td><code>inherit</code></td> - <td></td> - </tr> - <tr> - <td><code>@heroUnitLeadColor</code></td> - <td><code>inhereit</code></td> - <td></td> - </tr> - </tbody> - </table> - </div> - </div><!-- /row --> </section> @@ -810,7 +812,7 @@ <tr> <td><code>#grid > .fluid()</code></td> <td><code>@fluidGridColumnWidth, @fluidGridGutterWidth</code></td> - <td>Generate a precent grid system with <em>n</em> columns and <em>x</em> % wide gutter</td> + <td>Generate a percent grid system with <em>n</em> columns and <em>x</em> % wide gutter</td> </tr> <tr> <td><code>#grid > .input()</code></td> @@ -899,6 +901,11 @@ <td><code>@columnCount, @columnGap: @gridGutterWidth</code></td> <td>Make the content of any element use CSS3 columns</td> </tr> + <tr> + <td><code>.hyphens()</code></td> + <td><code>@mode: auto</code></td> + <td>CSS3 hyphenation when you want it (includes <code>word-wrap: break-word</code>)</td> + </tr> </tbody> </table> <h3>Backgrounds and gradients</h3> @@ -975,8 +982,8 @@ <div class="row"> <div class="span4"> <h3>Node with makefile</h3> - <p>Install the LESS command line compiler and uglify-js globally with npm by running the following command:</p> - <pre>$ npm install -g less uglify-js</pre> + <p>Install the LESS command line compiler, JSHint, Recess, and uglify-js globally with npm by running the following command:</p> + <pre>$ npm install -g less jshint recess uglify-js</pre> <p>Once installed just run <code>make</code> from the root of your bootstrap directory and you're all set.</p> <p>Additionally, if you have <a href="https://github.com/mynyml/watchr">watchr</a> installed, you may run <code>make watch</code> to have bootstrap automatically rebuilt every time you edit a file in the bootstrap lib (this isn't required, just a convenience method).</p> </div><!-- /span4 --> diff --git a/docs/scaffolding.html b/docs/scaffolding.html index caffa6af66..4d6835caf0 100644 --- a/docs/scaffolding.html +++ b/docs/scaffolding.html @@ -24,6 +24,7 @@ <link rel="apple-touch-icon-precomposed" sizes="114x114" href="assets/ico/apple-touch-icon-114-precomposed.png"> <link rel="apple-touch-icon-precomposed" sizes="72x72" href="assets/ico/apple-touch-icon-72-precomposed.png"> <link rel="apple-touch-icon-precomposed" href="assets/ico/apple-touch-icon-57-precomposed.png"> + </head> <body data-spy="scroll" data-target=".subnav" data-offset="50"> @@ -34,11 +35,11 @@ <div class="navbar navbar-fixed-top"> <div class="navbar-inner"> <div class="container"> - <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"> + <button type="button"class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> - </a> + </button> <a class="brand" href="./index.html">Bootstrap</a> <div class="nav-collapse collapse"> <ul class="nav"> @@ -75,22 +76,22 @@ <div class="container"> - <!-- Masthead - ================================================== --> - <header class="jumbotron subhead" id="overview"> - <h1>Scaffolding</h1> - <p class="lead">Bootstrap is built on a responsive 12-column grid. We've also included fixed- and fluid-width layouts based on that system.</p> - <div class="subnav"> - <ul class="nav nav-pills"> - <li><a href="#global">Global styles</a></li> - <li><a href="#gridSystem">Grid system</a></li> - <li><a href="#fluidGridSystem">Fluid grid system</a></li> - <li><a href="#gridCustomization">Customizing</a></li> - <li><a href="#layouts">Layouts</a></li> - <li><a href="#responsive">Responsive design</a></li> - </ul> - </div> - </header> +<!-- Masthead +================================================== --> +<header class="jumbotron subhead" id="overview"> + <h1>Scaffolding</h1> + <p class="lead">Bootstrap is built on a responsive 12-column grid. We've also included fixed- and fluid-width layouts based on that system.</p> + <div class="subnav"> + <ul class="nav nav-pills"> + <li><a href="#global">Global styles</a></li> + <li><a href="#gridSystem">Grid system</a></li> + <li><a href="#fluidGridSystem">Fluid grid system</a></li> + <li><a href="#gridCustomization">Customizing</a></li> + <li><a href="#layouts">Layouts</a></li> + <li><a href="#responsive">Responsive design</a></li> + </ul> + </div> +</header> @@ -172,8 +173,7 @@ </div> <div class="row"> <div class="span4"> - <p>The default grid system provided as part of Bootstrap is a <strong>940px-wide, 12-column grid</strong>.</p> - <p>It also has four responsive variations for various devices and resolutions: phone, tablet portrait, tablet landscape and small desktops, and large widescreen desktops.</p> + <p>The default grid system provided in Bootstrap utilizes <strong>12 columns</strong> that render out at widths of 724px, 940px (default without responsive CSS included), and 1170px. Below 767px viewports, the columns become fluid and stack vertically. </p> </div><!-- /.span --> <div class="span4"> <pre class="prettyprint linenums"> @@ -234,11 +234,11 @@ <div class="span6"> <pre class="prettyprint linenums"> <div class="row"> - <div class="span12"> - Level 1 of column + <div class="span6"> + Level 1 column <div class="row"> - <div class="span6">Level 2</div> - <div class="span6">Level 2</div> + <div class="span3">Level 2</div> + <div class="span3">Level 2</div> </div> </div> </div> @@ -529,16 +529,16 @@ </div><!-- /.span --> <div class="span8"> <pre class="prettyprint linenums"> - // Landscape phones and down + /* Landscape phones and down */ @media (max-width: 480px) { ... } - // Landscape phone to portrait tablet + /* Landscape phone to portrait tablet */ @media (max-width: 767px) { ... } - // Portrait tablet to landscape and desktop + /* Portrait tablet to landscape and desktop */ @media (min-width: 768px) and (max-width: 979px) { ... } - // Large desktop + /* Large desktop */ @media (min-width: 1200px) { ... } </pre> </div><!-- /.span --> diff --git a/docs/templates/layout.mustache b/docs/templates/layout.mustache index 4fdaadb3b6..ae2ce4aad0 100644 --- a/docs/templates/layout.mustache +++ b/docs/templates/layout.mustache @@ -24,6 +24,19 @@ <link rel="apple-touch-icon-precomposed" sizes="114x114" href="assets/ico/apple-touch-icon-114-precomposed.png"> <link rel="apple-touch-icon-precomposed" sizes="72x72" href="assets/ico/apple-touch-icon-72-precomposed.png"> <link rel="apple-touch-icon-precomposed" href="assets/ico/apple-touch-icon-57-precomposed.png"> + + {{#production}} + <script type="text/javascript"> + var _gaq = _gaq || []; + _gaq.push(['_setAccount', 'UA-146052-10']); + _gaq.push(['_trackPageview']); + (function() { + var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true; + ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js'; + var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s); + })(); + </script> + {{/production}} </head> <body data-spy="scroll" data-target=".subnav" data-offset="50"> @@ -34,11 +47,11 @@ <div class="navbar navbar-fixed-top"> <div class="navbar-inner"> <div class="container"> - <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"> + <button type="button"class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> - </a> + </button> <a class="brand" href="./index.html">Bootstrap</a> <div class="nav-collapse collapse"> <ul class="nav"> diff --git a/docs/templates/pages/base-css.mustache b/docs/templates/pages/base-css.mustache index 3524ac9852..1404a31f02 100644 --- a/docs/templates/pages/base-css.mustache +++ b/docs/templates/pages/base-css.mustache @@ -34,8 +34,10 @@ </div> <div class="span4"> <h3>{{_i}}Example body text{{/i}}</h3> - <p>Nullam quis risus eget urna mollis ornare vel eu leo. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p> - <p>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec sed odio dui.</p> + <p>Nullam quis risus eget urna mollis ornare vel eu leo. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nullam id dolor id nibh ultricies vehicula.</p> + <h3>{{_i}}Lead body copy{{/i}}</h3> + <p>{{_i}}Make a paragraph stand out by adding <code>.lead</code>.{{/i}}</p> + <p class="lead">Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Duis mollis, est non commodo luctus.</p> </div> <div class="span4"> <div class="well"> @@ -1195,7 +1197,7 @@ </label> <label class="radio"> <input type="radio" name="optionsRadios" id="optionsRadios2" value="option2"> - {{_i}}Option two can is something else and selecting it will deselect option one{{/i}} + {{_i}}Option two can be something else and selecting it will deselect option one{{/i}} </label> </div> </div> @@ -1513,7 +1515,7 @@ <pre class="prettyprint linenums"> <i class="icon-search icon-white"></i> </pre> - <p>{{_i}}There are 120 classes to choose from for your icons. Just add an <code><i></code> tag with the right classes and you're set. You can find the full list in <strong>sprites.less</strong> or right here in this document.{{/i}}</p> + <p>{{_i}}There are 140 classes to choose from for your icons. Just add an <code><i></code> tag with the right classes and you're set. You can find the full list in <strong>sprites.less</strong> or right here in this document.{{/i}}</p> <p> <span class="label label-info">{{_i}}Heads up!{{/i}}</span> {{_i}}When using beside strings of text, as in buttons or nav links, be sure to leave a space after the <code><i></code> tag for proper spacing.{{/i}} diff --git a/docs/templates/pages/components.mustache b/docs/templates/pages/components.mustache index 8e81a95df0..b1f8589981 100644 --- a/docs/templates/pages/components.mustache +++ b/docs/templates/pages/components.mustache @@ -736,7 +736,7 @@ <h3>{{_i}}Straightforward markup{{/i}}</h3> <p>{{_i}}Using tabbable tabs requires a wrapping div, a set of tabs, and a set of tabbable panes of content.{{/i}}</p> <pre class="prettyprint linenums"> -<div class="tabbable"> <-- Only required for left/right tabs --> +<div class="tabbable"> <!-- Only required for left/right tabs --> <ul class="nav nav-tabs"> <li class="active"><a href="#tab1" data-toggle="tab">{{_i}}Section 1{{/i}}</a></li> <li><a href="#tab2" data-toggle="tab">{{_i}}Section 2{{/i}}</a></li> @@ -1252,7 +1252,7 @@ <span class="label label-success">{{_i}}Success{{/i}}</span> </td> <td> - <code><span class="label label-success">{{/_i}}Success{{/i}}</span></code> + <code><span class="label label-success">{{_i}}Success{{/i}}</span></code> </td> </tr> <tr> @@ -1588,7 +1588,7 @@ -<!-- Alerts & Messages +<!-- Alerts ================================================== --> <section id="alerts"> <div class="page-header"> @@ -1611,7 +1611,7 @@ <h3>{{_i}}Example alerts{{/i}}</h3> <p>{{_i}}Wrap your message and an optional close icon in a div with simple class.{{/i}}</p> <div class="alert"> - <button class="close" data-dismiss="alert">×</button> + <button type="button" class="close" data-dismiss="alert">×</button> <strong>{{_i}}Warning!{{/i}}</strong> {{_i}}Best check yo self, you're not looking too good.{{/i}} </div> <pre class="prettyprint linenums"> @@ -1620,10 +1620,10 @@ <strong>{{_i}}Warning!{{/i}}</strong> {{_i}}Best check yo self, you're not looking too good.{{/i}} </div> </pre> - <p><span class="label label-info">{{_i}}Heads up!{{/i}}</span> {{_i}}iOS devices require an <code>href="#"</code> for the dismissal of alerts. Be sure to include it and the data attribute for anchor close icons. Alternatively, you may use a <code>button</code> element with the data attribute, which we have opted to do for our docs.{{/i}}</p> + <p><span class="label label-info">{{_i}}Heads up!{{/i}}</span> {{_i}}iOS devices require an <code>href="#"</code> for the dismissal of alerts. Be sure to include it and the data attribute for anchor close icons. Alternatively, you may use a <code><button></code> element with the data attribute, which we have opted to do for our docs. When using <code><button></code>, you must include <code>type="button"</code> or your forms may not submit.{{/i}}</p> <p>{{_i}}Easily extend the standard alert message with two optional classes: <code>.alert-block</code> for more padding and text controls and <code>.alert-heading</code> for a matching heading.{{/i}}</p> <div class="alert alert-block"> - <button class="close" data-dismiss="alert">×</button> + <button type="button" class="close" data-dismiss="alert">×</button> <h4 class="alert-heading">{{_i}}Warning!{{/i}}</h4> <p>{{_i}}Best check yo self, you're not looking too good.{{/i}} Nulla vitae elit libero, a pharetra augue. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.</p> </div> @@ -1642,7 +1642,7 @@ <div class="span4"> <h3>{{_i}}Error or danger{{/i}}</h3> <div class="alert alert-error"> - <button class="close" data-dismiss="alert">×</button> + <button type="button" class="close" data-dismiss="alert">×</button> <strong>{{_i}}Oh snap!{{/i}}</strong> {{_i}}Change a few things up and try submitting again.{{/i}} </div> <pre class="prettyprint linenums"> @@ -1654,7 +1654,7 @@ <div class="span4"> <h3>{{_i}}Success{{/i}}</h3> <div class="alert alert-success"> - <button class="close" data-dismiss="alert">×</button> + <button type="button" class="close" data-dismiss="alert">×</button> <strong>{{_i}}Well done!{{/i}}</strong> {{_i}}You successfully read this important alert message.{{/i}} </div> <pre class="prettyprint linenums"> @@ -1666,7 +1666,7 @@ <div class="span4"> <h3>{{_i}}Information{{/i}}</h3> <div class="alert alert-info"> - <button class="close" data-dismiss="alert">×</button> + <button type="button" class="close" data-dismiss="alert">×</button> <strong>{{_i}}Heads up!{{/i}}</strong> {{_i}}This alert needs your attention, but it's not super important.{{/i}} </div> <pre class="prettyprint linenums"> diff --git a/docs/templates/pages/download.mustache b/docs/templates/pages/download.mustache index ffade09777..6efe757454 100644 --- a/docs/templates/pages/download.mustache +++ b/docs/templates/pages/download.mustache @@ -331,7 +331,7 @@ </h1> </div> <div class="download-btn"> - <a class="btn btn-primary" href="#">{{_i}}Customize and Download{{/i}}</a> + <a class="btn btn-primary" href="#" {{#production}}onclick="_gaq.push(['_trackEvent', 'Customize', 'Download', 'Customize and Download']);"{{/production}}>Customize and Download</a> <h4>{{_i}}What's included?{{/i}}</h4> <p>{{_i}}Downloads include compiled CSS, compiled and minified CSS, and compiled jQuery plugins, all nicely packed up into a zipball for your convenience.{{/i}}</p> </div> diff --git a/docs/templates/pages/index.mustache b/docs/templates/pages/index.mustache index 41a89e07a3..f14e95c14a 100644 --- a/docs/templates/pages/index.mustache +++ b/docs/templates/pages/index.mustache @@ -5,8 +5,8 @@ <h1>{{_i}}Bootstrap, from Twitter{{/i}}</h1> <p>{{_i}}Simple and flexible HTML, CSS, and Javascript for popular user interface components and interactions.{{/i}}</p> <p class="download-info"> - <a href="https://github.com/twitter/bootstrap/" class="btn btn-primary btn-large">{{_i}}View project on GitHub{{/i}}</a> - <a href="assets/bootstrap.zip" class="btn btn-large">{{_i}}Download Bootstrap <small>(v2.0.3)</small>{{/i}}</a> + <a href="https://github.com/twitter/bootstrap/" class="btn btn-primary btn-large" {{#production}}onclick="_gaq.push(['_trackEvent', 'Jumbotron actions', 'GitHub Project', 'View project on GitHub']);"{{/production}}>{{_i}}View project on GitHub{{/i}}</a> + <a href="assets/bootstrap.zip" class="btn btn-large" {{#production}}onclick="_gaq.push(['_trackEvent', 'Jumbotron actions', 'Download', 'Download 2.0.4']);"{{/production}}>{{_i}}Download Bootstrap <small>(v2.0.4)</small>{{/i}}</a> </p> </div> diff --git a/docs/templates/pages/javascript.mustache b/docs/templates/pages/javascript.mustache index 1ae3ffa5a8..4ed30284a2 100644 --- a/docs/templates/pages/javascript.mustache +++ b/docs/templates/pages/javascript.mustache @@ -30,82 +30,58 @@ </div> <div class="row"> <div class="span3"> - <label> - <h3><a href="./javascript.html#modals">{{_i}}Modals{{/i}}</a></h3> - <p>{{_i}}A streamlined, but flexible, take on the traditional javascript modal plugin with only the minimum required functionality and smart defaults.{{/i}}</p> - </label> + <h3><a href="./javascript.html#modals">{{_i}}Modals{{/i}}</a></h3> + <p>{{_i}}A streamlined, but flexible, take on the traditional javascript modal plugin with only the minimum required functionality and smart defaults.{{/i}}</p> </div> <div class="span3"> - <label> - <h3><a href="./javascript.html#dropdowns">{{_i}}Dropdowns{{/i}}</a></h3> - <p>{{_i}}Add dropdown menus to nearly anything in Bootstrap with this simple plugin. Bootstrap features full dropdown menu support on in the navbar, tabs, and pills.{{/i}}</p> - </label> + <h3><a href="./javascript.html#dropdowns">{{_i}}Dropdowns{{/i}}</a></h3> + <p>{{_i}}Add dropdown menus to nearly anything in Bootstrap with this simple plugin. Bootstrap features full dropdown menu support on in the navbar, tabs, and pills.{{/i}}</p> </div> <div class="span3"> - <label> - <h3><a href="./javascript.html#scrollspy">{{_i}}Scrollspy{{/i}}</a></h3> - <p>{{_i}}Use scrollspy to automatically update the links in your navbar to show the current active link based on scroll position.{{/i}}</p> - </label> + <h3><a href="./javascript.html#scrollspy">{{_i}}Scrollspy{{/i}}</a></h3> + <p>{{_i}}Use scrollspy to automatically update the links in your navbar to show the current active link based on scroll position.{{/i}}</p> </div> <div class="span3"> - <label> - <h3><a href="./javascript.html#tabs">{{_i}}Togglable tabs{{/i}}</a></h3> - <p>{{_i}}Use this plugin to make tabs and pills more useful by allowing them to toggle through tabbable panes of local content.{{/i}}</p> - </label> + <h3><a href="./javascript.html#tabs">{{_i}}Togglable tabs{{/i}}</a></h3> + <p>{{_i}}Use this plugin to make tabs and pills more useful by allowing them to toggle through tabbable panes of local content.{{/i}}</p> </div> </div> <!-- /row --> <div class="row"> <div class="span3"> - <label> - <h3><a href="./javascript.html#tooltips">{{_i}}Tooltips{{/i}}</a></h3> - <p>{{_i}}A new take on the jQuery Tipsy plugin, Tooltips don't rely on images—they use CSS3 for animations and data-attributes for local title storage.{{/i}}</p> - </label> + <h3><a href="./javascript.html#tooltips">{{_i}}Tooltips{{/i}}</a></h3> + <p>{{_i}}A new take on the jQuery Tipsy plugin, Tooltips don't rely on images—they use CSS3 for animations and data-attributes for local title storage.{{/i}}</p> </div> <div class="span3"> - <label> - <h3><a href="./javascript.html#popovers">{{_i}}Popovers{{/i}}</a> <small class="muted">*</small></h3> - <p>{{_i}}Add small overlays of content, like those on the iPad, to any element for housing secondary information.{{/i}}</p> - <p class="muted"><strong>*</strong> {{_i}}Requires <a href="#tooltips">Tooltips</a> to be included{{/i}}</p> - </label> + <h3><a href="./javascript.html#popovers">{{_i}}Popovers{{/i}}</a> <small class="muted">*</small></h3> + <p>{{_i}}Add small overlays of content, like those on the iPad, to any element for housing secondary information.{{/i}}</p> + <p class="muted"><strong>*</strong> {{_i}}Requires <a href="#tooltips">Tooltips</a> to be included{{/i}}</p> </div> <div class="span3"> - <label> - <h3><a href="./javascript.html#alerts">{{_i}}Alert messages{{/i}}</a></h3> - <p>{{_i}}The alert plugin is a tiny class for adding close functionality to alerts.{{/i}}</p> - </label> + <h3><a href="./javascript.html#alerts">{{_i}}Alert messages{{/i}}</a></h3> + <p>{{_i}}The alert plugin is a tiny class for adding close functionality to alerts.{{/i}}</p> </div> <div class="span3"> - <label> - <h3><a href="./javascript.html#buttons">{{_i}}Buttons{{/i}}</a></h3> - <p>{{_i}}Do more with buttons. Control button states or create groups of buttons for more components like toolbars.{{/i}}</p> - </label> + <h3><a href="./javascript.html#buttons">{{_i}}Buttons{{/i}}</a></h3> + <p>{{_i}}Do more with buttons. Control button states or create groups of buttons for more components like toolbars.{{/i}}</p> </div> </div> <!-- /row --> <div class="row" style="margin-bottom: 9px;"> <div class="span3"> - <label> - <h3><a href="./javascript.html#collapse">{{_i}}Collapse{{/i}}</a></h3> - <p>{{_i}}Get base styles and flexible support for collapsible components like accordions and navigation.{{/i}}</p> - </label> + <h3><a href="./javascript.html#collapse">{{_i}}Collapse{{/i}}</a></h3> + <p>{{_i}}Get base styles and flexible support for collapsible components like accordions and navigation.{{/i}}</p> </div> <div class="span3"> - <label> - <h3><a href="./javascript.html#carousel">{{_i}}Carousel{{/i}}</a></h3> - <p>{{_i}}Create a merry-go-round of any content you wish to provide an interactive slideshow of content.{{/i}}</p> - </label> + <h3><a href="./javascript.html#carousel">{{_i}}Carousel{{/i}}</a></h3> + <p>{{_i}}Create a merry-go-round of any content you wish to provide an interactive slideshow of content.{{/i}}</p> </div> <div class="span3"> - <label> - <h3><a href="./javascript.html#typeahead">Typeahead</a></h3> - <p>{{_i}}A basic, easily extended plugin for quickly creating elegant typeaheads with any form text input.{{/i}}</p> - </label> + <h3><a href="./javascript.html#typeahead">Typeahead</a></h3> + <p>{{_i}}A basic, easily extended plugin for quickly creating elegant typeaheads with any form text input.{{/i}}</p> </div> <div class="span3"> - <label> - <h3>{{_i}}Transitions{{/i}} <small class="muted">*</small></h3> - <p>{{_i}}For simple transition effects, include bootstrap-transition.js once to slide in modals or fade out alerts.{{/i}}</p> - <p class="muted"><strong>*</strong> {{_i}}Required for animation in plugins{{/i}}</p> - </label> + <h3>{{_i}}Transitions{{/i}} <small class="muted">*</small></h3> + <p>{{_i}}For simple transition effects, include bootstrap-transition.js once to slide in modals or fade out alerts.{{/i}}</p> + <p class="muted"><strong>*</strong> {{_i}}Required for animation in plugins{{/i}}</p> </div> </div> <!-- /row --> <div class="alert alert-info"><strong>{{_i}}Heads up!{{/i}}</strong> {{_i}}All javascript plugins require the latest version of jQuery.{{/i}}</div> @@ -131,7 +107,7 @@ <div class="well modal-example" style="background-color: #888; border: none;"> <div class="modal" style="position: relative; top: auto; left: auto; margin: 0 auto; z-index: 1; max-width: 100%;"> <div class="modal-header"> - <button class="close" data-dismiss="modal">×</button> + <button type="button" class="close" data-dismiss="modal">×</button> <h3>{{_i}}Modal header{{/i}}</h3> </div> <div class="modal-body"> @@ -149,7 +125,7 @@ <!-- sample modal content --> <div id="myModal" class="modal hide fade"> <div class="modal-header"> - <button class="close" data-dismiss="modal">×</button> + <button type="button" class="close" data-dismiss="modal">×</button> <h3>{{_i}}Modal Heading{{/i}}</h3> </div> <div class="modal-body"> @@ -224,16 +200,16 @@ </pre> <pre class="prettyprint linenums"> -<div class="modal" id="myModal"> +<div class="modal hide" id="myModal"> <div class="modal-header"> - <button class="close" data-dismiss="modal">×</button> + <button type="button" class="close" data-dismiss="modal">×</button> <h3>Modal header</h3> </div> <div class="modal-body"> <p>{{_i}}One fine body…{{/i}}</p> </div> <div class="modal-footer"> - <a href="#" class="btn">{{_i}}Close{{/i}}</a> + <a href="#" class="btn" data-dismiss="modal">{{_i}}Close{{/i}}</a> <a href="#" class="btn btn-primary">{{_i}}Save changes{{/i}}</a> </div> </div> @@ -901,11 +877,11 @@ $('a[data-toggle="tab"]').on('shown', function (e) { <h2>{{_i}}Example alerts{{/i}}</h2> <p>{{_i}}The alerts plugin works on regular alert messages, and block messages.{{/i}}</p> <div class="alert fade in"> - <button class="close" data-dismiss="alert">×</button> + <button type="button" class="close" data-dismiss="alert">×</button> <strong>{{_i}}Holy guacamole!{{/i}}</strong> {{_i}}Best check yo self, you're not looking too good.{{/i}} </div> <div class="alert alert-block alert-error fade in"> - <button class="close" data-dismiss="alert">×</button> + <button type="button" class="close" data-dismiss="alert">×</button> <h4 class="alert-heading">{{_i}}Oh snap! You got an error!{{/i}}</h4> <p>{{_i}}Change this and that and try again. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Cras mattis consectetur purus sit amet fermentum.{{/i}}</p> <p> @@ -1294,7 +1270,7 @@ $('#myCollapsible').on('hidden', function () { <h3>{{_i}}Markup{{/i}}</h3> <p>{{_i}}Data attributes are used for the previous and next conrols. Check out the example markup below.{{/i}}</p> <pre class="prettyprint linenums"> -<div id="myCarousel" class="carousel"> +<div id="myCarousel" class="carousel slide"> <!-- {{_i}}Carousel items{{/i}} --> <div class="carousel-inner"> <div class="active item">…</div> diff --git a/docs/templates/pages/less.mustache b/docs/templates/pages/less.mustache index 7698dd2900..7bdbe76147 100644 --- a/docs/templates/pages/less.mustache +++ b/docs/templates/pages/less.mustache @@ -61,506 +61,507 @@ <h1>{{_i}}Bootstrap variables <small>LESS variables, their values, and usage guidelines</small>{{/i}}</h1> </div> - <div class="row"> - <div class="span6"> - <h3>{{_i}}Scaffolding and links{{/i}}</h3> - <table class="table table-bordered table-striped"> - <tbody> - <tr> - <td class="span2"><code>@bodyBackground</code></td> - <td><code>@white</code></td> - <td>{{_i}}Page background color{{/i}}</td> - <td class="swatch-col"><span class="swatch" style="background-color: #fff;"></span></td> - </tr> - <tr> - <td><code>@textColor</code></td> - <td><code>@grayDark</code></td> - <td>{{_i}}Default text color for entire body, headings, and more{{/i}}</td> - <td class="swatch-col"><span class="swatch" style="background-color: #333;"></span></td> - </tr> - <tr> - <td><code>@linkColor</code></td> - <td><code>#08c</code></td> - <td>{{_i}}Default link text color{{/i}}</td> - <td class="swatch-col"><span class="swatch" style="background-color: #08c;"></span></td> - </tr> - <tr> - <td><code>@linkColorHover</code></td> - <td><code>darken(@linkColor, 15%)</code></td> - <td>{{_i}}Default link text hover color{{/i}}</td> - <td><span class="swatch" style="background-color: #005580;"></span></td> - </tr> - </tbody> - </table> - <h3>{{_i}}Grid system{{/i}}</h3> - <table class="table table-bordered table-striped"> - <tbody> - <tr> - <td class="span2"><code>@gridColumns</code></td> - <td>12</td> - </tr> - <tr> - <td><code>@gridColumnWidth</code></td> - <td>60px</td> - </tr> - <tr> - <td><code>@gridGutterWidth</code></td> - <td>20px</td> - </tr> - <tr> - <td><code>@fluidGridColumnWidth</code></td> - <td>6.382978723%</td> - </tr> - <tr> - <td><code>@fluidGridGutterWidth</code></td> - <td>2.127659574%</td> - </tr> - </tbody> - </table> - <h3>{{_i}}Typography{{/i}}</h3> - <table class="table table-bordered table-striped"> - <tbody> - <tr> - <td class="span2"><code>@sansFontFamily</code></td> - <td colspan="2">"Helvetica Neue", Helvetica, Arial, sans-serif</td> - </tr> - <tr> - <td><code>@serifFontFamily</code></td> - <td colspan="2"><code>Georgia, "Times New Roman", Times, serif</code></td> - </tr> - <tr> - <td><code>@monoFontFamily</code></td> - <td colspan="2">Menlo, Monaco, "Courier New", monospace</td> - </tr> + <h3>{{_i}}Scaffolding and links{{/i}}</h3> + <table class="table table-bordered table-striped"> + <tbody> + <tr> + <td class="span4"><code>@bodyBackground</code></td> + <td><code>@white</code></td> + <td>{{_i}}Page background color{{/i}}</td> + <td class="swatch-col"><span class="swatch" style="background-color: #fff;"></span></td> + </tr> + <tr> + <td><code>@textColor</code></td> + <td><code>@grayDark</code></td> + <td>{{_i}}Default text color for entire body, headings, and more{{/i}}</td> + <td class="swatch-col"><span class="swatch" style="background-color: #333;"></span></td> + </tr> + <tr> + <td><code>@linkColor</code></td> + <td><code>#08c</code></td> + <td>{{_i}}Default link text color{{/i}}</td> + <td class="swatch-col"><span class="swatch" style="background-color: #08c;"></span></td> + </tr> + <tr> + <td><code>@linkColorHover</code></td> + <td><code>darken(@linkColor, 15%)</code></td> + <td>{{_i}}Default link text hover color{{/i}}</td> + <td><span class="swatch" style="background-color: #005580;"></span></td> + </tr> + </tbody> + </table> + <h3>{{_i}}Grid system{{/i}}</h3> + <table class="table table-bordered table-striped"> + <tbody> + <tr> + <td class="span4"><code>@gridColumns</code></td> + <td>12</td> + </tr> + <tr> + <td><code>@gridColumnWidth</code></td> + <td>60px</td> + </tr> + <tr> + <td><code>@gridGutterWidth</code></td> + <td>20px</td> + </tr> + <tr> + <td><code>@fluidGridColumnWidth</code></td> + <td>6.382978723%</td> + </tr> + <tr> + <td><code>@fluidGridGutterWidth</code></td> + <td>2.127659574%</td> + </tr> + </tbody> + </table> + <h3>{{_i}}Typography{{/i}}</h3> + <table class="table table-bordered table-striped"> + <tbody> + <tr> + <td class="span4"><code>@sansFontFamily</code></td> + <td colspan="2">"Helvetica Neue", Helvetica, Arial, sans-serif</td> + </tr> + <tr> + <td><code>@serifFontFamily</code></td> + <td colspan="2"><code>Georgia, "Times New Roman", Times, serif</code></td> + </tr> + <tr> + <td><code>@monoFontFamily</code></td> + <td colspan="2">Menlo, Monaco, "Courier New", monospace</td> + </tr> - <tr> - <td class="span2"><code>@baseFontSize</code></td> - <td>13px</td> - <td><em class="muted">Must be pixels</em></td> - </tr> - <tr> - <td><code>@baseFontFamily</code></td> - <td colspan="2"><code>@sansFontFamily</code></td> - </tr> - <tr> - <td><code>@baseLineHeight</code></td> - <td>18px</td> - <td><em class="muted">Must be pixels</em></td> - </tr> - <tr> - <td><code>@altFontFamily</code></td> - <td colspan="2"><code>@serifFontFamily</code></td> - </tr> + <tr> + <td><code>@baseFontSize</code></td> + <td>13px</td> + <td><em class="muted">Must be pixels</em></td> + </tr> + <tr> + <td><code>@baseFontFamily</code></td> + <td colspan="2"><code>@sansFontFamily</code></td> + </tr> + <tr> + <td><code>@baseLineHeight</code></td> + <td>18px</td> + <td><em class="muted">Must be pixels</em></td> + </tr> + <tr> + <td><code>@altFontFamily</code></td> + <td colspan="2"><code>@serifFontFamily</code></td> + </tr> + + <tr> + <td><code>@headingsFontFamily</code></td> + <td colspan="2"><code>inherit</code></td> + </tr> + <tr> + <td><code>@headingsFontWeight</code></td> + <td colspan="2"><code>bold</code></td> + </tr> + <tr> + <td><code>@headingsColor</code></td> + <td colspan="2"><code>inherit</code></td> + </tr> + </tbody> + </table> + <h3>{{_i}}Tables{{/i}}</h3> + <table class="table table-bordered table-striped"> + <tbody> + <tr> + <td class="span4"><code>@tableBackground</code></td> + <td><code>transparent</code></td> + </tr> + <tr> + <td><code>@tableBackgroundAccent</code></td> + <td><code>#f9f9f9</code></td> + </tr> + <tr> + <td><code>@tableBackgroundHover</code></td> + <td><code>#f5f5f5</code></td> + </tr> + <tr> + <td><code>@tableBorder</code></td> + <td><code>ddd</code></td> + </tr> + </tbody> + </table> + + <h3>{{_i}}Grayscale colors{{/i}}</h3> + <table class="table table-bordered table-striped"> + <tbody> + <tr> + <td class="span4"><code>@black</code></td> + <td>#000</td> + <td class="swatch-col"><span class="swatch" style="background-color: #000;"></span></td> + </tr> + <tr> + <td><code>@grayDarker</code></td> + <td>#222</td> + <td><span class="swatch" style="background-color: #222;"></span></td> + </tr> + <tr> + <td><code>@grayDark</code></td> + <td>#333</td> + <td><span class="swatch" style="background-color: #333;"></span></td> + </tr> + <tr> + <td><code>@gray</code></td> + <td>#555</td> + <td><span class="swatch" style="background-color: #555;"></span></td> + </tr> + <tr> + <td><code>@grayLight</code></td> + <td>#999</td> + <td><span class="swatch" style="background-color: #999;"></span></td> + </tr> + <tr> + <td><code>@grayLighter</code></td> + <td>#eee</td> + <td><span class="swatch" style="background-color: #eee;"></span></td> + </tr> + <tr> + <td><code>@white</code></td> + <td>#fff</td> + <td><span class="swatch swatch-bordered" style="background-color: #fff;"></span></td> + </tr> + </tbody> + </table> + <h3>{{_i}}Accent colors{{/i}}</h3> + <table class="table table-bordered table-striped"> + <tbody> + <tr> + <td class="span4"><code>@blue</code></td> + <td>#049cdb</td> + <td class="swatch-col"><span class="swatch" style="background-color: #049cdb;"></span></td> + </tr> + <tr> + <td><code>@green</code></td> + <td>#46a546</td> + <td><span class="swatch" style="background-color: #46a546;"></span></td> + </tr> + <tr> + <td><code>@red</code></td> + <td>#9d261d</td> + <td><span class="swatch" style="background-color: #9d261d;"></span></td> + </tr> + <tr> + <td><code>@yellow</code></td> + <td>#ffc40d</td> + <td><span class="swatch" style="background-color: #ffc40d;"></span></td> + </tr> + <tr> + <td><code>@orange</code></td> + <td>#f89406</td> + <td><span class="swatch" style="background-color: #f89406;"></span></td> + </tr> + <tr> + <td><code>@pink</code></td> + <td>#c3325f</td> + <td><span class="swatch" style="background-color: #c3325f;"></span></td> + </tr> + <tr> + <td><code>@purple</code></td> + <td>#7a43b6</td> + <td><span class="swatch" style="background-color: #7a43b6;"></span></td> + </tr> + </tbody> + </table> - <tr> - <td class="span2"><code>@headingsFontFamily</code></td> - <td colspan="2"><code>inherit</code></td> - </tr> - <tr> - <td><code>@headingsFontWeight</code></td> - <td colspan="2"><code>bold</code></td> - </tr> - <tr> - <td><code>@headingsColor</code></td> - <td colspan="2"><code>inherit</code></td> - </tr> - </tbody> - </table> - <h3>{{_i}}Tables{{/i}}</h3> - <table class="table table-bordered table-striped"> - <tbody> - <tr> - <td class="span2"><code>@tableBackground</code></td> - <td><code>transparent</code></td> - </tr> - <tr> - <td><code>@tableBackgroundAccent</code></td> - <td><code>#f9f9f9</code></td> - </tr> - <tr> - <td><code>@tableBackgroundHover</code></td> - <td><code>#f5f5f5</code></td> - </tr> - <tr> - <td><code>@tableBorder</code></td> - <td><code>ddd</code></td> - </tr> - </tbody> - </table> - </div> - <div class="span6"> - <h3>{{_i}}Grayscale colors{{/i}}</h3> - <table class="table table-bordered table-striped"> - <tbody> - <tr> - <td class="span2"><code>@black</code></td> - <td>#000</td> - <td class="swatch-col"><span class="swatch" style="background-color: #000;"></span></td> - </tr> - <tr> - <td><code>@grayDarker</code></td> - <td>#222</td> - <td><span class="swatch" style="background-color: #222;"></span></td> - </tr> - <tr> - <td><code>@grayDark</code></td> - <td>#333</td> - <td><span class="swatch" style="background-color: #333;"></span></td> - </tr> - <tr> - <td><code>@gray</code></td> - <td>#555</td> - <td><span class="swatch" style="background-color: #555;"></span></td> - </tr> - <tr> - <td><code>@grayLight</code></td> - <td>#999</td> - <td><span class="swatch" style="background-color: #999;"></span></td> - </tr> - <tr> - <td><code>@grayLighter</code></td> - <td>#eee</td> - <td><span class="swatch" style="background-color: #eee;"></span></td> - </tr> - <tr> - <td><code>@white</code></td> - <td>#fff</td> - <td><span class="swatch swatch-bordered" style="background-color: #fff;"></span></td> - </tr> - </tbody> - </table> - <h3>{{_i}}Accent colors{{/i}}</h3> - <table class="table table-bordered table-striped"> - <tbody> - <tr> - <td class="span2"><code>@blue</code></td> - <td>#049cdb</td> - <td class="swatch-col"><span class="swatch" style="background-color: #049cdb;"></span></td> - </tr> - <tr> - <td><code>@green</code></td> - <td>#46a546</td> - <td><span class="swatch" style="background-color: #46a546;"></span></td> - </tr> - <tr> - <td><code>@red</code></td> - <td>#9d261d</td> - <td><span class="swatch" style="background-color: #9d261d;"></span></td> - </tr> - <tr> - <td><code>@yellow</code></td> - <td>#ffc40d</td> - <td><span class="swatch" style="background-color: #ffc40d;"></span></td> - </tr> - <tr> - <td><code>@orange</code></td> - <td>#f89406</td> - <td><span class="swatch" style="background-color: #f89406;"></span></td> - </tr> - <tr> - <td><code>@pink</code></td> - <td>#c3325f</td> - <td><span class="swatch" style="background-color: #c3325f;"></span></td> - </tr> - <tr> - <td><code>@purple</code></td> - <td>#7a43b6</td> - <td><span class="swatch" style="background-color: #7a43b6;"></span></td> - </tr> - </tbody> - </table> - </div> - </div> <!-- /row --> <h3>{{_i}}Components{{/i}}</h3> - <div class="row"> - <div class="span6"> - <h4>{{_i}}Buttons{{/i}}</h4> - <table class="table table-bordered table-striped"> - <tbody> - <tr> - <td class="span3"><code>@btnBackground</code></td> - <td><code>@white</code></td> - <td class="swatch-col"><span class="swatch" style="background-color: #fff;"></span></td> - </tr> - <tr> - <td class="span3"><code>@btnBackgroundHighlight</code></td> - <td><code>darken(@white, 10%)</code></td> - <td class="swatch-col"><span class="swatch" style="background-color: #e6e6e6;"></span></td> - </tr> - <tr> - <td class="span3"><code>@btnBorder</code></td> - <td><code>darken(@white, 20%)</code></td> - <td class="swatch-col"><span class="swatch" style="background-color: #ccc;"></span></td> - </tr> - <tr> - <td class="span3"><code>@btnPrimaryBackground</code></td> - <td><code>@linkColor</code></td> - <td class="swatch-col"><span class="swatch" style="background-color: #08c;"></span></td> - </tr> - <tr> - <td class="span3"><code>@btnPrimaryBackgroundHighlight</code></td> - <td><code>spin(@btnPrimaryBackground, 15%)</code></td> - <td class="swatch-col"><span class="swatch" style="background-color: #05c;"></span></td> - </tr> + <h4>{{_i}}Buttons{{/i}}</h4> + <table class="table table-bordered table-striped"> + <tbody> + <tr> + <td class="span4"><code>@btnBackground</code></td> + <td><code>@white</code></td> + <td class="swatch-col"><span class="swatch" style="background-color: #fff;"></span></td> + </tr> + <tr> + <td><code>@btnBackgroundHighlight</code></td> + <td><code>darken(@white, 10%)</code></td> + <td class="swatch-col"><span class="swatch" style="background-color: #e6e6e6;"></span></td> + </tr> + <tr> + <td><code>@btnBorder</code></td> + <td><code>darken(@white, 20%)</code></td> + <td class="swatch-col"><span class="swatch" style="background-color: #ccc;"></span></td> + </tr> + + <tr> + <td><code>@btnPrimaryBackground</code></td> + <td><code>@linkColor</code></td> + <td class="swatch-col"><span class="swatch" style="background-color: #08c;"></span></td> + </tr> + <tr> + <td><code>@btnPrimaryBackgroundHighlight</code></td> + <td><code>spin(@btnPrimaryBackground, 15%)</code></td> + <td class="swatch-col"><span class="swatch" style="background-color: #05c;"></span></td> + </tr> + + <tr> + <td><code>@btnInfoBackground</code></td> + <td><code>#5bc0de</code></td> + <td class="swatch-col"><span class="swatch" style="background-color: #5bc0de;"></span></td> + </tr> + <tr> + <td><code>@btnInfoBackgroundHighlight</code></td> + <td><code>#2f96b4</code></td> + <td class="swatch-col"><span class="swatch" style="background-color: #2f96b4;"></span></td> + </tr> + + <tr> + <td><code>@btnSuccessBackground</code></td> + <td><code>#62c462</code></td> + <td class="swatch-col"><span class="swatch" style="background-color: #62c462;"></span></td> + </tr> + <tr> + <td><code>@btnSuccessBackgroundHighlight</code></td> + <td><code>51a351</code></td> + <td class="swatch-col"><span class="swatch" style="background-color: #51a351;"></span></td> + </tr> - <tr> - <td class="span3"><code>@btnInfoBackground</code></td> - <td><code>#5bc0de</code></td> - <td class="swatch-col"><span class="swatch" style="background-color: #5bc0de;"></span></td> - </tr> - <tr> - <td class="span3"><code>@btnInfoBackgroundHighlight</code></td> - <td><code>#2f96b4</code></td> - <td class="swatch-col"><span class="swatch" style="background-color: #2f96b4;"></span></td> - </tr> + <tr> + <td><code>@btnWarningBackground</code></td> + <td><code>lighten(@orange, 15%)</code></td> + <td class="swatch-col"><span class="swatch" style="background-color: #fbb450;"></span></td> + </tr> + <tr> + <td><code>@btnWarningBackgroundHighlight</code></td> + <td><code>@orange</code></td> + <td class="swatch-col"><span class="swatch" style="background-color: #f89406;"></span></td> + </tr> - <tr> - <td class="span3"><code>@btnSuccessBackground</code></td> - <td><code>#62c462</code></td> - <td class="swatch-col"><span class="swatch" style="background-color: #62c462;"></span></td> - </tr> - <tr> - <td class="span3"><code>@btnSuccessBackgroundHighlight</code></td> - <td><code>51a351</code></td> - <td class="swatch-col"><span class="swatch" style="background-color: #51a351;"></span></td> - </tr> + <tr> + <td><code>@btnDangerBackground</code></td> + <td><code>#ee5f5b</code></td> + <td class="swatch-col"><span class="swatch" style="background-color: #ee5f5b;"></span></td> + </tr> + <tr> + <td><code>@btnDangerBackgroundHighlight</code></td> + <td><code>#bd362f</code></td> + <td class="swatch-col"><span class="swatch" style="background-color: #bd362f;"></span></td> + </tr> - <tr> - <td class="span3"><code>@btnWarningBackground</code></td> - <td><code>lighten(@orange, 15%)</code></td> - <td class="swatch-col"><span class="swatch" style="background-color: #fbb450;"></span></td> - </tr> - <tr> - <td class="span3"><code>@btnWarningBackgroundHighlight</code></td> - <td><code>@orange</code></td> - <td class="swatch-col"><span class="swatch" style="background-color: #f89406;"></span></td> - </tr> + <tr> + <td><code>@btnInverseBackground</code></td> + <td><code>@gray</code></td> + <td class="swatch-col"><span class="swatch" style="background-color: #555;"></span></td> + </tr> + <tr> + <td><code>@btnInverseBackgroundHighlight</code></td> + <td><code>@grayDarker</code></td> + <td class="swatch-col"><span class="swatch" style="background-color: #222;"></span></td> + </tr> + </tbody> + </table> + <h4>{{_i}}Forms{{/i}}</h4> + <table class="table table-bordered table-striped"> + <tbody> + <tr> + <td class="span4"><code>@placeholderText</code></td> + <td><code>@grayLight</code></td> + </tr> + <tr> + <td><code>@inputBackground</code></td> + <td><code>@white</code></td> + </tr> + <tr> + <td><code>@inputBorder</code></td> + <td><code>#ccc</code></td> + </tr> + <tr> + <td><code>@inputBorderRadius</code></td> + <td><code>3px</code></td> + </tr> + <tr> + <td><code>@inputDisabledBackground</code></td> + <td><code>@grayLighter</code></td> + </tr> + <tr> + <td><code>@formActionsBackground</code></td> + <td><code>#f5f5f5</code></td> + </tr> + </tbody> + </table> + <h4>{{_i}}Form states and alerts{{/i}}</h4> + <table class="table table-bordered table-striped"> + <tbody> + <tr> + <td class="span4"><code>@warningText</code></td> + <td>#c09853</td> + <td><span class="swatch" style="background-color: #c09853;"></span></td> + </tr> + <tr> + <td><code>@warningBackground</code></td> + <td>#f3edd2</td> + <td class="swatch-col"><span class="swatch" style="background-color: #f3edd2;"></span></td> + </tr> + <tr> + <td><code>@errorText</code></td> + <td>#b94a48</td> + <td><span class="swatch" style="background-color: #b94a48;"></span></td> + </tr> + <tr> + <td><code>@errorBackground</code></td> + <td>#f2dede</td> + <td><span class="swatch" style="background-color: #f2dede;"></span></td> + </tr> + <tr> + <td><code>@successText</code></td> + <td>#468847</td> + <td><span class="swatch" style="background-color: #468847;"></span></td> + </tr> + <tr> + <td><code>@successBackground</code></td> + <td>#dff0d8</td> + <td><span class="swatch" style="background-color: #dff0d8;"></span></td> + </tr> + <tr> + <td><code>@infoText</code></td> + <td>#3a87ad</td> + <td><span class="swatch" style="background-color: #3a87ad;"></span></td> + </tr> + <tr> + <td><code>@infoBackground</code></td> + <td>#d9edf7</td> + <td><span class="swatch" style="background-color: #d9edf7;"></span></td> + </tr> + </tbody> + </table> - <tr> - <td class="span3"><code>@btnDangerBackground</code></td> - <td><code>#ee5f5b</code></td> - <td class="swatch-col"><span class="swatch" style="background-color: #ee5f5b;"></span></td> - </tr> - <tr> - <td class="span3"><code>@btnDangerBackgroundHighlight</code></td> - <td><code>#bd362f</code></td> - <td class="swatch-col"><span class="swatch" style="background-color: #bd362f;"></span></td> - </tr> + <h4>{{_i}}Navbar{{/i}}</h4> + <table class="table table-bordered table-striped"> + <tbody> + <tr> + <td class="span4"><code>@navbarHeight</code></td> + <td>40px</td> + <td class="swatch-col"></td> + </tr> + <tr> + <td><code>@navbarBackground</code></td> + <td><code>@grayDarker</code></td> + <td><span class="swatch" style="background-color: #222;"></span></td> + </tr> + <tr> + <td><code>@navbarBackgroundHighlight</code></td> + <td><code>@grayDark</code></td> + <td><span class="swatch" style="background-color: #333;"></span></td> + </tr> - <tr> - <td class="span3"><code>@btnInverseBackground</code></td> - <td><code>@gray</code></td> - <td class="swatch-col"><span class="swatch" style="background-color: #555;"></span></td> - </tr> - <tr> - <td class="span3"><code>@btnInverseBackgroundHighlight</code></td> - <td><code>@grayDarker</code></td> - <td class="swatch-col"><span class="swatch" style="background-color: #222;"></span></td> - </tr> - </tbody> - </table> - <h4>{{_i}}Forms{{/i}}</h4> - <table class="table table-bordered table-striped"> - <tbody> - <tr> - <td class="span3"><code>@placeholderText</code></td> - <td><code>@grayLight</code></td> - </tr> - <tr> - <td><code>@inputBackground</code></td> - <td><code>@white</code></td> - </tr> - <tr> - <td><code>@inputBorder</code></td> - <td><code>#ccc</code></td> - </tr> - <tr> - <td><code>@inputBorderRadius</code></td> - <td><code>3px</code></td> - </tr> - <tr> - <td><code>@inputDisabledBackground</code></td> - <td><code>@grayLighter</code></td> - </tr> - <tr> - <td><code>@formActionsBackground</code></td> - <td><code>#f5f5f5</code></td> - </tr> - </tbody> - </table> - <h4>{{_i}}Form states and alerts{{/i}}</h4> - <table class="table table-bordered table-striped"> - <tbody> - <tr> - <td class="span3"><code>@warningText</code></td> - <td>#c09853</td> - <td><span class="swatch" style="background-color: #c09853;"></span></td> - </tr> - <tr> - <td><code>@warningBackground</code></td> - <td>#f3edd2</td> - <td class="swatch-col"><span class="swatch" style="background-color: #f3edd2;"></span></td> - </tr> - <tr> - <td><code>@errorText</code></td> - <td>#b94a48</td> - <td><span class="swatch" style="background-color: #b94a48;"></span></td> - </tr> - <tr> - <td><code>@errorBackground</code></td> - <td>#f2dede</td> - <td><span class="swatch" style="background-color: #f2dede;"></span></td> - </tr> - <tr> - <td><code>@successText</code></td> - <td>#468847</td> - <td><span class="swatch" style="background-color: #468847;"></span></td> - </tr> - <tr> - <td><code>@successBackground</code></td> - <td>#dff0d8</td> - <td><span class="swatch" style="background-color: #dff0d8;"></span></td> - </tr> - <tr> - <td><code>@infoText</code></td> - <td>#3a87ad</td> - <td><span class="swatch" style="background-color: #3a87ad;"></span></td> - </tr> - <tr> - <td><code>@infoBackground</code></td> - <td>#d9edf7</td> - <td><span class="swatch" style="background-color: #d9edf7;"></span></td> - </tr> - </tbody> - </table> - </div> - <div class="span6"> - <h4>{{_i}}Navbar{{/i}}</h4> - <table class="table table-bordered table-striped"> - <tbody> - <tr> - <td class="span3"><code>@navbarHeight</code></td> - <td>40px</td> - <td class="swatch-col"></td> - </tr> - <tr> - <td><code>@navbarBackground</code></td> - <td><code>@grayDarker</code></td> - <td><span class="swatch" style="background-color: #222;"></span></td> - </tr> - <tr> - <td><code>@navbarBackgroundHighlight</code></td> - <td><code>@grayDark</code></td> - <td><span class="swatch" style="background-color: #333;"></span></td> - </tr> + <tr> + <td><code>@navbarText</code></td> + <td><code>@grayLight</code></td> + <td><span class="swatch" style="background-color: #999;"></span></td> + </tr> + <tr> + <td><code>@navbarLinkColor</code></td> + <td><code>@grayLight</code></td> + <td><span class="swatch" style="background-color: #999;"></span></td> + </tr> + <tr> + <td><code>@navbarLinkColorHover</code></td> + <td><code>@white</code></td> + <td><span class="swatch swatch-bordered" style="background-color: #fff;"></span></td> + </tr> + <tr> + <td><code>@navbarLinkColorActive</code></td> + <td><code>@navbarLinkColorHover</code></td> + <td><span class="swatch swatch-bordered" style="background-color: #fff;"></span></td> + </tr> + <tr> + <td><code>@navbarLinkBackgroundHover</code></td> + <td><code>transparent</code></td> + <td><span class="swatch swatch-bordered" style="background-color: transparent;"></span></td> + </tr> + <tr> + <td><code>@navbarLinkBackgroundActive</code></td> + <td><code>@navbarBackground</code></td> + <td><span class="swatch swatch-bordered" style="background-color: #fff;"></span></td> + </tr> - <tr> - <td><code>@navbarText</code></td> - <td><code>@grayLight</code></td> - <td><span class="swatch" style="background-color: #999;"></span></td> - </tr> - <tr> - <td><code>@navbarLinkColor</code></td> - <td><code>@grayLight</code></td> - <td><span class="swatch" style="background-color: #999;"></span></td> - </tr> - <tr> - <td><code>@navbarLinkColorHover</code></td> - <td><code>@white</code></td> - <td><span class="swatch swatch-bordered" style="background-color: #fff;"></span></td> - </tr> - <tr> - <td><code>@navbarLinkColorActive</code></td> - <td><code>@navbarLinkColorHover</code></td> - <td><span class="swatch swatch-bordered" style="background-color: #fff;"></span></td> - </tr> - <tr> - <td><code>@navbarLinkBackgroundHover</code></td> - <td><code>transparent</code></td> - <td><span class="swatch swatch-bordered" style="background-color: transparent;"></span></td> - </tr> - <tr> - <td><code>@navbarLinkBackgroundActive</code></td> - <td><code>@navbarBackground</code></td> - <td><span class="swatch swatch-bordered" style="background-color: #fff;"></span></td> - </tr> + <tr> + <td><code>@navbarSearchBackground</code></td> + <td><code>lighten(@navbarBackground, 25%)</code></td> + <td><span class="swatch" style="background-color: #666;"></span></td> + </tr> + <tr> + <td><code>@navbarSearchBackgroundFocus</code></td> + <td><code>@white</code></td> + <td><span class="swatch swatch-bordered" style="background-color: #fff;"></span></td> + </tr> + <tr> + <td><code>@navbarSearchBorder</code></td> + <td><code>darken(@navbarSearchBackground, 30%)</code></td> + <td><span class="swatch" style="background-color: #111;"></span></td> + </tr> + <tr> + <td><code>@navbarSearchPlaceholderColor</code></td> + <td><code>#ccc</code></td> + <td><span class="swatch" style="background-color: #ccc;"></span></td> + </tr> + <tr> + <td><code>@navbarBrandColor</code></td> + <td><code>@navbarLinkColor</code></td> + <td><span class="swatch swatch-bordered" style="background-color: #fff;"></span></td> + </tr> + </tbody> + </table> + <h4>{{_i}}Dropdowns{{/i}}</h4> + <table class="table table-bordered table-striped"> + <tbody> + <tr> + <td class="span4"><code>@dropdownBackground</code></td> + <td><code>@white</code></td> + </tr> + <tr> + <td><code>@dropdownBorder</code></td> + <td><code>rgba(0,0,0,.2)</code></td> + </tr> + <tr> + <td><code>@dropdownLinkColor</code></td> + <td><code>@grayDark</code></td> + </tr> + <tr> + <td><code>@dropdownLinkColorHover</code></td> + <td><code>@white</code></td> + </tr> + <tr> + <td><code>@dropdownLinkBackgroundHover</code></td> + <td><code>@linkColor</code></td> + </tr> + <tr> + <td><code>@@dropdownDividerTop</code></td> + <td><code>#e5e5e5</code></td> + </tr> + <tr> + <td><code>@@dropdownDividerBottom</code></td> + <td><code>@white</code></td> + </tr> + </tbody> + </table> + <h4>{{_i}}Hero unit{{/i}}</h4> + <table class="table table-bordered table-striped"> + <tbody> + <tr> + <td class="span4"><code>@heroUnitBackground</code></td> + <td><code>@grayLighter</code></td> + <td class="swatch-col"><span class="swatch" style="background-color: #eee;"></span></td> + </tr> + <tr> + <td class="span2"><code>@heroUnitHeadingColor</code></td> + <td><code>inherit</code></td> + <td></td> + </tr> + <tr> + <td><code>@heroUnitLeadColor</code></td> + <td><code>inhereit</code></td> + <td></td> + </tr> + </tbody> + </table> - <tr> - <td><code>@navbarSearchBackground</code></td> - <td><code>lighten(@navbarBackground, 25%)</code></td> - <td><span class="swatch" style="background-color: #666;"></span></td> - </tr> - <tr> - <td><code>@navbarSearchBackgroundFocus</code></td> - <td><code>@white</code></td> - <td><span class="swatch swatch-bordered" style="background-color: #fff;"></span></td> - </tr> - <tr> - <td><code>@navbarSearchBorder</code></td> - <td><code>darken(@navbarSearchBackground, 30%)</code></td> - <td><span class="swatch" style="background-color: #111;"></span></td> - </tr> - <tr> - <td><code>@navbarSearchPlaceholderColor</code></td> - <td><code>#ccc</code></td> - <td><span class="swatch" style="background-color: #ccc;"></span></td> - </tr> - <tr> - <td><code>@navbarBrandColor</code></td> - <td><code>@navbarLinkColor</code></td> - <td><span class="swatch swatch-bordered" style="background-color: #fff;"></span></td> - </tr> - </tbody> - </table> - <h4>{{_i}}Dropdowns{{/i}}</h4> - <table class="table table-bordered table-striped"> - <tbody> - <tr> - <td class="span2"><code>@dropdownBackground</code></td> - <td><code>@white</code></td> - </tr> - <tr> - <td><code>@dropdownBorder</code></td> - <td><code>rgba(0,0,0,.2)</code></td> - </tr> - <tr> - <td><code>@dropdownLinkColor</code></td> - <td><code>@grayDark</code></td> - </tr> - <tr> - <td><code>@dropdownLinkColorHover</code></td> - <td><code>@white</code></td> - </tr> - <tr> - <td><code>@dropdownLinkBackgroundHover</code></td> - <td><code>@linkColor</code></td> - </tr> - </tbody> - </table> - <h4>{{_i}}Hero unit{{/i}}</h4> - <table class="table table-bordered table-striped"> - <tbody> - <tr> - <td class="span3"><code>@heroUnitBackground</code></td> - <td><code>@grayLighter</code></td> - <td class="swatch-col"><span class="swatch" style="background-color: #eee;"></span></td> - </tr> - <tr> - <td class="span2"><code>@heroUnitHeadingColor</code></td> - <td><code>inherit</code></td> - <td></td> - </tr> - <tr> - <td><code>@heroUnitLeadColor</code></td> - <td><code>inhereit</code></td> - <td></td> - </tr> - </tbody> - </table> - </div> - </div><!-- /row --> </section> @@ -733,7 +734,7 @@ <tr> <td><code>#grid > .fluid()</code></td> <td><code>@fluidGridColumnWidth, @fluidGridGutterWidth</code></td> - <td>{{_i}}Generate a precent grid system with <em>n</em> columns and <em>x</em> % wide gutter{{/i}}</td> + <td>{{_i}}Generate a percent grid system with <em>n</em> columns and <em>x</em> % wide gutter{{/i}}</td> </tr> <tr> <td><code>#grid > .input()</code></td> @@ -822,6 +823,11 @@ <td><code>@columnCount, @columnGap: @gridGutterWidth</code></td> <td>{{_i}}Make the content of any element use CSS3 columns{{/i}}</td> </tr> + <tr> + <td><code>.hyphens()</code></td> + <td><code>@mode: auto</code></td> + <td>{{_i}}CSS3 hyphenation when you want it (includes <code>word-wrap: break-word</code>){{/i}}</td> + </tr> </tbody> </table> <h3>{{_i}}Backgrounds and gradients{{/i}}</h3> @@ -898,8 +904,8 @@ <div class="row"> <div class="span4"> <h3>{{_i}}Node with makefile{{/i}}</h3> - <p>{{_i}}Install the LESS command line compiler and uglify-js globally with npm by running the following command:{{/i}}</p> - <pre>$ npm install -g less uglify-js</pre> + <p>{{_i}}Install the LESS command line compiler, JSHint, Recess, and uglify-js globally with npm by running the following command:{{/i}}</p> + <pre>$ npm install -g less jshint recess uglify-js</pre> <p>{{_i}}Once installed just run <code>make</code> from the root of your bootstrap directory and you're all set.{{/i}}</p> <p>{{_i}}Additionally, if you have <a href="https://github.com/mynyml/watchr">watchr</a> installed, you may run <code>make watch</code> to have bootstrap automatically rebuilt every time you edit a file in the bootstrap lib (this isn't required, just a convenience method).{{/i}}</p> </div><!-- /span4 --> diff --git a/docs/templates/pages/scaffolding.mustache b/docs/templates/pages/scaffolding.mustache index 13c777a260..1088cc7753 100644 --- a/docs/templates/pages/scaffolding.mustache +++ b/docs/templates/pages/scaffolding.mustache @@ -1,19 +1,19 @@ - <!-- Masthead - ================================================== --> - <header class="jumbotron subhead" id="overview"> - <h1>{{_i}}Scaffolding{{/i}}</h1> - <p class="lead">{{_i}}Bootstrap is built on a responsive 12-column grid. We've also included fixed- and fluid-width layouts based on that system.{{/i}}</p> - <div class="subnav"> - <ul class="nav nav-pills"> - <li><a href="#global">{{_i}}Global styles{{/i}}</a></li> - <li><a href="#gridSystem">{{_i}}Grid system{{/i}}</a></li> - <li><a href="#fluidGridSystem">{{_i}}Fluid grid system{{/i}}</a></li> - <li><a href="#gridCustomization">{{_i}}Customizing{{/i}}</a></li> - <li><a href="#layouts">{{_i}}Layouts{{/i}}</a></li> - <li><a href="#responsive">{{_i}}Responsive design{{/i}}</a></li> - </ul> - </div> - </header> +<!-- Masthead +================================================== --> +<header class="jumbotron subhead" id="overview"> + <h1>{{_i}}Scaffolding{{/i}}</h1> + <p class="lead">{{_i}}Bootstrap is built on a responsive 12-column grid. We've also included fixed- and fluid-width layouts based on that system.{{/i}}</p> + <div class="subnav"> + <ul class="nav nav-pills"> + <li><a href="#global">{{_i}}Global styles{{/i}}</a></li> + <li><a href="#gridSystem">{{_i}}Grid system{{/i}}</a></li> + <li><a href="#fluidGridSystem">{{_i}}Fluid grid system{{/i}}</a></li> + <li><a href="#gridCustomization">{{_i}}Customizing{{/i}}</a></li> + <li><a href="#layouts">{{_i}}Layouts{{/i}}</a></li> + <li><a href="#responsive">{{_i}}Responsive design{{/i}}</a></li> + </ul> + </div> +</header> @@ -95,8 +95,7 @@ </div> <div class="row"> <div class="span4"> - <p>{{_i}}The default grid system provided as part of Bootstrap is a <strong>940px-wide, 12-column grid</strong>.{{/i}}</p> - <p>{{_i}}It also has four responsive variations for various devices and resolutions: phone, tablet portrait, tablet landscape and small desktops, and large widescreen desktops.{{/i}}</p> + <p>{{_i}}The default grid system provided in Bootstrap utilizes <strong>12 columns</strong> that render out at widths of 724px, 940px (default without responsive CSS included), and 1170px. Below 767px viewports, the columns become fluid and stack vertically. {{/i}}</p> </div><!-- /.span --> <div class="span4"> <pre class="prettyprint linenums"> @@ -157,11 +156,11 @@ <div class="span6"> <pre class="prettyprint linenums"> <div class="row"> - <div class="span12"> - {{_i}}Level 1 of column{{/i}} + <div class="span6"> + {{_i}}Level 1 column{{/i}} <div class="row"> - <div class="span6">{{_i}}Level 2{{/i}}</div> - <div class="span6">{{_i}}Level 2{{/i}}</div> + <div class="span3">{{_i}}Level 2{{/i}}</div> + <div class="span3">{{_i}}Level 2{{/i}}</div> </div> </div> </div> @@ -452,16 +451,16 @@ </div><!-- /.span --> <div class="span8"> <pre class="prettyprint linenums"> - // {{_i}}Landscape phones and down{{/i}} + /* {{_i}}Landscape phones and down{{/i}} */ @media (max-width: 480px) { ... } - // {{_i}}Landscape phone to portrait tablet{{/i}} + /* {{_i}}Landscape phone to portrait tablet{{/i}} */ @media (max-width: 767px) { ... } - // {{_i}}Portrait tablet to landscape and desktop{{/i}} + /* {{_i}}Portrait tablet to landscape and desktop{{/i}} */ @media (min-width: 768px) and (max-width: 979px) { ... } - // {{_i}}Large desktop{{/i}} + /* {{_i}}Large desktop{{/i}} */ @media (min-width: 1200px) { ... } </pre> </div><!-- /.span --> diff --git a/docs/upgrading.html b/docs/upgrading.html index 2a27b00e61..2a2c398186 100644 --- a/docs/upgrading.html +++ b/docs/upgrading.html @@ -24,6 +24,7 @@ <link rel="apple-touch-icon-precomposed" sizes="114x114" href="assets/ico/apple-touch-icon-114-precomposed.png"> <link rel="apple-touch-icon-precomposed" sizes="72x72" href="assets/ico/apple-touch-icon-72-precomposed.png"> <link rel="apple-touch-icon-precomposed" href="assets/ico/apple-touch-icon-57-precomposed.png"> + </head> <body data-spy="scroll" data-target=".subnav" data-offset="50"> @@ -34,11 +35,11 @@ <div class="navbar navbar-fixed-top"> <div class="navbar-inner"> <div class="container"> - <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"> + <button type="button"class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> - </a> + </button> <a class="brand" href="./index.html">Bootstrap</a> <div class="nav-collapse collapse"> <ul class="nav"> |