diff options
| author | Mark Otto <[email protected]> | 2014-07-07 22:10:22 -0700 |
|---|---|---|
| committer | Mark Otto <[email protected]> | 2014-07-07 22:10:22 -0700 |
| commit | 81b59d35368bc51d361d0352cc92fe99dc580fbf (patch) | |
| tree | 2395d5e79edaaa8c0a7ad82e99931ec895421532 /less | |
| parent | fed2b0f7eb78438eb1b768782b04651881d88740 (diff) | |
| parent | ddee04038f946ac103eb4e70c8eb7adeb2cf563b (diff) | |
| download | bootstrap-81b59d35368bc51d361d0352cc92fe99dc580fbf.tar.xz bootstrap-81b59d35368bc51d361d0352cc92fe99dc580fbf.zip | |
Merge branch 'master' into derp
Conflicts:
docs/_layouts/default.html
docs/assets/css/docs.min.css
docs/assets/css/src/docs.css
docs/assets/js/docs.min.js
docs/assets/js/src/application.js
Diffstat (limited to 'less')
33 files changed, 317 insertions, 170 deletions
diff --git a/less/.csscomb.json b/less/.csscomb.json index 8456e41df..16c82174b 100644 --- a/less/.csscomb.json +++ b/less/.csscomb.json @@ -109,6 +109,8 @@ "list-style-type", "list-style-image", "pointer-events", + "-ms-touch-action", + "touch-action", "cursor", "visibility", "zoom", diff --git a/less/alerts.less b/less/alerts.less index 3eab06629..df070b8ab 100644 --- a/less/alerts.less +++ b/less/alerts.less @@ -33,12 +33,13 @@ } } -// Dismissable alerts +// Dismissible alerts // // Expand the right padding and account for the close button's positioning. -.alert-dismissable { - padding-right: (@alert-padding + 20); +.alert-dismissable, // The misspelled .alert-dismissable was deprecated in 3.2.0. +.alert-dismissible { + padding-right: (@alert-padding + 20); // Adjust close link position .close { diff --git a/less/button-groups.less b/less/button-groups.less index ef11cf12a..c2e2260f0 100644 --- a/less/button-groups.less +++ b/less/button-groups.less @@ -216,6 +216,10 @@ > .btn-group .btn { width: 100%; } + + > .btn-group .dropdown-menu { + left: auto; + } } @@ -228,9 +232,14 @@ // // See https://github.com/twbs/bootstrap/pull/12794 for more. -[data-toggle="buttons"] > .btn > input[type="radio"], -[data-toggle="buttons"] > .btn > input[type="checkbox"] { - position: absolute; - z-index: -1; - opacity: 0; +[data-toggle="buttons"] { + > .btn, + > .btn-group > .btn { + input[type="radio"], + input[type="checkbox"] { + position: absolute; + z-index: -1; + .opacity(0); + } + } } diff --git a/less/buttons.less b/less/buttons.less index d4fc156be..05bd89d08 100644 --- a/less/buttons.less +++ b/less/buttons.less @@ -12,6 +12,7 @@ font-weight: @btn-font-weight; text-align: center; vertical-align: middle; + touch-action: manipulation; cursor: pointer; background-image: none; // Reset unusual Firefox-on-Android default style; see https://github.com/necolas/normalize.css/issues/214 border: 1px solid transparent; @@ -22,13 +23,15 @@ &, &:active, &.active { - &:focus { + &:focus, + &.focus { .tab-focus(); } } &:hover, - &:focus { + &:focus, + &.focus { color: @btn-default-color; text-decoration: none; } @@ -85,7 +88,6 @@ .btn-link { color: @link-color; font-weight: normal; - cursor: pointer; border-radius: 0; &, @@ -140,8 +142,6 @@ .btn-block { display: block; width: 100%; - padding-left: 0; - padding-right: 0; } // Vertically space out multiple block buttons diff --git a/less/carousel.less b/less/carousel.less index 6f5023756..1644ddf7f 100644 --- a/less/carousel.less +++ b/less/carousel.less @@ -28,7 +28,9 @@ > .active, > .next, - > .prev { display: block; } + > .prev { + display: block; + } > .active { left: 0; @@ -110,20 +112,22 @@ .icon-prev, .glyphicon-chevron-left { left: 50%; + margin-left: -10px; } .icon-next, .glyphicon-chevron-right { right: 50%; + margin-right: -10px; } .icon-prev, .icon-next { width: 20px; height: 20px; margin-top: -10px; - margin-left: -10px; font-family: serif; } + .icon-prev { &:before { content: '\2039';// SINGLE LEFT-POINTING ANGLE QUOTATION MARK (U+2039) @@ -213,9 +217,16 @@ width: 30px; height: 30px; margin-top: -15px; - margin-left: -15px; font-size: 30px; } + .glyphicon-chevron-left, + .icon-prev { + margin-left: -15px; + } + .glyphicon-chevron-right, + .icon-next { + margin-right: -15px; + } } // Show and left align the captions diff --git a/less/code.less b/less/code.less index 4d0eadc6d..baa13df61 100644 --- a/less/code.less +++ b/less/code.less @@ -28,6 +28,12 @@ kbd { background-color: @kbd-bg; border-radius: @border-radius-small; box-shadow: inset 0 -1px 0 rgba(0,0,0,.25); + + kbd { + padding: 0; + font-size: 100%; + box-shadow: none; + } } // Blocks of code diff --git a/less/dropdowns.less b/less/dropdowns.less index f165165e7..3eb7fc05c 100644 --- a/less/dropdowns.less +++ b/less/dropdowns.less @@ -38,6 +38,7 @@ margin: 2px 0 0; // override default ul list-style: none; font-size: @font-size-base; + text-align: left; // Ensures proper alignment if parent has it changed (e.g., modal footer) background-color: @dropdown-bg; border: 1px solid @dropdown-fallback-border; // IE8 fallback border: 1px solid @dropdown-border; @@ -154,6 +155,7 @@ font-size: @font-size-small; line-height: @line-height-base; color: @dropdown-header-color; + white-space: nowrap; // as with > li > a } // Backdrop to catch body clicks on mobile, etc. diff --git a/less/forms.less b/less/forms.less index 8578e8ce6..baeea7ca6 100644 --- a/less/forms.less +++ b/less/forms.less @@ -11,7 +11,7 @@ fieldset { padding: 0; margin: 0; border: 0; - // Chrome and Firefox set a `min-width: -webkit-min-content;` on fieldsets, + // Chrome and Firefox set a `min-width: min-content;` on fieldsets, // so we reset that to ensure it behaves more like a standard block element. // See https://github.com/twbs/bootstrap/issues/12359. min-width: 0; @@ -31,6 +31,7 @@ legend { label { display: inline-block; + max-width: 100%; // Force IE8 to wrap long content (see https://github.com/twbs/bootstrap/issues/13141) margin-bottom: 5px; font-weight: bold; } @@ -164,13 +165,18 @@ input[type="search"] { } -// Special styles for iOS date input +// Special styles for iOS temporal inputs // -// In Mobile Safari, date inputs require a pixel line-height that matches the +// In Mobile Safari, setting `display: block` on temporal inputs causes the +// text within the input to become vertically misaligned. +// As a workaround, we set a pixel line-height that matches the // given height of the input. Since this fucks up everything else, we have to // appropriately reset it for Internet Explorer and the size variations. -input[type="date"] { +input[type="date"], +input[type="time"], +input[type="datetime-local"], +input[type="month"] { line-height: @input-height-base; // IE8+ misaligns the text within date inputs, so we reset line-height: @line-height-base ~"\0"; @@ -200,12 +206,13 @@ input[type="date"] { .radio, .checkbox { + position: relative; display: block; - min-height: @line-height-computed; // clear the floating input if there is no label text margin-top: 10px; margin-bottom: 10px; label { + min-height: @line-height-computed; // Ensure the input doesn't jump when there is no text padding-left: 20px; margin-bottom: 0; font-weight: normal; @@ -216,9 +223,11 @@ input[type="date"] { .radio-inline input[type="radio"], .checkbox input[type="checkbox"], .checkbox-inline input[type="checkbox"] { - float: left; + position: absolute; margin-left: -20px; + margin-top: 4px \9; } + .radio + .radio, .checkbox + .checkbox { margin-top: -5px; // Move up sibling radios or checkboxes for tighter spacing @@ -241,19 +250,55 @@ input[type="date"] { } // Apply same disabled cursor tweak as for inputs +// Some special care is needed because <label>s don't inherit their parent's `cursor`. // // Note: Neither radios nor checkboxes can be readonly. input[type="radio"], -input[type="checkbox"], -.radio, +input[type="checkbox"] { + &[disabled], + &.disabled, + fieldset[disabled] & { + cursor: not-allowed; + } +} +// These classes are used directly on <label>s .radio-inline, -.checkbox, .checkbox-inline { - &[disabled], + &.disabled, fieldset[disabled] & { cursor: not-allowed; } } +// These classes are used on elements with <label> descendants +.radio, +.checkbox { + &.disabled, + fieldset[disabled] & { + label { + cursor: not-allowed; + } + } +} + + +// Static form control text +// +// Apply class to a `p` element to make any string of text align with labels in +// a horizontal form layout. + +.form-control-static { + // Size it appropriately next to real form controls + padding-top: (@padding-base-vertical + 1); + padding-bottom: (@padding-base-vertical + 1); + // Remove default margin from `p` + margin-bottom: 0; + + &.input-lg, + &.input-sm { + padding-left: 0; + padding-right: 0; + } +} // Form control sizing @@ -261,11 +306,13 @@ input[type="checkbox"], // Build on `.form-control` with modifier classes to decrease or increase the // height and font-size of form controls. -.input-sm { +.input-sm, +.form-group-sm .form-control { .input-size(@input-height-small; @padding-small-vertical; @padding-small-horizontal; @font-size-small; @line-height-small; @border-radius-small); } -.input-lg { +.input-lg, +.form-group-lg .form-control { .input-size(@input-height-large; @padding-large-vertical; @padding-large-horizontal; @font-size-large; @line-height-large; @border-radius-large); } @@ -286,8 +333,9 @@ input[type="checkbox"], // Feedback icon (requires .glyphicon classes) .form-control-feedback { position: absolute; - top: (@line-height-computed + 5); // Height of the `label` and its margin + top: 0; right: 0; + z-index: 2; // Ensure icon is above input groups display: block; width: @input-height-base; height: @input-height-base; @@ -316,14 +364,15 @@ input[type="checkbox"], .form-control-validation(@state-danger-text; @state-danger-text; @state-danger-bg); } +// Reposition feedback icon if input has visible label above +.has-feedback label { -// Static form control text -// -// Apply class to a `p` element to make any string of text align with labels in -// a horizontal form layout. - -.form-control-static { - margin-bottom: 0; // Remove default margin from `p` + & ~ .form-control-feedback { + top: (@line-height-computed + 5); // Height of the `label` and its margin + } + &.sr-only ~ .form-control-feedback { + top: 0; + } } @@ -340,7 +389,6 @@ input[type="checkbox"], } - // Inline forms // // Make forms appear inline(-block) by adding the `.form-inline` class. Inline @@ -399,19 +447,19 @@ input[type="checkbox"], display: inline-block; margin-top: 0; margin-bottom: 0; - padding-left: 0; vertical-align: middle; + + label { + padding-left: 0; + } } .radio input[type="radio"], .checkbox input[type="checkbox"] { - float: none; + position: relative; margin-left: 0; } - // Validation states - // - // Reposition the icon because it's now within a grid column and columns have - // `position: relative;` on them. Also accounts for the grid gutter padding. + // Re-override the feedback icon. .has-feedback .form-control-feedback { top: 0; } @@ -449,11 +497,6 @@ input[type="checkbox"], .make-row(); } - .form-control-static { - padding-top: (@padding-base-vertical + 1); - padding-bottom: (@padding-base-vertical + 1); - } - // Reset spacing and right align labels, but scope to media queries so that // labels on narrow viewports stack the same as a default form example. @media (min-width: @screen-sm-min) { @@ -469,7 +512,25 @@ input[type="checkbox"], // Reposition the icon because it's now within a grid column and columns have // `position: relative;` on them. Also accounts for the grid gutter padding. .has-feedback .form-control-feedback { - top: 0; right: (@grid-gutter-width / 2); } + + // Form group sizes + // + // Quick utility class for applying `.input-lg` and `.input-sm` styles to the + // inputs and labels within a `.form-group`. + .form-group-lg { + @media (min-width: @screen-sm-min) { + .control-label { + padding-top: ((@padding-large-vertical * @line-height-large) + 1); + } + } + } + .form-group-sm { + @media (min-width: @screen-sm-min) { + .control-label { + padding-top: (@padding-small-vertical + 1); + } + } + } } diff --git a/less/glyphicons.less b/less/glyphicons.less index 789c5e7f4..d3485dcb1 100644 --- a/less/glyphicons.less +++ b/less/glyphicons.less @@ -10,11 +10,11 @@ // Import the fonts @font-face { font-family: 'Glyphicons Halflings'; - src: ~"url('@{icon-font-path}@{icon-font-name}.eot')"; - src: ~"url('@{icon-font-path}@{icon-font-name}.eot?#iefix') format('embedded-opentype')", - ~"url('@{icon-font-path}@{icon-font-name}.woff') format('woff')", - ~"url('@{icon-font-path}@{icon-font-name}.ttf') format('truetype')", - ~"url('@{icon-font-path}@{icon-font-name}.svg#@{icon-font-svg-id}') format('svg')"; + src: url('@{icon-font-path}@{icon-font-name}.eot'); + src: url('@{icon-font-path}@{icon-font-name}.eot?#iefix') format('embedded-opentype'), + url('@{icon-font-path}@{icon-font-name}.woff') format('woff'), + url('@{icon-font-path}@{icon-font-name}.ttf') format('truetype'), + url('@{icon-font-path}@{icon-font-name}.svg#@{icon-font-svg-id}') format('svg'); } // Catchall baseclass diff --git a/less/input-groups.less b/less/input-groups.less index a11147463..a8712f25b 100644 --- a/less/input-groups.less +++ b/less/input-groups.less @@ -39,10 +39,14 @@ .input-group-lg > .form-control, .input-group-lg > .input-group-addon, -.input-group-lg > .input-group-btn > .btn { .input-lg(); } +.input-group-lg > .input-group-btn > .btn { + .input-lg(); +} .input-group-sm > .form-control, .input-group-sm > .input-group-addon, -.input-group-sm > .input-group-btn > .btn { .input-sm(); } +.input-group-sm > .input-group-btn > .btn { + .input-sm(); +} // Display as table-cell diff --git a/less/list-group.less b/less/list-group.less index 2514389b1..7d857cfd3 100644 --- a/less/list-group.less +++ b/less/list-group.less @@ -74,7 +74,8 @@ a.list-group-item { &.disabled:focus { background-color: @list-group-disabled-bg; color: @list-group-disabled-color; - + cursor: not-allowed; + // Force color to inherit for custom content .list-group-item-heading { color: inherit; @@ -94,7 +95,9 @@ a.list-group-item { border-color: @list-group-active-border; // Force color to inherit for custom content - .list-group-item-heading { + .list-group-item-heading, + .list-group-item-heading > small, + .list-group-item-heading > .small { color: inherit; } .list-group-item-text { diff --git a/less/mixins/buttons.less b/less/mixins/buttons.less index d7f7cd97a..92d8a056c 100644 --- a/less/mixins/buttons.less +++ b/less/mixins/buttons.less @@ -10,16 +10,17 @@ &:hover, &:focus, + &.focus, &:active, &.active, - .open .dropdown-toggle& { + .open > .dropdown-toggle& { color: @color; background-color: darken(@background, 10%); border-color: darken(@border, 12%); } &:active, &.active, - .open .dropdown-toggle& { + .open > .dropdown-toggle& { background-image: none; } &.disabled, @@ -28,6 +29,7 @@ &, &:hover, &:focus, + &.focus, &:active, &.active { background-color: @background; diff --git a/less/mixins/forms.less b/less/mixins/forms.less index 3c260f52d..6f55ed967 100644 --- a/less/mixins/forms.less +++ b/less/mixins/forms.less @@ -10,7 +10,11 @@ .radio, .checkbox, .radio-inline, - .checkbox-inline { + .checkbox-inline, + &.radio label, + &.checkbox label, + &.radio-inline label, + &.checkbox-inline label { color: @text-color; } // Set the border and box shadow on specific inputs to match @@ -39,7 +43,7 @@ // Form control focus state // // Generate a customized focus state and for any input with the specified color, -// which defaults to the `@input-focus-border` variable. +// which defaults to the `@input-border-focus` variable. // // We highly encourage you to not customize the default value, but instead use // this to tweak colors on an as-needed basis. This aesthetic change is based on diff --git a/less/mixins/gradients.less b/less/mixins/gradients.less index e7d261598..0b88a89cc 100644 --- a/less/mixins/gradients.less +++ b/less/mixins/gradients.less @@ -7,7 +7,7 @@ // Creates two color stops, start and end, by specifying a color and position for each color stop. // Color stops are not available in IE9 and below. .horizontal(@start-color: #555; @end-color: #333; @start-percent: 0%; @end-percent: 100%) { - background-image: -webkit-linear-gradient(left, color-stop(@start-color @start-percent), color-stop(@end-color @end-percent)); // Safari 5.1-6, Chrome 10+ + background-image: -webkit-linear-gradient(left, @start-color @start-percent, @end-color @end-percent); // Safari 5.1-6, Chrome 10+ background-image: -o-linear-gradient(left, @start-color @start-percent, @end-color @end-percent); // Opera 12 background-image: linear-gradient(to right, @start-color @start-percent, @end-color @end-percent); // Standard, IE10, Firefox 16+, Opera 12.10+, Safari 7+, Chrome 26+ background-repeat: repeat-x; diff --git a/less/mixins/grid.less b/less/mixins/grid.less index c2c6f0e75..cae5eaff9 100644 --- a/less/mixins/grid.less +++ b/less/mixins/grid.less @@ -3,11 +3,11 @@ // Generate semantic grid columns with these mixins. // Centered container element -.container-fixed() { +.container-fixed(@gutter: @grid-gutter-width) { margin-right: auto; margin-left: auto; - padding-left: (@grid-gutter-width / 2); - padding-right: (@grid-gutter-width / 2); + padding-left: (@gutter / 2); + padding-right: (@gutter / 2); &:extend(.clearfix all); } diff --git a/less/mixins/panels.less b/less/mixins/panels.less index e2c2e462f..49ee10d4a 100644 --- a/less/mixins/panels.less +++ b/less/mixins/panels.less @@ -11,6 +11,10 @@ + .panel-collapse > .panel-body { border-top-color: @border; } + .badge { + color: @heading-bg-color; + background-color: @heading-text-color; + } } & > .panel-footer { + .panel-collapse > .panel-body { diff --git a/less/mixins/progress-bar.less b/less/mixins/progress-bar.less index f71a57154..f07996a34 100644 --- a/less/mixins/progress-bar.less +++ b/less/mixins/progress-bar.less @@ -2,6 +2,8 @@ .progress-bar-variant(@color) { background-color: @color; + + // Deprecated parent class requirement as of v3.2.0 .progress-striped & { #gradient > .striped(); } diff --git a/less/mixins/resize.less b/less/mixins/resize.less index fabb15d7f..3acd3afdb 100644 --- a/less/mixins/resize.less +++ b/less/mixins/resize.less @@ -2,5 +2,5 @@ .resizable(@direction) { resize: @direction; // Options: horizontal, vertical, both - overflow: auto; // Safari fix + overflow: auto; // Per CSS3 UI, `resize` only applies when `overflow` isn't `visible` } diff --git a/less/mixins/table-row.less b/less/mixins/table-row.less index 30a30e363..0f287f1a8 100644 --- a/less/mixins/table-row.less +++ b/less/mixins/table-row.less @@ -20,6 +20,7 @@ > td.@{state}:hover, > th.@{state}:hover, &.@{state}:hover > td, + &:hover > .@{state}, &.@{state}:hover > th { background-color: darken(@background, 5%); } diff --git a/less/mixins/vendor-prefixes.less b/less/mixins/vendor-prefixes.less index 4418ac911..e2008c8b2 100644 --- a/less/mixins/vendor-prefixes.less +++ b/less/mixins/vendor-prefixes.less @@ -1,6 +1,6 @@ // Vendor Prefixes // -// All vendor mixins are deprecated as of v3.2 due to the introduction of +// All vendor mixins are deprecated as of v3.2.0 due to the introduction of // Autoprefixer in our Gruntfile. They will be removed in v4. // - Animations @@ -131,10 +131,10 @@ transform: scaleY(@ratio); } .skew(@x; @y) { - -webkit-transform: skew(@x, @y); + -webkit-transform: skewX(@x) skewY(@y); -ms-transform: skewX(@x) skewY(@y); // See https://github.com/twbs/bootstrap/issues/4885; IE9+ - -o-transform: skew(@x, @y); - transform: skew(@x, @y); + -o-transform: skewX(@x) skewY(@y); + transform: skewX(@x) skewY(@y); } .translate(@x; @y) { -webkit-transform: translate(@x, @y); diff --git a/less/modals.less b/less/modals.less index 093d05131..6da50ba92 100644 --- a/less/modals.less +++ b/less/modals.less @@ -15,8 +15,7 @@ // Container that the modal scrolls within .modal { display: none; - overflow: auto; - overflow-y: scroll; + overflow: hidden; position: fixed; top: 0; right: 0; @@ -31,10 +30,14 @@ // When fading in the modal, animate it to slide down &.fade .modal-dialog { - .translate(0, -25%); + .translate3d(0, -25%, 0); .transition-transform(~"0.3s ease-out"); } - &.in .modal-dialog { .translate(0, 0)} + &.in .modal-dialog { .translate3d(0, 0, 0) } +} +.modal-open .modal { + overflow-x: hidden; + overflow-y: auto; } // Shell div to position the modal with bottom padding diff --git a/less/navbar.less b/less/navbar.less index b5e9a5f8d..c7bdd36cc 100644 --- a/less/navbar.less +++ b/less/navbar.less @@ -92,7 +92,7 @@ .navbar-collapse { max-height: @navbar-collapse-max-height; - @media (max-width: @screen-xs-min) and (orientation: landscape) { + @media (max-device-width: @screen-xs-min) and (orientation: landscape) { max-height: 200px; } } @@ -141,6 +141,7 @@ right: 0; left: 0; z-index: @zindex-navbar-fixed; + .translate3d(0, 0, 0); // Undo the rounded corners @media (min-width: @grid-float-breakpoint) { @@ -172,6 +173,10 @@ text-decoration: none; } + > img { + display: block; + } + @media (min-width: @grid-float-breakpoint) { .navbar > .container &, .navbar > .container-fluid & { @@ -270,26 +275,10 @@ padding-bottom: @navbar-padding-vertical; } } - - &.navbar-right:last-child { - margin-right: -@navbar-padding-horizontal; - } } } -// Component alignment -// -// Repurpose the pull utilities as their own navbar utilities to avoid specificity -// issues with parents and chaining. Only do this when the navbar is uncollapsed -// though so that navbar contents properly stack and align in mobile. - -@media (min-width: @grid-float-breakpoint) { - .navbar-left { .pull-left(); } - .navbar-right { .pull-right(); } -} - - // Navbar form // // Extension of the `.form-inline` with some extra flavor for optimum display in @@ -325,11 +314,6 @@ padding-top: 0; padding-bottom: 0; .box-shadow(none); - - // Outdent the form if last child to line up with content down the page - &.navbar-right:last-child { - margin-right: -@navbar-padding-horizontal; - } } } @@ -374,14 +358,31 @@ float: left; margin-left: @navbar-padding-horizontal; margin-right: @navbar-padding-horizontal; + } +} + + +// Component alignment +// +// Repurpose the pull utilities as their own navbar utilities to avoid specificity +// issues with parents and chaining. Only do this when the navbar is uncollapsed +// though so that navbar contents properly stack and align in mobile. +// +// Declared after the navbar components to ensure more specificity on the margins. + +@media (min-width: @grid-float-breakpoint) { + .navbar-left { .pull-left(); } + .navbar-right { + .pull-right(); + margin-right: -@navbar-padding-horizontal; - // Outdent the form if last child to line up with content down the page - &.navbar-right:last-child { + ~ .navbar-right { margin-right: 0; } } } + // Alternate navbars // -------------------------------------------------- diff --git a/less/navs.less b/less/navs.less index 9e729b39f..98a64307a 100644 --- a/less/navs.less +++ b/less/navs.less @@ -162,7 +162,7 @@ > li { float: none; - > a { + > a { text-align: center; margin-bottom: 5px; } diff --git a/less/normalize.less b/less/normalize.less index 024e257c1..ce04b6a2f 100644 --- a/less/normalize.less +++ b/less/normalize.less @@ -1,4 +1,4 @@ -/*! normalize.css v3.0.0 | MIT License | git.io/normalize */ +/*! normalize.css v3.0.1 | MIT License | git.io/normalize */ // // 1. Set default font family to sans-serif. @@ -24,7 +24,9 @@ body { // ========================================================================== // -// Correct `block` display not defined in IE 8/9. +// Correct `block` display not defined for any HTML5 element in IE 8/9. +// Correct `block` display not defined for `details` or `summary` in IE 10/11 and Firefox. +// Correct `block` display not defined for `main` in IE 11. // article, @@ -66,8 +68,8 @@ audio:not([controls]) { } // -// Address `[hidden]` styling not present in IE 8/9. -// Hide the `template` element in IE, Safari, and Firefox < 22. +// Address `[hidden]` styling not present in IE 8/9/10. +// Hide the `template` element in IE 8/9/11, Safari, and Firefox < 22. // [hidden], @@ -99,7 +101,7 @@ a:hover { // ========================================================================== // -// Address styling not present in IE 8/9, Safari 5, and Chrome. +// Address styling not present in IE 8/9/10/11, Safari, and Chrome. // abbr[title] { @@ -107,7 +109,7 @@ abbr[title] { } // -// Address style set to `bolder` in Firefox 4+, Safari 5, and Chrome. +// Address style set to `bolder` in Firefox 4+, Safari, and Chrome. // b, @@ -116,7 +118,7 @@ strong { } // -// Address styling not present in Safari 5 and Chrome. +// Address styling not present in Safari and Chrome. // dfn { @@ -125,7 +127,7 @@ dfn { // // Address variable `h1` font-size and margin within `section` and `article` -// contexts in Firefox 4+, Safari 5, and Chrome. +// contexts in Firefox 4+, Safari, and Chrome. // h1 { @@ -174,7 +176,7 @@ sub { // ========================================================================== // -// Remove border when inside `a` element in IE 8/9. +// Remove border when inside `a` element in IE 8/9/10. // img { @@ -182,7 +184,7 @@ img { } // -// Correct overflow displayed oddly in IE 9. +// Correct overflow not hidden in IE 9/10/11. // svg:not(:root) { @@ -193,7 +195,7 @@ svg:not(:root) { // ========================================================================== // -// Address margin not present in IE 8/9 and Safari 5. +// Address margin not present in IE 8/9 and Safari. // figure { @@ -242,7 +244,7 @@ samp { // 1. Correct color not being inherited. // Known issue: affects color of disabled elements. // 2. Correct font properties not being inherited. -// 3. Address margins set differently in Firefox 4+, Safari 5, and Chrome. +// 3. Address margins set differently in Firefox 4+, Safari, and Chrome. // button, @@ -256,7 +258,7 @@ textarea { } // -// Address `overflow` set to `hidden` in IE 8/9/10. +// Address `overflow` set to `hidden` in IE 8/9/10/11. // button { @@ -266,7 +268,7 @@ button { // // Address inconsistent `text-transform` inheritance for `button` and `select`. // All other form control elements do not inherit `text-transform` values. -// Correct `button` style inheritance in Firefox, IE 8+, and Opera +// Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera. // Correct `select` style inheritance in Firefox. // @@ -345,8 +347,8 @@ input[type="number"]::-webkit-outer-spin-button { } // -// 1. Address `appearance` set to `searchfield` in Safari 5 and Chrome. -// 2. Address `box-sizing` set to `border-box` in Safari 5 and Chrome +// 1. Address `appearance` set to `searchfield` in Safari and Chrome. +// 2. Address `box-sizing` set to `border-box` in Safari and Chrome // (include `-moz` to future-proof). // @@ -379,7 +381,7 @@ fieldset { } // -// 1. Correct `color` not being inherited in IE 8/9. +// 1. Correct `color` not being inherited in IE 8/9/10/11. // 2. Remove padding so people aren't caught out if they zero out fieldsets. // @@ -389,7 +391,7 @@ legend { } // -// Remove default vertical scrollbar in IE 8/9. +// Remove default vertical scrollbar in IE 8/9/10/11. // textarea { @@ -420,4 +422,4 @@ table { td, th { padding: 0; -}
\ No newline at end of file +} diff --git a/less/panels.less b/less/panels.less index 9afa4cbfd..2dc21316d 100644 --- a/less/panels.less +++ b/less/panels.less @@ -86,7 +86,9 @@ border-top-width: 0; } } - +.list-group + .panel-footer { + border-top-width: 0; +} // Tables in panels // @@ -95,7 +97,8 @@ .panel { > .table, - > .table-responsive > .table { + > .table-responsive > .table, + > .panel-collapse > .table { margin-bottom: 0; } // Add border top radius for first one @@ -206,7 +209,7 @@ .panel-heading { border-bottom: 0; - + .panel-collapse .panel-body { + + .panel-collapse > .panel-body { border-top: 1px solid @panel-inner-border; } } diff --git a/less/progress-bars.less b/less/progress-bars.less index 74b702843..d5fbfb7db 100644 --- a/less/progress-bars.less +++ b/less/progress-bars.less @@ -6,6 +6,13 @@ // Bar animations // ------------------------- +// WebKit +@-webkit-keyframes progress-bar-stripes { + from { background-position: 40px 0; } + to { background-position: 0 0; } +} + +// Spec and IE10+ @keyframes progress-bar-stripes { from { background-position: 40px 0; } to { background-position: 0 0; } @@ -41,23 +48,27 @@ } // Striped bars -.progress-striped .progress-bar { +// +// `.progress-striped .progress-bar` is deprecated as of v3.2.0 in favor of the +// `.progress-bar-striped` class, which you just add to an existing +// `.progress-bar`. +.progress-striped .progress-bar, +.progress-bar-striped { #gradient > .striped(); background-size: 40px 40px; } // Call animation for the active one -.progress.active .progress-bar { +// +// `.progress.active .progress-bar` is deprecated as of v3.2.0 in favor of the +// `.progress-bar.active` approach. +.progress.active .progress-bar, +.progress-bar.active { .animation(progress-bar-stripes 2s linear infinite); } // Account for lower percentages .progress-bar { - &[aria-valuenow="1"], - &[aria-valuenow="2"] { - min-width: 30px; - } - &[aria-valuenow="0"] { color: @gray-light; min-width: 30px; diff --git a/less/responsive-utilities.less b/less/responsive-utilities.less index 93f2e8ea8..b1db31d7b 100644 --- a/less/responsive-utilities.less +++ b/less/responsive-utilities.less @@ -14,7 +14,8 @@ // For more information, see the following: // // Issue: https://github.com/twbs/bootstrap/issues/10497 -// Docs: http://getbootstrap.com/getting-started/#browsers +// Docs: http://getbootstrap.com/getting-started/#support-ie10-width +// Source: http://timkadlec.com/2013/01/windows-phone-8-and-device-width/ // Source: http://timkadlec.com/2012/10/ie10-snap-mode-and-responsive-design/ @-ms-viewport { diff --git a/less/scaffolding.less b/less/scaffolding.less index c658d7bf5..c1e270fb7 100644 --- a/less/scaffolding.less +++ b/less/scaffolding.less @@ -20,7 +20,7 @@ // Body reset html { - font-size: 62.5%; + font-size: 10px; -webkit-tap-highlight-color: rgba(0,0,0,0); } diff --git a/less/tables.less b/less/tables.less index 555d7924c..38c7da349 100644 --- a/less/tables.less +++ b/less/tables.less @@ -4,7 +4,6 @@ table { - max-width: 100%; background-color: @table-bg; } th { @@ -16,6 +15,7 @@ th { .table { width: 100%; + max-width: 100%; margin-bottom: @line-height-computed; // Cells > thead, @@ -106,10 +106,7 @@ th { .table-striped { > tbody > tr:nth-child(odd) { - > td, - > th { - background-color: @table-bg-accent; - } + background-color: @table-bg-accent; } } @@ -120,10 +117,7 @@ th { .table-hover { > tbody > tr:hover { - > td, - > th { - background-color: @table-bg-hover; - } + background-color: @table-bg-hover; } } @@ -173,7 +167,7 @@ table { width: 100%; margin-bottom: (@line-height-computed * 0.75); overflow-y: hidden; - overflow-x: scroll; + overflow-x: auto; -ms-overflow-style: -ms-autohiding-scrollbar; border: 1px solid @table-border-color; -webkit-overflow-scrolling: touch; diff --git a/less/theme.less b/less/theme.less index 6f957fb39..b089424cf 100644 --- a/less/theme.less +++ b/less/theme.less @@ -48,6 +48,12 @@ background-color: darken(@btn-color, 12%); border-color: darken(@btn-color, 14%); } + + &:disabled, + &[disabled] { + background-color: darken(@btn-color, 12%); + background-image: none; + } } // Common styles @@ -191,6 +197,11 @@ .progress-bar-warning { .progress-bar-styles(@progress-bar-warning-bg); } .progress-bar-danger { .progress-bar-styles(@progress-bar-danger-bg); } +// Reset the striped class because our mixins don't do multiple gradients and +// the above custom styles override the new `.progress-bar-striped` in v3.2.0. +.progress-bar-striped { + #gradient > .striped(); +} // diff --git a/less/type.less b/less/type.less index 91298f1c0..6ab3c0804 100644 --- a/less/type.less +++ b/less/type.less @@ -62,7 +62,7 @@ p { .lead { margin-bottom: @line-height-computed; font-size: floor((@font-size-base * 1.15)); - font-weight: 200; + font-weight: 300; line-height: 1.4; @media (min-width: @screen-sm-min) { @@ -74,12 +74,11 @@ p { // Emphasis & misc // ------------------------- -// Ex: 14px base font * 85% = about 12px +// Ex: (12px small font / 14px base font) * 100% = about 85% small, -.small { font-size: 85%; } - -// Undo browser default styling -cite { font-style: normal; } +.small { + font-size: floor((100% * @font-size-small / @font-size-base)); +} mark, .mark { @@ -92,6 +91,12 @@ mark, .text-right { text-align: right; } .text-center { text-align: center; } .text-justify { text-align: justify; } +.text-nowrap { white-space: nowrap; } + +// Transformation +.text-lowercase { text-transform: lowercase; } +.text-uppercase { text-transform: uppercase; } +.text-capitalize { text-transform: capitalize; } // Contextual colors .text-muted { @@ -209,13 +214,13 @@ dd { @media (min-width: @grid-float-breakpoint) { dt { float: left; - width: (@component-offset-horizontal - 20); + width: (@dl-horizontal-offset - 20); clear: left; text-align: right; .text-overflow(); } dd { - margin-left: @component-offset-horizontal; + margin-left: @dl-horizontal-offset; } } } diff --git a/less/utilities.less b/less/utilities.less index a26031214..c0becabe3 100644 --- a/less/utilities.less +++ b/less/utilities.less @@ -53,4 +53,5 @@ .affix { position: fixed; + .translate3d(0, 0, 0); } diff --git a/less/variables.less b/less/variables.less index cdc1ba881..c797ae08a 100644 --- a/less/variables.less +++ b/less/variables.less @@ -7,11 +7,12 @@ // //## Gray and brand colors for use across Bootstrap. -@gray-darker: lighten(#000, 13.5%); // #222 -@gray-dark: lighten(#000, 20%); // #333 -@gray: lighten(#000, 33.5%); // #555 -@gray-light: lighten(#000, 60%); // #999 -@gray-lighter: lighten(#000, 93.5%); // #eee +@gray-base: #000; +@gray-darker: lighten(@gray-base, 13.5%); // #222 +@gray-dark: lighten(@gray-base, 20%); // #333 +@gray: lighten(@gray-base, 33.5%); // #555 +@gray-light: lighten(@gray-base, 46.7%); // #777 +@gray-lighter: lighten(@gray-base, 93.5%); // #eee @brand-primary: #428bca; @brand-success: #5cb85c; @@ -236,7 +237,7 @@ //** Text color for headers within dropdown menus. @dropdown-header-color: @gray-light; -// Note: Deprecated @dropdown-caret-color as of v3.1.0 +//** Deprecated `@dropdown-caret-color` as of v3.1.0 @dropdown-caret-color: #000; @@ -249,8 +250,8 @@ @zindex-navbar: 1000; @zindex-dropdown: 1000; -@zindex-popover: 1010; -@zindex-tooltip: 1030; +@zindex-popover: 1060; +@zindex-tooltip: 1070; @zindex-navbar-fixed: 1030; @zindex-modal-background: 1040; @zindex-modal: 1050; @@ -261,27 +262,32 @@ //## Define the breakpoints at which your layout will change, adapting to different screen sizes. // Extra small screen / phone -// Note: Deprecated @screen-xs and @screen-phone as of v3.0.1 +//** Deprecated `@screen-xs` as of v3.0.1 @screen-xs: 480px; +//** Deprecated `@screen-xs-min` as of v3.2.0 @screen-xs-min: @screen-xs; +//** Deprecated `@screen-phone` as of v3.0.1 @screen-phone: @screen-xs-min; // Small screen / tablet -// Note: Deprecated @screen-sm and @screen-tablet as of v3.0.1 +//** Deprecated `@screen-sm` as of v3.0.1 @screen-sm: 768px; @screen-sm-min: @screen-sm; +//** Deprecated `@screen-tablet` as of v3.0.1 @screen-tablet: @screen-sm-min; // Medium screen / desktop -// Note: Deprecated @screen-md and @screen-desktop as of v3.0.1 +//** Deprecated `@screen-md` as of v3.0.1 @screen-md: 992px; @screen-md-min: @screen-md; +//** Deprecated `@screen-desktop` as of v3.0.1 @screen-desktop: @screen-md-min; // Large screen / wide desktop -// Note: Deprecated @screen-lg and @screen-lg-desktop as of v3.0.1 +//** Deprecated `@screen-lg` as of v3.0.1 @screen-lg: 1200px; @screen-lg-min: @screen-lg; +//** Deprecated `@screen-lg-desktop` as of v3.0.1 @screen-lg-desktop: @screen-lg-min; // So media queries don't overlap when required, provide a maximum @@ -363,7 +369,7 @@ // Inverted navbar // Reset inverted navbar basics -@navbar-inverse-color: @gray-light; +@navbar-inverse-color: lighten(@gray-light, 12%); @navbar-inverse-bg: #222; @navbar-inverse-border: darken(@navbar-inverse-bg, 10%); @@ -817,6 +823,8 @@ // //## +//** Horizontal offset for forms and lists. +@component-offset-horizontal: 180px; //** Text muted color @text-muted: @gray-light; //** Abbreviations and acronyms border color @@ -831,14 +839,9 @@ @blockquote-border-color: @gray-lighter; //** Page header border color @page-header-border-color: @gray-lighter; - - -//== Miscellaneous -// -//## - +//** Width of horizontal description list titles +@dl-horizontal-offset: @component-offset-horizontal; //** Horizontal line color. @hr-border: @gray-lighter; -//** Horizontal offset for forms and lists. -@component-offset-horizontal: 180px; + |
