From 29e495f03cda05fd7fc362420ae86619c27b582e Mon Sep 17 00:00:00 2001 From: Fabien Date: Mon, 30 Dec 2013 05:52:00 +0100 Subject: Add Embed responsive utility --- less/utilities.less | 36 ++++++++++++++++++++++++++++++++++++ 1 file changed, 36 insertions(+) (limited to 'less') diff --git a/less/utilities.less b/less/utilities.less index a26031214..415d76a8a 100644 --- a/less/utilities.less +++ b/less/utilities.less @@ -54,3 +54,39 @@ .affix { position: fixed; } + + +// Embeds responsive +// ------------------------- + +// Credit: Nicolas Gallagher + +.embed-responsive { + position: relative; + display: block; + height: 0; + padding: 0; + overflow: hidden; + + .embed-responsive-item, + iframe, + embed, + object { + position: absolute; + top: 0; + left: 0; + bottom: 0; + height: 100%; + width: 100%; + } + + // Modifier class for 16:9 aspect ratio + &.embed-responsive-16by9 { + padding-bottom: 56.25%; + } + + // Modifier class for 4:3 aspect ratio + &.embed-responsive-4by3 { + padding-bottom: 75%; + } +} -- cgit v1.2.3 From d3aad7e35505d0f06843921439f8d9f0a2f36b34 Mon Sep 17 00:00:00 2001 From: Frederick Marcoux Date: Fri, 31 Jan 2014 15:17:49 -0500 Subject: Added .list-group-item.disabled Added support for disabled List group item. --- less/list-group.less | 17 +++++++++++++++++ 1 file changed, 17 insertions(+) (limited to 'less') diff --git a/less/list-group.less b/less/list-group.less index 3343f8e5e..4990002c4 100644 --- a/less/list-group.less +++ b/less/list-group.less @@ -64,6 +64,23 @@ a.list-group-item { text-decoration: none; background-color: @list-group-hover-bg; } + + // Disabled state + &.disabled, + &.disabled:hover, + &.disabled:focus { + background-color: @list-group-disabled-bg; + color: @list-group-disabled-color; + border-color: @list-group-disabled-border; + + // Force color to inherit for custom content + .list-group-item-heading { + color: inherit; + } + .list-group-item-text { + color: @list-group-disabled-text-color; + } + } // Active class on item itself, not parent &.active, -- cgit v1.2.3 From d1a7271ea1272e0f9775d49e6a84ee49819e0094 Mon Sep 17 00:00:00 2001 From: Frederick Marcoux Date: Fri, 31 Jan 2014 15:25:09 -0500 Subject: Update variables.less --- less/variables.less | 8 ++++++++ 1 file changed, 8 insertions(+) (limited to 'less') diff --git a/less/variables.less b/less/variables.less index ebc72c00e..814f45351 100644 --- a/less/variables.less +++ b/less/variables.less @@ -633,6 +633,14 @@ @list-group-active-border: @list-group-active-bg; @list-group-active-text-color: lighten(@list-group-active-bg, 40%); +//** Text color of disabled list elements +@list-group-disabled-color: @grey-light; // Or something else you want +//** Background color of disabled list elements +@list-group-disabled-bg: @grey-ligher; // Or something else you want +//** Border color of disabled list elements +@list-group-disabled-border: #eee; // Or something else you want +@list-group-disabled-text-color: lighten(@list-group-disabled-bg, 40%); // Or something else you want + @list-group-link-color: #555; @list-group-link-heading-color: #333; -- cgit v1.2.3 From c4e242bdb170be26e64e859c5636f3cb0285f679 Mon Sep 17 00:00:00 2001 From: Chris Rebert Date: Mon, 10 Feb 2014 10:34:38 -0800 Subject: add .sr-only-focusable; fixes #12259 --- less/scaffolding.less | 16 ++++++++++++++++ 1 file changed, 16 insertions(+) (limited to 'less') diff --git a/less/scaffolding.less b/less/scaffolding.less index fe29f2d62..c658d7bf5 100644 --- a/less/scaffolding.less +++ b/less/scaffolding.less @@ -132,3 +132,19 @@ hr { clip: rect(0,0,0,0); border: 0; } + +// Use in conjunction with .sr-only to only display content when it's focused. +// Useful for "Skip to main content" links; see http://www.w3.org/TR/2013/NOTE-WCAG20-TECHS-20130905/G1 +// Credit: HTML5 Boilerplate + +.sr-only-focusable { + &:active, + &:focus { + position: static; + width: auto; + height: auto; + margin: 0; + overflow: visible; + clip: auto; + } +} -- cgit v1.2.3 From 2fba53e600a796995f07e96c53c11ed22bfe8e06 Mon Sep 17 00:00:00 2001 From: DaSch Date: Fri, 14 Feb 2014 13:56:36 +0100 Subject: add posibillity to hover links and not background in list-groups --- less/list-group.less | 1 + less/variables.less | 1 + 2 files changed, 2 insertions(+) (limited to 'less') diff --git a/less/list-group.less b/less/list-group.less index 3343f8e5e..d645f2900 100644 --- a/less/list-group.less +++ b/less/list-group.less @@ -62,6 +62,7 @@ a.list-group-item { &:hover, &:focus { text-decoration: none; + color: @list-group-link-hover-color; background-color: @list-group-hover-bg; } diff --git a/less/variables.less b/less/variables.less index 3846adc59..fcbadd73b 100644 --- a/less/variables.less +++ b/less/variables.less @@ -654,6 +654,7 @@ @list-group-active-text-color: lighten(@list-group-active-bg, 40%); @list-group-link-color: #555; +@list-group-link-hover-color: @list-group-link-color; @list-group-link-heading-color: #333; -- cgit v1.2.3 From eef939916bb840b405a2f0cceca1c00daa5ed328 Mon Sep 17 00:00:00 2001 From: rhaase Date: Fri, 14 Feb 2014 15:51:01 +0100 Subject: Defined and use variables for .panel-heading & .panel-footer padding --- less/panels.less | 4 ++-- less/variables.less | 2 ++ 2 files changed, 4 insertions(+), 2 deletions(-) (limited to 'less') diff --git a/less/panels.less b/less/panels.less index 20dd14938..bb3593c87 100644 --- a/less/panels.less +++ b/less/panels.less @@ -20,7 +20,7 @@ // Optional heading .panel-heading { - padding: 10px 15px; + padding: @panel-heading-padding; border-bottom: 1px solid transparent; .border-top-radius((@panel-border-radius - 1)); @@ -43,7 +43,7 @@ // Optional footer (stays gray in every modifier class) .panel-footer { - padding: 10px 15px; + padding: @panel-footer-padding; background-color: @panel-footer-bg; border-top: 1px solid @panel-inner-border; .border-bottom-radius((@panel-border-radius - 1)); diff --git a/less/variables.less b/less/variables.less index 3846adc59..14ef0ec1b 100644 --- a/less/variables.less +++ b/less/variables.less @@ -663,6 +663,8 @@ @panel-bg: #fff; @panel-body-padding: 15px; +@panel-heading-padding: 10px 15px; +@panel-footer-padding: @panel-heading-padding; @panel-border-radius: @border-radius-base; //** Border color for elements within panels -- cgit v1.2.3 From ca15add174fdd8507699e1ab18591ecb037b4396 Mon Sep 17 00:00:00 2001 From: Demian Ferreiro Date: Wed, 19 Feb 2014 16:45:28 -0300 Subject: Fix UAs required message position on grouped radio buttons Instead of not rendering the element at all with display:none, use opacity:0 and z-index:-1 so the radio element has a defined position on the document and user agents can show the required message in the right place. --- less/button-groups.less | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) (limited to 'less') diff --git a/less/button-groups.less b/less/button-groups.less index 27eb796b8..afeb70716 100644 --- a/less/button-groups.less +++ b/less/button-groups.less @@ -222,5 +222,7 @@ // Checkbox and radio options [data-toggle="buttons"] > .btn > input[type="radio"], [data-toggle="buttons"] > .btn > input[type="checkbox"] { - display: none; + opacity: 0; + position: absolute; + z-index: -1; } -- cgit v1.2.3 From 49094844ac55a0e08d6d847b0e07868f8b639037 Mon Sep 17 00:00:00 2001 From: Supergibbs Date: Fri, 21 Feb 2014 20:50:27 -0800 Subject: Correctly set .btn-link colors in a .navbar and .navbar-inverse #12694 --- less/navbar.less | 28 ++++++++++++++++++++++++++++ 1 file changed, 28 insertions(+) (limited to 'less') diff --git a/less/navbar.less b/less/navbar.less index 8c4c210b2..34897e225 100644 --- a/less/navbar.less +++ b/less/navbar.less @@ -492,6 +492,20 @@ } } + .btn-link { + color: @navbar-default-link-color; + &:hover, + &:focus { + color: @navbar-default-link-hover-color; + } + &[disabled], + fieldset[disabled] & { + &:hover, + &:focus { + color: @navbar-default-link-disabled-color; + } + } + } } // Inverse navbar @@ -613,4 +627,18 @@ } } + .btn-link { + color: @navbar-inverse-link-color; + &:hover, + &:focus { + color: @navbar-inverse-link-hover-color; + } + &[disabled], + fieldset[disabled] & { + &:hover, + &:focus { + color: @navbar-inverse-link-disabled-color; + } + } + } } -- cgit v1.2.3 From b99be29f32f3db208b47bd33fbef1f63405ccfdc Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Sat, 22 Feb 2014 12:13:11 -0800 Subject: Fixes #12756: Ensure horizontal dls are cleared by moving the clearfix out of the media query --- less/type.less | 16 ++++++++++------ 1 file changed, 10 insertions(+), 6 deletions(-) (limited to 'less') diff --git a/less/type.less b/less/type.less index 5e2a21905..c63e5d9f2 100644 --- a/less/type.less +++ b/less/type.less @@ -141,7 +141,7 @@ cite { font-style: normal; } // Lists -// -------------------------------------------------- +// ------------------------- // Unordered and Ordered lists ul, @@ -195,8 +195,12 @@ dd { // Defaults to being stacked without any of the below styles applied, until the // grid breakpoint is reached (default of ~768px). -@media (min-width: @grid-float-breakpoint) { - .dl-horizontal { +.dl-horizontal { + dd { + &:extend(.clearfix all); // Clear the floated `dt` if an empty `dd` is present + } + + @media (min-width: @grid-float-breakpoint) { dt { float: left; width: (@component-offset-horizontal - 20); @@ -206,13 +210,13 @@ dd { } dd { margin-left: @component-offset-horizontal; - &:extend(.clearfix all); // Clear the floated `dt` if an empty `dd` is present } } } -// MISC -// ---- + +// Misc +// ------------------------- // Abbreviations and acronyms abbr[title], -- cgit v1.2.3 From 7e551ecaf71cb9971990e156c54e5ee0fb758a98 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Sat, 22 Feb 2014 12:38:56 -0800 Subject: =?UTF-8?q?Update=20modals=20to=20use=20more=20consistent=20paddin?= =?UTF-8?q?g=E2=80=94modal=20body=20and=20footer=20now=20match=20modal=20h?= =?UTF-8?q?eader?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- less/modals.less | 2 +- less/variables.less | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) (limited to 'less') diff --git a/less/modals.less b/less/modals.less index f4e95346b..0ba977e6d 100644 --- a/less/modals.less +++ b/less/modals.less @@ -98,7 +98,7 @@ // Footer (for actions) .modal-footer { - padding: (@modal-inner-padding - 1) @modal-inner-padding @modal-inner-padding; + padding: @modal-inner-padding; text-align: right; // right align buttons border-top: 1px solid @modal-footer-border-color; &:extend(.clearfix all); // clear it in case folks use .pull-* classes on buttons diff --git a/less/variables.less b/less/variables.less index 3846adc59..fa736f0ac 100644 --- a/less/variables.less +++ b/less/variables.less @@ -558,7 +558,7 @@ //## //** Padding applied to the modal body -@modal-inner-padding: 20px; +@modal-inner-padding: 15px; //** Padding applied to the modal title @modal-title-padding: 15px; -- cgit v1.2.3 From 7b60470e9b6e159205be5f5a38260ef5756d8569 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Sat, 22 Feb 2014 14:16:11 -0800 Subject: Fixes #12801: Add padding to the bottom of .form-control-static to match height of standard form controls --- less/forms.less | 1 + 1 file changed, 1 insertion(+) (limited to 'less') diff --git a/less/forms.less b/less/forms.less index f607b8509..24cb0da69 100644 --- a/less/forms.less +++ b/less/forms.less @@ -418,6 +418,7 @@ input[type="checkbox"], .form-control-static { padding-top: (@padding-base-vertical + 1); + padding-bottom: (@padding-base-vertical + 1); } // Only right align form labels here when the columns stop stacking -- cgit v1.2.3 From 66a229bdbf05861b5fa7e63f898e67bad38923a0 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Sat, 22 Feb 2014 22:46:03 -0800 Subject: Fixes #12822: Scope panel collapse styles to immediate panel bodies only --- less/mixins.less | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'less') diff --git a/less/mixins.less b/less/mixins.less index 33117f2ce..4432cfc2d 100644 --- a/less/mixins.less +++ b/less/mixins.less @@ -424,12 +424,12 @@ background-color: @heading-bg-color; border-color: @heading-border; - + .panel-collapse .panel-body { + + .panel-collapse > .panel-body { border-top-color: @border; } } & > .panel-footer { - + .panel-collapse .panel-body { + + .panel-collapse > .panel-body { border-bottom-color: @border; } } -- cgit v1.2.3 From 754791e3d9b67fd71b6a1250f93ea9723b68e221 Mon Sep 17 00:00:00 2001 From: Chris Rebert Date: Mon, 24 Feb 2014 14:43:09 -0800 Subject: fix #12836 Thanks @Quy. --- less/forms.less | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'less') diff --git a/less/forms.less b/less/forms.less index 24cb0da69..8c90e4fdf 100644 --- a/less/forms.less +++ b/less/forms.less @@ -51,7 +51,7 @@ input[type="search"] { input[type="radio"], input[type="checkbox"] { margin: 4px 0 0; - margin-top: 1px \9; /* IE8-9 */ + margin-top: 1px \9; // IE8-9 line-height: normal; } -- cgit v1.2.3 From f1736e2d32c7f473e8b6a9d466dca4ee31a885cb Mon Sep 17 00:00:00 2001 From: Chris Rebert Date: Tue, 25 Feb 2014 10:17:44 -0800 Subject: update GitHub issue link in comment --- less/component-animations.less | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'less') diff --git a/less/component-animations.less b/less/component-animations.less index 1efe45e2c..ae95fe89d 100644 --- a/less/component-animations.less +++ b/less/component-animations.less @@ -5,7 +5,7 @@ // Heads up! // // We don't use the `.opacity()` mixin here since it causes a bug with text -// fields in IE7-8. Source: https://github.com/twitter/bootstrap/pull/3552. +// fields in IE7-8. Source: https://github.com/twbs/bootstrap/pull/3552. .fade { opacity: 0; -- cgit v1.2.3 From b878491b9a76e2c85787e38e6cc878cd3dca909f Mon Sep 17 00:00:00 2001 From: Lipis Date: Wed, 26 Feb 2014 17:59:36 +0100 Subject: Added the very useful .animation-fill-mode() mixin I think that's the only animation property that was missing and it's quite useful. https://developer.mozilla.org/en-US/docs/Web/CSS/animation-fill-mode --- less/mixins.less | 4 ++++ 1 file changed, 4 insertions(+) (limited to 'less') diff --git a/less/mixins.less b/less/mixins.less index 4432cfc2d..0b4cf88a9 100644 --- a/less/mixins.less +++ b/less/mixins.less @@ -243,6 +243,10 @@ -webkit-animation-direction: @direction; animation-direction: @direction; } +.animation-fill-mode(@fill-mode) { + -webkit-animation-fill-mode: @fill-mode; + animation-fill-mode: @fill-mode; +} // Backface visibility // Prevent browsers from flickering when using CSS 3D transforms. -- cgit v1.2.3 From 77cd015cf001856e1530babfa47b013bd08ab2ad Mon Sep 17 00:00:00 2001 From: Sojaner Date: Thu, 27 Feb 2014 12:35:58 +0330 Subject: Fix for issue #12854 where push and pull resets The col-*-push-0 and col-*-pull-0 classes try to reset the positioning using 0% but this prevents the opposite direction positioning to freeze and not being set correctly. To fix that, these must set the position to auto instead of 0% with means left:auto and right:auto instead of left:0% and right:0%. --- less/mixins.less | 14 ++++++++++++-- 1 file changed, 12 insertions(+), 2 deletions(-) (limited to 'less') diff --git a/less/mixins.less b/less/mixins.less index 4432cfc2d..d024a36ad 100644 --- a/less/mixins.less +++ b/less/mixins.less @@ -827,16 +827,26 @@ width: percentage((@index / @grid-columns)); } } -.calc-grid-column(@index, @class, @type) when (@type = push) { +.calc-grid-column(@index, @class, @type) when (@type = push) and (@index > 0) { .col-@{class}-push-@{index} { left: percentage((@index / @grid-columns)); } } -.calc-grid-column(@index, @class, @type) when (@type = pull) { +.calc-grid-column(@index, @class, @type) when (@type = push) and (@index = 0) { + .col-@{class}-push-0 { + left: auto; + } +} +.calc-grid-column(@index, @class, @type) when (@type = pull) and (@index > 0) { .col-@{class}-pull-@{index} { right: percentage((@index / @grid-columns)); } } +.calc-grid-column(@index, @class, @type) when (@type = pull) and (@index = 0) { + .col-@{class}-pull-0 { + right: auto; + } +} .calc-grid-column(@index, @class, @type) when (@type = offset) { .col-@{class}-offset-@{index} { margin-left: percentage((@index / @grid-columns)); -- cgit v1.2.3 From 2e02ed4e0c285ef36726f553e82819e76ec109fd Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Thu, 27 Feb 2014 11:08:24 -0800 Subject: Fixes #12851: it's not a tumah --- less/mixins.less | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'less') diff --git a/less/mixins.less b/less/mixins.less index 4432cfc2d..66fd041f6 100644 --- a/less/mixins.less +++ b/less/mixins.less @@ -379,7 +379,7 @@ @media only screen and (-webkit-min-device-pixel-ratio: 2), - only screen and ( min--moz-device-pixel-ratio: 2), + only screen and ( min--moz-device-pixel-ratio: 2), // Not a typo only screen and ( -o-min-device-pixel-ratio: 2/1), only screen and ( min-device-pixel-ratio: 2), only screen and ( min-resolution: 192dpi), -- cgit v1.2.3 From 6bd54ef14b880ed71844011f71484ac2e6f7d132 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Thu, 27 Feb 2014 12:17:08 -0800 Subject: 100% less tumah --- less/mixins.less | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) (limited to 'less') diff --git a/less/mixins.less b/less/mixins.less index cb3b12968..727cf55a1 100644 --- a/less/mixins.less +++ b/less/mixins.less @@ -376,14 +376,15 @@ // Retina images // -// Short retina mixin for setting background-image and -size +// Short retina mixin for setting background-image and -size. Note that the +// spelling of `min--moz-device-pixel-ratio` is intentional. .img-retina(@file-1x; @file-2x; @width-1x; @height-1x) { background-image: url("@{file-1x}"); @media only screen and (-webkit-min-device-pixel-ratio: 2), - only screen and ( min--moz-device-pixel-ratio: 2), // Not a typo + only screen and ( min--moz-device-pixel-ratio: 2), only screen and ( -o-min-device-pixel-ratio: 2/1), only screen and ( min-device-pixel-ratio: 2), only screen and ( min-resolution: 192dpi), -- cgit v1.2.3 From e381635b1faf7480bcf54618804a62dd4a049a93 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Mon, 3 Mar 2014 21:39:53 -0800 Subject: Fixes #12593: Add support for table bodies and table rows to the collapse plugin --- less/component-animations.less | 8 +++++--- 1 file changed, 5 insertions(+), 3 deletions(-) (limited to 'less') diff --git a/less/component-animations.less b/less/component-animations.less index ae95fe89d..9400a0d32 100644 --- a/less/component-animations.less +++ b/less/component-animations.less @@ -17,10 +17,12 @@ .collapse { display: none; - &.in { - display: block; - } + + &.in { display: block; } + tr&.in { display: table-row; } + tbody&.in { display: table-row-group; } } + .collapsing { position: relative; height: 0; -- cgit v1.2.3 From 02ca9de45f64947899290c141b0efcb05c927b0d Mon Sep 17 00:00:00 2001 From: Simon Date: Tue, 4 Mar 2014 15:29:53 +0100 Subject: Update csscomb properties. 'colon-spac'e and 'stick-brace' don't take boolean values. --- less/.csscomb.json | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'less') diff --git a/less/.csscomb.json b/less/.csscomb.json index c3d0c088b..8456e41df 100644 --- a/less/.csscomb.json +++ b/less/.csscomb.json @@ -1,7 +1,7 @@ { "always-semicolon": true, "block-indent": 2, - "colon-space": true, + "colon-space": [0, 1], "color-case": "lower", "color-shorthand": true, "combinator-space": true, @@ -10,7 +10,7 @@ "leading-zero": false, "remove-empty-rulesets": true, "rule-indent": 2, - "stick-brace": true, + "stick-brace": " ", "strip-spaces": true, "unitless-zero": true, "vendor-prefix-align": true, -- cgit v1.2.3 From f45df646705f12fe8ce97b886c5c9301ada0c9a5 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Tue, 4 Mar 2014 13:54:09 -0800 Subject: Fixes #12914: Darken immediate children hr elements in jumbotrons --- less/jumbotron.less | 4 ++++ 1 file changed, 4 insertions(+) (limited to 'less') diff --git a/less/jumbotron.less b/less/jumbotron.less index a15e16971..27cd8b81d 100644 --- a/less/jumbotron.less +++ b/less/jumbotron.less @@ -19,6 +19,10 @@ font-weight: 200; } + > hr { + border-top-color: darken(@jumbotron-bg, 10%); + } + .container & { border-radius: @border-radius-large; // Only round corners at higher resolutions if contained in a container } -- cgit v1.2.3 From 1c66f30b6a67d43a7f4da0b3e4d58aa7094d25a7 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Tue, 4 Mar 2014 13:54:56 -0800 Subject: Fixes #12913: Remove scoped media queries from custom xs grid mixins --- less/mixins.less | 12 +++--------- 1 file changed, 3 insertions(+), 9 deletions(-) (limited to 'less') diff --git a/less/mixins.less b/less/mixins.less index 727cf55a1..d11f08034 100644 --- a/less/mixins.less +++ b/less/mixins.less @@ -679,19 +679,13 @@ padding-right: (@gutter / 2); } .make-xs-column-offset(@columns) { - @media (min-width: @screen-xs-min) { - margin-left: percentage((@columns / @grid-columns)); - } + margin-left: percentage((@columns / @grid-columns)); } .make-xs-column-push(@columns) { - @media (min-width: @screen-xs-min) { - left: percentage((@columns / @grid-columns)); - } + left: percentage((@columns / @grid-columns)); } .make-xs-column-pull(@columns) { - @media (min-width: @screen-xs-min) { - right: percentage((@columns / @grid-columns)); - } + right: percentage((@columns / @grid-columns)); } -- cgit v1.2.3 From 7733f2437316c2ae10e669a50771646ae8b8e927 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Tue, 4 Mar 2014 14:12:57 -0800 Subject: Fixes #12868: Enables icon feedback on validation states for large/small inputs. Also reorders the CSS to place Glyhpicons as a dependency before other components for fewer overrides and less specific CSS. --- less/bootstrap.less | 4 ++-- less/forms.less | 33 +++++++++++++++++++++------------ 2 files changed, 23 insertions(+), 14 deletions(-) (limited to 'less') diff --git a/less/bootstrap.less b/less/bootstrap.less index b368b8710..4f85a0dd3 100644 --- a/less/bootstrap.less +++ b/less/bootstrap.less @@ -2,9 +2,10 @@ @import "variables.less"; @import "mixins.less"; -// Reset +// Reset and dependencies @import "normalize.less"; @import "print.less"; +@import "glyphicons.less"; // Core CSS @import "scaffolding.less"; @@ -17,7 +18,6 @@ // Components @import "component-animations.less"; -@import "glyphicons.less"; @import "dropdowns.less"; @import "button-groups.less"; @import "input-groups.less"; diff --git a/less/forms.less b/less/forms.less index 8c90e4fdf..273e36608 100644 --- a/less/forms.less +++ b/less/forms.less @@ -271,18 +271,27 @@ input[type="checkbox"], .form-control { padding-right: (@input-height-base * 1.25); } - - // Feedback icon (requires .glyphicon classes) - .form-control-feedback { - position: absolute; - top: (@line-height-computed + 5); // Height of the `label` and its margin - right: 0; - display: block; - width: @input-height-base; - height: @input-height-base; - line-height: @input-height-base; - text-align: center; - } +} +// Feedback icon (requires .glyphicon classes) +.form-control-feedback { + position: absolute; + top: (@line-height-computed + 5); // Height of the `label` and its margin + right: 0; + display: block; + width: @input-height-base; + height: @input-height-base; + line-height: @input-height-base; + text-align: center; +} +.input-lg + .form-control-feedback { + width: @input-height-large; + height: @input-height-large; + line-height: @input-height-large; +} +.input-sm + .form-control-feedback { + width: @input-height-small; + height: @input-height-small; + line-height: @input-height-small; } // Feedback states -- cgit v1.2.3 From 13ed379767d19040c98fc23bd9b5cdb84e66474b Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Tue, 4 Mar 2014 16:19:30 -0800 Subject: clarify deprecation /cc @cvrebert --- less/variables.less | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'less') diff --git a/less/variables.less b/less/variables.less index b58417e98..9e372f2b0 100644 --- a/less/variables.less +++ b/less/variables.less @@ -257,7 +257,7 @@ //## 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 +// Note: Deprecated @screen-xs and @screen-phone as of v3.0.1, and @screen-xs-min as of v3.2 @screen-xs: 480px; @screen-xs-min: @screen-xs; @screen-phone: @screen-xs-min; -- cgit v1.2.3 From 9dae5368f54a9a5a36849d19350a9109224ad542 Mon Sep 17 00:00:00 2001 From: Chris Rebert Date: Tue, 4 Mar 2014 16:21:17 -0800 Subject: use full version number in deprecation note --- less/variables.less | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'less') diff --git a/less/variables.less b/less/variables.less index 9e372f2b0..8cb951740 100644 --- a/less/variables.less +++ b/less/variables.less @@ -257,7 +257,7 @@ //## 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, and @screen-xs-min as of v3.2 +// Note: Deprecated @screen-xs and @screen-phone as of v3.0.1, and @screen-xs-min as of v3.2.0 @screen-xs: 480px; @screen-xs-min: @screen-xs; @screen-phone: @screen-xs-min; -- cgit v1.2.3 From 24de9b099438c09236b2066333744e3995cd88ab Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Tue, 4 Mar 2014 16:55:15 -0800 Subject: Fixes #12848: Account for and document progress bars at 0-3% --- less/progress-bars.less | 16 ++++++++++++++++ 1 file changed, 16 insertions(+) (limited to 'less') diff --git a/less/progress-bars.less b/less/progress-bars.less index 76c87be17..659821852 100644 --- a/less/progress-bars.less +++ b/less/progress-bars.less @@ -58,6 +58,22 @@ .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; + background-color: transparent; + background-image: none; + box-shadow: none; + } +} + // Variations -- cgit v1.2.3 From 10eb167e35f9047aa6b3c0e420467161a1bc4d2b Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Tue, 4 Mar 2014 22:42:13 -0800 Subject: Fixes #12901: Refactors list group active state for use on non-anchors --- less/list-group.less | 2 ++ 1 file changed, 2 insertions(+) (limited to 'less') diff --git a/less/list-group.less b/less/list-group.less index 3343f8e5e..c352fa133 100644 --- a/less/list-group.less +++ b/less/list-group.less @@ -64,7 +64,9 @@ a.list-group-item { text-decoration: none; background-color: @list-group-hover-bg; } +} +.list-group-item { // Active class on item itself, not parent &.active, &.active:hover, -- cgit v1.2.3 From de8b784913530a00a6be1bcbb6d592bbf47506fa Mon Sep 17 00:00:00 2001 From: Ahmad Nassri Date: Wed, 5 Mar 2014 01:49:14 -0500 Subject: .transition-timing-function Mixin added .transition-timing-function(@timing-function) mixin, defaults to @timing-function. --- less/mixins.less | 4 ++++ 1 file changed, 4 insertions(+) (limited to 'less') diff --git a/less/mixins.less b/less/mixins.less index 5991a8c48..9a3fdd3ac 100644 --- a/less/mixins.less +++ b/less/mixins.less @@ -140,6 +140,10 @@ -webkit-transition-duration: @transition-duration; transition-duration: @transition-duration; } +.transition-timing-function(@timing-function) { + -webkit-animation-timing-function: @timing-function; + animation-timing-function: @timing-function; +} .transition-transform(@transition) { -webkit-transition: -webkit-transform @transition; -moz-transition: -moz-transform @transition; -- cgit v1.2.3 From 17e41098c89a6c74273dee81dbf6c260d19ff412 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Thu, 6 Mar 2014 20:39:19 -0800 Subject: Fixes #12824: Remove white-space: nowrap from code elements --- less/code.less | 1 - 1 file changed, 1 deletion(-) (limited to 'less') diff --git a/less/code.less b/less/code.less index 3eed26c05..4d0eadc6d 100644 --- a/less/code.less +++ b/less/code.less @@ -17,7 +17,6 @@ code { font-size: 90%; color: @code-color; background-color: @code-bg; - white-space: nowrap; border-radius: @border-radius-base; } -- cgit v1.2.3 From 4868096dbdfbf9f82e08cf2906fd2ce19f8f1560 Mon Sep 17 00:00:00 2001 From: mrmrs Date: Thu, 6 Mar 2014 20:59:19 -0800 Subject: Fixes #12934 --- less/popovers.less | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'less') diff --git a/less/popovers.less b/less/popovers.less index 696d74c7d..bf6af40a0 100644 --- a/less/popovers.less +++ b/less/popovers.less @@ -37,7 +37,7 @@ line-height: 18px; background-color: @popover-title-bg; border-bottom: 1px solid darken(@popover-title-bg, 5%); - border-radius: 5px 5px 0 0; + border-radius: (@border-radius-large - 1) (@border-radius-large - 1) 0 0; } .popover-content { -- cgit v1.2.3 From 9dc796155cdc23040bb018f145634ad8deea5326 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Thu, 6 Mar 2014 21:25:34 -0800 Subject: Fixes #12722: Fixes up responsive tables in print Safari renders this fine for one reason or another, but Chrome still renders the media query styles to make tables responsive. This change scopes them to screen devices only, so printing looks boss everywhere. --- less/tables.less | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'less') diff --git a/less/tables.less b/less/tables.less index d5c0afd01..555d7924c 100644 --- a/less/tables.less +++ b/less/tables.less @@ -169,7 +169,7 @@ table { // will display normally. .table-responsive { - @media (max-width: @screen-xs-max) { + @media screen and (max-width: @screen-xs-max) { width: 100%; margin-bottom: (@line-height-computed * 0.75); overflow-y: hidden; -- cgit v1.2.3 From 0c9308a3b29be6d56c582dce33092164be7997b4 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Thu, 6 Mar 2014 21:40:22 -0800 Subject: Rewrite the disabled list group items to simplify styles --- less/list-group.less | 1 - less/variables.less | 20 ++++++++++---------- 2 files changed, 10 insertions(+), 11 deletions(-) (limited to 'less') diff --git a/less/list-group.less b/less/list-group.less index b2f252488..9e3b1ef8e 100644 --- a/less/list-group.less +++ b/less/list-group.less @@ -73,7 +73,6 @@ a.list-group-item { &.disabled:focus { background-color: @list-group-disabled-bg; color: @list-group-disabled-color; - border-color: @list-group-disabled-border; // Force color to inherit for custom content .list-group-item-heading { diff --git a/less/variables.less b/less/variables.less index 823ef859c..bdc719cb3 100644 --- a/less/variables.less +++ b/less/variables.less @@ -643,23 +643,23 @@ //** List group border radius @list-group-border-radius: @border-radius-base; -//** Background color of single list elements on hover +//** Background color of single list items on hover @list-group-hover-bg: #f5f5f5; -//** Text color of active list elements +//** Text color of active list items @list-group-active-color: @component-active-color; -//** Background color of active list elements +//** Background color of active list items @list-group-active-bg: @component-active-bg; //** Border color of active list elements @list-group-active-border: @list-group-active-bg; +//** Text color for content within active list items @list-group-active-text-color: lighten(@list-group-active-bg, 40%); -//** Text color of disabled list elements -@list-group-disabled-color: @gray-light; -//** Background color of disabled list elements -@list-group-disabled-bg: @gray-lighter; -//** Border color of disabled list elements -@list-group-disabled-border: #eee; // Or something else you want -@list-group-disabled-text-color: lighten(@list-group-disabled-bg, 40%); // Or something else you want +//** Text color of disabled list items +@list-group-disabled-color: @gray-light; +//** Background color of disabled list items +@list-group-disabled-bg: @gray-lighter; +//** Text color for content within disabled list items +@list-group-disabled-text-color: @list-group-disabled-color; @list-group-link-color: #555; @list-group-link-heading-color: #333; -- cgit v1.2.3 From 7e299c6a49bced5d2c2581a5504ddf7dbcaf041f Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Thu, 6 Mar 2014 22:32:21 -0800 Subject: Fixes #12683: Remove the overflow: hidden; from the .panel-group > .panel because it apparently serves no purpose and cuts off nested dropdown menus. --- less/panels.less | 1 - 1 file changed, 1 deletion(-) (limited to 'less') diff --git a/less/panels.less b/less/panels.less index bb3593c87..9afa4cbfd 100644 --- a/less/panels.less +++ b/less/panels.less @@ -199,7 +199,6 @@ .panel { margin-bottom: 0; border-radius: @panel-border-radius; - overflow: hidden; // crop contents when collapsed + .panel { margin-top: 5px; } -- cgit v1.2.3 From 705ff7f2275ca823f71ca8dfba27a3b68119a2a4 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Thu, 6 Mar 2014 23:18:13 -0800 Subject: Moving the embed to it's own CSS file, moving the docs to the Components page with an example, fixing a Glyhpicons list problem in the docs --- less/bootstrap.less | 1 + less/responsive-embed.less | 34 ++++++++++++++++++++++++++++++++++ less/utilities.less | 36 ------------------------------------ 3 files changed, 35 insertions(+), 36 deletions(-) create mode 100644 less/responsive-embed.less (limited to 'less') diff --git a/less/bootstrap.less b/less/bootstrap.less index 4f85a0dd3..61b77474f 100644 --- a/less/bootstrap.less +++ b/less/bootstrap.less @@ -35,6 +35,7 @@ @import "media.less"; @import "list-group.less"; @import "panels.less"; +@import "responsive-embed.less"; @import "wells.less"; @import "close.less"; diff --git a/less/responsive-embed.less b/less/responsive-embed.less new file mode 100644 index 000000000..a884d49fe --- /dev/null +++ b/less/responsive-embed.less @@ -0,0 +1,34 @@ +// Embeds responsive +// +// Credit: Nicolas Gallagher and SUIT CSS. + +.embed-responsive { + position: relative; + display: block; + height: 0; + padding: 0; + overflow: hidden; + + .embed-responsive-item, + iframe, + embed, + object { + position: absolute; + top: 0; + left: 0; + bottom: 0; + height: 100%; + width: 100%; + border: 0; + } + + // Modifier class for 16:9 aspect ratio + &.embed-responsive-16by9 { + padding-bottom: 56.25%; + } + + // Modifier class for 4:3 aspect ratio + &.embed-responsive-4by3 { + padding-bottom: 75%; + } +} diff --git a/less/utilities.less b/less/utilities.less index 415d76a8a..a26031214 100644 --- a/less/utilities.less +++ b/less/utilities.less @@ -54,39 +54,3 @@ .affix { position: fixed; } - - -// Embeds responsive -// ------------------------- - -// Credit: Nicolas Gallagher - -.embed-responsive { - position: relative; - display: block; - height: 0; - padding: 0; - overflow: hidden; - - .embed-responsive-item, - iframe, - embed, - object { - position: absolute; - top: 0; - left: 0; - bottom: 0; - height: 100%; - width: 100%; - } - - // Modifier class for 16:9 aspect ratio - &.embed-responsive-16by9 { - padding-bottom: 56.25%; - } - - // Modifier class for 4:3 aspect ratio - &.embed-responsive-4by3 { - padding-bottom: 75%; - } -} -- cgit v1.2.3 From e180258b60c04c7d365f60cebdc1593be39d683d Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Thu, 6 Mar 2014 23:50:55 -0800 Subject: Comment for #12794 --- less/button-groups.less | 10 +++++++++- 1 file changed, 9 insertions(+), 1 deletion(-) (limited to 'less') diff --git a/less/button-groups.less b/less/button-groups.less index afeb70716..ff95b0474 100644 --- a/less/button-groups.less +++ b/less/button-groups.less @@ -220,9 +220,17 @@ // Checkbox and radio options +// +// In order to support the browser's form validation feedback, powered by the +// `required` attribute, we have to "hide" the inputs via `opacity`. We cannot +// use `display: none;` or `visibility: hidden;` as that also hides the popover. +// This way, we ensure a DOM element is visible to position the popover from. +// +// See https://github.com/twbs/bootstrap/pull/12794 for more. + [data-toggle="buttons"] > .btn > input[type="radio"], [data-toggle="buttons"] > .btn > input[type="checkbox"] { - opacity: 0; position: absolute; z-index: -1; + opacity: 0; } -- cgit v1.2.3 From cb7eb674accd24b6b73f26ef23cf4a301b6ebfaf Mon Sep 17 00:00:00 2001 From: Bas Bosman Date: Sat, 22 Feb 2014 11:17:58 +0100 Subject: Add autoprefixer --- less/mixins.less | 74 ++++++++++++++++++++++++++++++++++++++++++++++++- less/progress-bars.less | 7 ----- 2 files changed, 73 insertions(+), 8 deletions(-) (limited to 'less') diff --git a/less/mixins.less b/less/mixins.less index 9a3fdd3ac..e394b8a1e 100644 --- a/less/mixins.less +++ b/less/mixins.less @@ -124,26 +124,39 @@ } // Transitions +// +// Deprecated as of v3.2.0 due to the introduction of autoprefixer (will be removed in v4) .transition(@transition) { -webkit-transition: @transition; + -o-transition: @transition; transition: @transition; } + +// Deprecated as of v3.2.0 due to the introduction of autoprefixer (will be removed in v4) .transition-property(@transition-property) { -webkit-transition-property: @transition-property; transition-property: @transition-property; } + +// Deprecated as of v3.2.0 due to the introduction of autoprefixer (will be removed in v4) .transition-delay(@transition-delay) { -webkit-transition-delay: @transition-delay; transition-delay: @transition-delay; } + +// Deprecated as of v3.2.0 due to the introduction of autoprefixer (will be removed in v4) .transition-duration(@transition-duration) { -webkit-transition-duration: @transition-duration; transition-duration: @transition-duration; } + +// Deprecated as of v3.2.0 due to the introduction of autoprefixer (will be removed in v4) .transition-timing-function(@timing-function) { -webkit-animation-timing-function: @timing-function; animation-timing-function: @timing-function; } + +// Deprecated as of v3.2.0 due to the introduction of autoprefixer (will be removed in v4) .transition-transform(@transition) { -webkit-transition: -webkit-transform @transition; -moz-transition: -moz-transform @transition; @@ -152,65 +165,100 @@ } // Transformations +// +// Deprecated as of v3.2.0 due to the introduction of autoprefixer (will be removed in v4) .scale(@ratio) { -webkit-transform: scale(@ratio); -ms-transform: scale(@ratio); // IE9 only + -o-transform: scale(@ratio); transform: scale(@ratio); } + +// Deprecated as of v3.2.0 due to the introduction of autoprefixer (will be removed in v4) .scale(@ratioX; @ratioY) { -webkit-transform: scale(@ratioX, @ratioY); -ms-transform: scale(@ratioX, @ratioY); // IE9 only + -o-transform: scale(@ratioX, @ratioY); transform: scale(@ratioX, @ratioY); } + +// Deprecated as of v3.2.0 due to the introduction of autoprefixer (will be removed in v4) .scaleX(@ratio) { -webkit-transform: scaleX(@ratio); -ms-transform: scaleX(@ratio); // IE9 only + -o-transform: scaleX(@ratio); transform: scaleX(@ratio); } + +// Deprecated as of v3.2.0 due to the introduction of autoprefixer (will be removed in v4) .scaleY(@ratio) { -webkit-transform: scaleY(@ratio); -ms-transform: scaleY(@ratio); // IE9 only + -o-transform: scaleY(@ratio); transform: scaleY(@ratio); } + +// Deprecated as of v3.2.0 due to the introduction of autoprefixer (will be removed in v4) .skew(@x; @y) { -webkit-transform: skew(@x, @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); } + +// Deprecated as of v3.2.0 due to the introduction of autoprefixer (will be removed in v4) .translate(@x; @y) { -webkit-transform: translate(@x, @y); -ms-transform: translate(@x, @y); // IE9 only + -o-transform: translate(@x, @y); transform: translate(@x, @y); } + +// Deprecated as of v3.2.0 due to the introduction of autoprefixer (will be removed in v4) .translate3d(@x; @y; @z) { -webkit-transform: translate3d(@x, @y, @z); transform: translate3d(@x, @y, @z); } + +// Deprecated as of v3.2.0 due to the introduction of autoprefixer (will be removed in v4) .rotate(@degrees) { -webkit-transform: rotate(@degrees); -ms-transform: rotate(@degrees); // IE9 only + -o-transform: rotate(@degrees); transform: rotate(@degrees); } + +// Deprecated as of v3.2.0 due to the introduction of autoprefixer (will be removed in v4) .rotateX(@degrees) { -webkit-transform: rotateX(@degrees); -ms-transform: rotateX(@degrees); // IE9 only + -o-transform: rotateX(@degrees); transform: rotateX(@degrees); } + +// Deprecated as of v3.2.0 due to the introduction of autoprefixer (will be removed in v4) .rotateY(@degrees) { -webkit-transform: rotateY(@degrees); -ms-transform: rotateY(@degrees); // IE9 only + -o-transform: rotateY(@degrees); transform: rotateY(@degrees); } + +// Deprecated as of v3.2.0 due to the introduction of autoprefixer (will be removed in v4) .perspective(@perspective) { -webkit-perspective: @perspective; -moz-perspective: @perspective; perspective: @perspective; } + +// Deprecated as of v3.2.0 due to the introduction of autoprefixer (will be removed in v4) .perspective-origin(@perspective) { -webkit-perspective-origin: @perspective; -moz-perspective-origin: @perspective; perspective-origin: @perspective; } + +// Deprecated as of v3.2.0 due to the introduction of autoprefixer (will be removed in v4) .transform-origin(@origin) { -webkit-transform-origin: @origin; -moz-transform-origin: @origin; @@ -219,30 +267,45 @@ } // Animations +// +// Deprecated as of v3.2.0 due to the introduction of autoprefixer (will be removed in v4) .animation(@animation) { -webkit-animation: @animation; + -o-animation: @animation; animation: @animation; } + +// Deprecated as of v3.2.0 due to the introduction of autoprefixer (will be removed in v4) .animation-name(@name) { -webkit-animation-name: @name; animation-name: @name; } + +// Deprecated as of v3.2.0 due to the introduction of autoprefixer (will be removed in v4) .animation-duration(@duration) { -webkit-animation-duration: @duration; animation-duration: @duration; } + +// Deprecated as of v3.2.0 due to the introduction of autoprefixer (will be removed in v4) .animation-timing-function(@timing-function) { -webkit-animation-timing-function: @timing-function; animation-timing-function: @timing-function; } + +// Deprecated as of v3.2.0 due to the introduction of autoprefixer (will be removed in v4) .animation-delay(@delay) { -webkit-animation-delay: @delay; animation-delay: @delay; } + +// Deprecated as of v3.2.0 due to the introduction of autoprefixer (will be removed in v4) .animation-iteration-count(@iteration-count) { -webkit-animation-iteration-count: @iteration-count; animation-iteration-count: @iteration-count; } + +// Deprecated as of v3.2.0 due to the introduction of autoprefixer (will be removed in v4) .animation-direction(@direction) { -webkit-animation-direction: @direction; animation-direction: @direction; @@ -255,6 +318,7 @@ // Backface visibility // Prevent browsers from flickering when using CSS 3D transforms. // Default value is `visible`, but can be changed to `hidden` +// Deprecated as of v3.2.0 due to the introduction of autoprefixer (will be removed in v4) .backface-visibility(@visibility){ -webkit-backface-visibility: @visibility; -moz-backface-visibility: @visibility; @@ -262,6 +326,7 @@ } // Box sizing +// Deprecated as of v3.2.0 due to the introduction of autoprefixer (will be removed in v4) .box-sizing(@boxmodel) { -webkit-box-sizing: @boxmodel; -moz-box-sizing: @boxmodel; @@ -270,6 +335,7 @@ // User select // For selecting text on the page +// Deprecated as of v3.2.0 due to the introduction of autoprefixer (will be removed in v4) .user-select(@select) { -webkit-user-select: @select; -moz-user-select: @select; @@ -324,7 +390,8 @@ // 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: linear-gradient(to right, @start-color @start-percent, @end-color @end-percent); // Standard, IE10, Firefox 16+, Opera 12.10+, Safari 7+, Chrome 26+ + 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; filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)",argb(@start-color),argb(@end-color))); // IE9 and down } @@ -335,6 +402,7 @@ // Color stops are not available in IE9 and below. .vertical(@start-color: #555; @end-color: #333; @start-percent: 0%; @end-percent: 100%) { background-image: -webkit-linear-gradient(top, @start-color @start-percent, @end-color @end-percent); // Safari 5.1-6, Chrome 10+ + background-image: -o-linear-gradient(top, @start-color @start-percent, @end-color @end-percent); // Opera 12 background-image: linear-gradient(to bottom, @start-color @start-percent, @end-color @end-percent); // Standard, IE10, Firefox 16+, Opera 12.10+, Safari 7+, Chrome 26+ background-repeat: repeat-x; filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",argb(@start-color),argb(@end-color))); // IE9 and down @@ -343,16 +411,19 @@ .directional(@start-color: #555; @end-color: #333; @deg: 45deg) { background-repeat: repeat-x; background-image: -webkit-linear-gradient(@deg, @start-color, @end-color); // Safari 5.1-6, Chrome 10+ + background-image: -o-linear-gradient(@deg, @start-color, @end-color); // Opera 12 background-image: linear-gradient(@deg, @start-color, @end-color); // Standard, IE10, Firefox 16+, Opera 12.10+, Safari 7+, Chrome 26+ } .horizontal-three-colors(@start-color: #00b3ee; @mid-color: #7a43b6; @color-stop: 50%; @end-color: #c3325f) { background-image: -webkit-linear-gradient(left, @start-color, @mid-color @color-stop, @end-color); + background-image: -o-linear-gradient(left, @start-color, @mid-color @color-stop, @end-color); background-image: linear-gradient(to right, @start-color, @mid-color @color-stop, @end-color); background-repeat: no-repeat; filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)",argb(@start-color),argb(@end-color))); // IE9 and down, gets no color-stop at all for proper fallback } .vertical-three-colors(@start-color: #00b3ee; @mid-color: #7a43b6; @color-stop: 50%; @end-color: #c3325f) { background-image: -webkit-linear-gradient(@start-color, @mid-color @color-stop, @end-color); + background-image: -o-linear-gradient(@start-color, @mid-color @color-stop, @end-color); background-image: linear-gradient(@start-color, @mid-color @color-stop, @end-color); background-repeat: no-repeat; filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",argb(@start-color),argb(@end-color))); // IE9 and down, gets no color-stop at all for proper fallback @@ -364,6 +435,7 @@ } .striped(@color: rgba(255,255,255,.15); @angle: 45deg) { background-image: -webkit-linear-gradient(@angle, @color 25%, transparent 25%, transparent 50%, @color 50%, @color 75%, transparent 75%, transparent); + background-image: -o-linear-gradient(@angle, @color 25%, transparent 25%, transparent 50%, @color 50%, @color 75%, transparent 75%, transparent); background-image: linear-gradient(@angle, @color 25%, transparent 25%, transparent 50%, @color 50%, @color 75%, transparent 75%, transparent); } } diff --git a/less/progress-bars.less b/less/progress-bars.less index 659821852..74b702843 100644 --- a/less/progress-bars.less +++ b/less/progress-bars.less @@ -6,13 +6,6 @@ // 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; } -- cgit v1.2.3 From 164b41b28d2921ed19652095b483d3eaa8d00b1a Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Fri, 7 Mar 2014 00:19:26 -0800 Subject: Fixes #12937: Darken active button states just a smidge more --- less/mixins.less | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'less') diff --git a/less/mixins.less b/less/mixins.less index 9a3fdd3ac..bccb91607 100644 --- a/less/mixins.less +++ b/less/mixins.less @@ -530,7 +530,7 @@ &.active, .open .dropdown-toggle& { color: @color; - background-color: darken(@background, 8%); + background-color: darken(@background, 10%); border-color: darken(@border, 12%); } &:active, -- cgit v1.2.3 From 55b639e928754eff2fd04caf214ed4c52f3009e0 Mon Sep 17 00:00:00 2001 From: Bas Bosman Date: Fri, 7 Mar 2014 09:50:05 +0100 Subject: Rename properties --- less/mixins.less | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'less') diff --git a/less/mixins.less b/less/mixins.less index 0abac7fbb..eee5865ca 100644 --- a/less/mixins.less +++ b/less/mixins.less @@ -152,8 +152,8 @@ // Deprecated as of v3.2.0 due to the introduction of autoprefixer (will be removed in v4) .transition-timing-function(@timing-function) { - -webkit-animation-timing-function: @timing-function; - animation-timing-function: @timing-function; + -webkit-transition-timing-function: @timing-function; + transition-timing-function: @timing-function; } // Deprecated as of v3.2.0 due to the introduction of autoprefixer (will be removed in v4) -- cgit v1.2.3 From d1d5d9041365c92b5e5577d2133a26fe509223e8 Mon Sep 17 00:00:00 2001 From: mrmrs Date: Fri, 7 Mar 2014 00:10:46 -0800 Subject: Fixes #12748 --- less/type.less | 6 ++++++ 1 file changed, 6 insertions(+) (limited to 'less') diff --git a/less/type.less b/less/type.less index c63e5d9f2..91298f1c0 100644 --- a/less/type.less +++ b/less/type.less @@ -81,6 +81,12 @@ small, // Undo browser default styling cite { font-style: normal; } +mark, +.mark { + background-color: @state-warning-bg; + padding: .2em; +} + // Alignment .text-left { text-align: left; } .text-right { text-align: right; } -- cgit v1.2.3 From 0f3b176a763abdaddfe3f538cc386b2b15456d0d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Zlatan=20Vasovi=C4=87?= Date: Fri, 7 Mar 2014 18:54:53 +0100 Subject: Improve badges mixinability --- less/badges.less | 36 ++++++++++++++++++------------------ less/labels.less | 2 +- 2 files changed, 19 insertions(+), 19 deletions(-) (limited to 'less') diff --git a/less/badges.less b/less/badges.less index 56828cab7..20624f30d 100644 --- a/less/badges.less +++ b/less/badges.less @@ -3,7 +3,7 @@ // -------------------------------------------------- -// Base classes +// Base class .badge { display: inline-block; min-width: 10px; @@ -32,24 +32,24 @@ top: 0; padding: 1px 5px; } -} -// Hover state, but only for links -a.badge { - &:hover, - &:focus { - color: @badge-link-hover-color; - text-decoration: none; - cursor: pointer; + // Hover state, but only for links + a& { + &:hover, + &:focus { + color: @badge-link-hover-color; + text-decoration: none; + cursor: pointer; + } } -} -// Account for counters in navs -a.list-group-item.active > .badge, -.nav-pills > .active > a > .badge { - color: @badge-active-color; - background-color: @badge-active-bg; -} -.nav-pills > li > a > .badge { - margin-left: 3px; + // Account for badges in navs + a.list-group-item.active > &, + .nav-pills > .active > a > & { + color: @badge-active-color; + background-color: @badge-active-bg; + } + .nav-pills > li > a > & { + margin-left: 3px; + } } diff --git a/less/labels.less b/less/labels.less index 5db1ed12c..9a5a27006 100644 --- a/less/labels.less +++ b/less/labels.less @@ -15,7 +15,7 @@ border-radius: .25em; // Add hover effects, but only for links - &[href] { + a& { &:hover, &:focus { color: @label-link-hover-color; -- cgit v1.2.3 From 4b53ea30b42991394206a9050355bb3db578e9c0 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Zlatan=20Vasovi=C4=87?= Date: Sat, 8 Mar 2014 10:49:48 +0100 Subject: Update .hide-text() comment --- less/mixins.less | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) (limited to 'less') diff --git a/less/mixins.less b/less/mixins.less index eee5865ca..ee27192fd 100644 --- a/less/mixins.less +++ b/less/mixins.less @@ -72,8 +72,7 @@ // // Heads up! v3 launched with with only `.hide-text()`, but per our pattern for // mixins being reused as classes with the same name, this doesn't hold up. As -// of v3.0.1 we have added `.text-hide()` and deprecated `.hide-text()`. Note -// that we cannot chain the mixins together in Less, so they are repeated. +// of v3.0.1 we have added `.text-hide()` and deprecated `.hide-text()`. // // Source: https://github.com/h5bp/html5-boilerplate/commit/aa0396eae757 -- cgit v1.2.3 From 03701b8d4bdda30dc625cdd263ca586835f544e3 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Sat, 8 Mar 2014 15:32:24 -0800 Subject: Fixes #12966: Ensure icon font vars are loaded into Customizer --- less/variables.less | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) (limited to 'less') diff --git a/less/variables.less b/less/variables.less index 43d4efd00..a97bb41f4 100644 --- a/less/variables.less +++ b/less/variables.less @@ -68,14 +68,18 @@ @headings-color: inherit; -//-- Iconography +//== Iconography // -//## Specify custom locations of the include Glyphicons icon font. Useful for those including Bootstrap via Bower. +//## Specify custom location and filename of the included Glyphicons icon font. Useful for those including Bootstrap via Bower. +//** Load fonts from this directory. @icon-font-path: "../fonts/"; +//** File name for all font files. @icon-font-name: "glyphicons-halflings-regular"; +//** File name for SVG icon file. @icon-font-svg-id: "glyphicons_halflingsregular"; + //== Components // //## Define common padding and border radius sizes and more. Values based on 14px text and 1.428 line-height (~20px to start). -- cgit v1.2.3 From 7c3881086f7a6bc3ae5ea41c80ac2572878c8cdc Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Sat, 8 Mar 2014 17:11:48 -0800 Subject: Fix comment --- less/variables.less | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'less') diff --git a/less/variables.less b/less/variables.less index a97bb41f4..23577e5f9 100644 --- a/less/variables.less +++ b/less/variables.less @@ -76,7 +76,7 @@ @icon-font-path: "../fonts/"; //** File name for all font files. @icon-font-name: "glyphicons-halflings-regular"; -//** File name for SVG icon file. +//** Element ID within SVG icon file. @icon-font-svg-id: "glyphicons_halflingsregular"; -- cgit v1.2.3 From aedee95dbfc13c3629e6fcf3b45b9df7299a5a85 Mon Sep 17 00:00:00 2001 From: mrmrs Date: Sun, 9 Mar 2014 16:13:37 -0700 Subject: Adds basic table of contents for mixins.less. You know for the kids. --- less/mixins.less | 69 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 69 insertions(+) (limited to 'less') diff --git a/less/mixins.less b/less/mixins.less index ee27192fd..a9ac7f47e 100644 --- a/less/mixins.less +++ b/less/mixins.less @@ -1,6 +1,74 @@ // // Mixins // -------------------------------------------------- +// +// Table of Contents +// +// UTILITIES +// ------------------------- +// - Clearfix +// - WebKit-style focus +// - Center-align a block level element +// - Sizing shortcuts +// - Placeholder text +// - Text overflow +// - Requires inline-block or block for proper styling +// - CSS image replacement +// +// CSS3 PROPERTIES +// -------------------------------------------------- +// - Single side border-radius +// - Drop shadows +// - Transitions +// - Transformations +// - Animations +// - Backface visibility +// - Prevent browsers from flickering when using CSS 3D transforms. +// - Box sizing +// - User select +// - For selecting text on the page +// - Resize anything +// - CSS3 Content Columns +// - Optional hyphenation +// - Opacity +// +// GRADIENTS +// -------------------------------------------------- +// - Reset filters for IE +// - Retina images +// - Responsive image +// +// COMPONENT MIXINS +// -------------------------------------------------- +// - Horizontal dividers +// - Dividers (basically an hr) within dropdowns and nav lists +// - Panels +// - Alerts +// - Tables +// - List Groups +// - Button variants +// - Button sizes +// - Pagination +// - Labels +// - Contextual backgrounds +// - Typography +// - Navbar vertical align +// - Vertically center elements in the navbar. +// - Progress bars +// +// RESPONSIVE UTILITIES +// ------------------------- +// Grid System +// ----------- +// - Centered container element +// - Generate the extra small columns +// - Generate the small columns +// - Generate the medium columns +// - Generate the large columns +// - Framework grid generation +// - Basic looping in LESS +// - Form validation states +// - Form control focus state // Utilities @@ -1025,3 +1093,4 @@ height: auto; } } + -- cgit v1.2.3 From 71e9902d9a4ee0bf8bc94b4c3123a92a52d6ef65 Mon Sep 17 00:00:00 2001 From: mrmrs Date: Sun, 9 Mar 2014 16:25:27 -0700 Subject: Adjusts some section titles to be more explicit. FIXES #12992 --- less/mixins.less | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) (limited to 'less') diff --git a/less/mixins.less b/less/mixins.less index a9ac7f47e..2459b40ff 100644 --- a/less/mixins.less +++ b/less/mixins.less @@ -2,7 +2,7 @@ // Mixins // -------------------------------------------------- // -// Table of Contents +// TABLE OF CONTENTS // // UTILITIES // ------------------------- @@ -53,7 +53,7 @@ // - Contextual backgrounds // - Typography // - Navbar vertical align -// - Vertically center elements in the navbar. +// - Vertically center elements in the navbar // - Progress bars // // RESPONSIVE UTILITIES @@ -66,7 +66,7 @@ // - Generate the medium columns // - Generate the large columns // - Framework grid generation -// - Basic looping in LESS +// - Loop to generate grid all grid classes // - Form validation states // - Form control focus state -- cgit v1.2.3 From b69e4d636a43439ae53e2b7782f163b1d1887cf4 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Sun, 9 Mar 2014 16:50:30 -0700 Subject: Reorganize mixins and G R U N T --- less/mixins.less | 253 +++++++++++++++++++++++++++---------------------------- 1 file changed, 125 insertions(+), 128 deletions(-) (limited to 'less') diff --git a/less/mixins.less b/less/mixins.less index 2459b40ff..b608a1a8c 100644 --- a/less/mixins.less +++ b/less/mixins.less @@ -1,11 +1,11 @@ // // Mixins // -------------------------------------------------- + + +// Table of Contents // -// TABLE OF CONTENTS -// -// UTILITIES -// ------------------------- +// Utilities // - Clearfix // - WebKit-style focus // - Center-align a block level element @@ -15,8 +15,7 @@ // - Requires inline-block or block for proper styling // - CSS image replacement // -// CSS3 PROPERTIES -// -------------------------------------------------- +// CSS3 properties // - Single side border-radius // - Drop shadows // - Transitions @@ -32,14 +31,12 @@ // - Optional hyphenation // - Opacity // -// GRADIENTS -// -------------------------------------------------- +// Gradients // - Reset filters for IE // - Retina images // - Responsive image // -// COMPONENT MIXINS -// -------------------------------------------------- +// Component mixins // - Horizontal dividers // - Dividers (basically an hr) within dropdowns and nav lists // - Panels @@ -56,23 +53,28 @@ // - Vertically center elements in the navbar // - Progress bars // -// RESPONSIVE UTILITIES -// ------------------------- -// Grid System -// ----------- +// Responsive utilities +// +// Forms +// - Form control focus state +// - Form control sizing +// +// Grid system // - Centered container element // - Generate the extra small columns // - Generate the small columns // - Generate the medium columns // - Generate the large columns -// - Framework grid generation +// +// Framework grid generation // - Loop to generate grid all grid classes // - Form validation states // - Form control focus state + // Utilities -// ------------------------- +// -------------------------------------------------- // Clearfix // Source: http://nicolasgallagher.com/micro-clearfix-hack/ @@ -159,7 +161,7 @@ -// CSS3 PROPERTIES +// CSS3 properties // -------------------------------------------------- // Single side border-radius @@ -446,7 +448,7 @@ -// GRADIENTS +// Gradients // -------------------------------------------------- #gradient { @@ -518,10 +520,10 @@ // Retina images -// +// -------------------------------------------------- + // Short retina mixin for setting background-image and -size. Note that the // spelling of `min--moz-device-pixel-ratio` is intentional. - .img-retina(@file-1x; @file-2x; @width-1x; @height-1x) { background-image: url("@{file-1x}"); @@ -538,10 +540,11 @@ } + // Responsive image -// -// Keep images from scaling beyond the width of their parents. +// -------------------------------------------------- +// Keep images from scaling beyond the width of their parents. .img-responsive(@display: block) { display: @display; max-width: 100%; // Part 1: Set a maximum relative to the parent @@ -549,11 +552,12 @@ } -// COMPONENT MIXINS + +// Component mixins // -------------------------------------------------- // Horizontal dividers -// ------------------------- +// // Dividers (basically an hr) within dropdowns and nav lists .nav-divider(@color: #e5e5e5) { height: 1px; @@ -563,7 +567,6 @@ } // Panels -// ------------------------- .panel-variant(@border; @heading-text-color; @heading-bg-color; @heading-border) { border-color: @border; @@ -584,7 +587,6 @@ } // Alerts -// ------------------------- .alert-variant(@background; @border; @text-color) { background-color: @background; border-color: @border; @@ -599,7 +601,6 @@ } // Tables -// ------------------------- .table-row-variant(@state; @background) { // Exact selectors below required to override `.table-striped` and prevent // inheritance to nested tables. @@ -627,7 +628,6 @@ } // List Groups -// ------------------------- .list-group-item-variant(@state; @background; @color) { .list-group-item-@{state} { color: @color; @@ -655,7 +655,7 @@ } // Button variants -// ------------------------- +// // Easily pump out default styles, as well as :hover, :focus, :active, // and disabled options for all buttons .button-variant(@color; @background; @border) { @@ -697,7 +697,6 @@ } // Button sizes -// ------------------------- .button-size(@padding-vertical; @padding-horizontal; @font-size; @line-height; @border-radius) { padding: @padding-vertical @padding-horizontal; font-size: @font-size; @@ -706,7 +705,6 @@ } // Pagination -// ------------------------- .pagination-size(@padding-vertical; @padding-horizontal; @font-size; @border-radius) { > li { > a, @@ -730,7 +728,6 @@ } // Labels -// ------------------------- .label-variant(@color) { background-color: @color; &[href] { @@ -742,7 +739,6 @@ } // Contextual backgrounds -// ------------------------- .bg-variant(@color) { background-color: @color; a&:hover { @@ -751,7 +747,6 @@ } // Typography -// ------------------------- .text-emphasis-variant(@color) { color: @color; a&:hover { @@ -760,7 +755,7 @@ } // Navbar vertical align -// ------------------------- +// // Vertically center elements in the navbar. // Example: an element has a height of 30px, so write out `.navbar-vertical-align(30px);` to calculate the appropriate top margin. .navbar-vertical-align(@element-height) { @@ -769,7 +764,6 @@ } // Progress bars -// ------------------------- .progress-bar-variant(@color) { background-color: @color; .progress-striped & { @@ -778,7 +772,7 @@ } // Responsive utilities -// ------------------------- +// // More easily include all the states for responsive-utilities.less. .responsive-visibility() { display: block !important; @@ -793,8 +787,97 @@ } -// Grid System -// ----------- + +// Form validation states +// +// Used in forms.less to generate the form validation CSS for warnings, errors, +// and successes. + +.form-control-validation(@text-color: #555; @border-color: #ccc; @background-color: #f5f5f5) { + // Color the label and help text + .help-block, + .control-label, + .radio, + .checkbox, + .radio-inline, + .checkbox-inline { + color: @text-color; + } + // Set the border and box shadow on specific inputs to match + .form-control { + border-color: @border-color; + .box-shadow(inset 0 1px 1px rgba(0,0,0,.075)); // Redeclare so transitions work + &:focus { + border-color: darken(@border-color, 10%); + @shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 6px lighten(@border-color, 20%); + .box-shadow(@shadow); + } + } + // Set validation states also for addons + .input-group-addon { + color: @text-color; + border-color: @border-color; + background-color: @background-color; + } + // Optional feedback icon + .form-control-feedback { + color: @text-color; + } +} + + + +// Forms +// -------------------------------------------------- + +// 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. +// +// 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 +// WebKit's default styles, but applicable to a wider range of browsers. Its +// usability and accessibility should be taken into account with any change. +// +// Example usage: change the default blue border and shadow to white for better +// contrast against a dark gray background. +.form-control-focus(@color: @input-border-focus) { + @color-rgba: rgba(red(@color), green(@color), blue(@color), .6); + &:focus { + border-color: @color; + outline: 0; + .box-shadow(~"inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px @{color-rgba}"); + } +} + +// Form control sizing +// +// Relative text size, padding, and border-radii changes for form controls. For +// horizontal sizing, wrap controls in the predefined grid classes. `` -// element gets special love because it's special, and that's a fact! - -.input-size(@input-height; @padding-vertical; @padding-horizontal; @font-size; @line-height; @border-radius) { - height: @input-height; - padding: @padding-vertical @padding-horizontal; - font-size: @font-size; - line-height: @line-height; - border-radius: @border-radius; - - select& { - height: @input-height; - line-height: @input-height; - } - - textarea&, - select[multiple]& { - height: auto; - } -} - -- cgit v1.2.3 From 2f955907f95ad9b7f42f624eb11142339709c188 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Sun, 9 Mar 2014 17:12:39 -0700 Subject: Fixes #12669: Properly reset line-height on date inputs for all sizes; Fix IE8+'s misaslignment of text within date inputs --- less/forms.less | 12 +++++++++++- 1 file changed, 11 insertions(+), 1 deletion(-) (limited to 'less') diff --git a/less/forms.less b/less/forms.less index 273e36608..f19d5c4c2 100644 --- a/less/forms.less +++ b/less/forms.less @@ -167,10 +167,20 @@ input[type="search"] { // Special styles for iOS date input // // In Mobile Safari, date inputs require a pixel line-height that matches the -// given height of the input. +// 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"] { line-height: @input-height-base; + // IE8+ misaligns the text within date inputs, so we reset + line-height: @line-height-base ~"\0"; + + &.input-sm { + line-height: @input-height-small; + } + &.input-lg { + line-height: @input-height-large; + } } -- cgit v1.2.3 From 1a5fb4ef24f6d1beb71df946fa4781df10eab6e1 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Sun, 9 Mar 2014 17:22:52 -0700 Subject: Fixes #12843: Scope label styles for horizontal forms to a media query so their narrow viewport display looks just like a normal form --- less/forms.less | 10 +++++++--- 1 file changed, 7 insertions(+), 3 deletions(-) (limited to 'less') diff --git a/less/forms.less b/less/forms.less index f19d5c4c2..47ed3426a 100644 --- a/less/forms.less +++ b/less/forms.less @@ -413,8 +413,9 @@ input[type="checkbox"], .form-horizontal { - // Consistent vertical alignment of labels, radios, and checkboxes - .control-label, + // Consistent vertical alignment of radios and checkboxes + // + // Labels also get some reset styles, but that is scope to a media query below. .radio, .checkbox, .radio-inline, @@ -440,10 +441,13 @@ input[type="checkbox"], padding-bottom: (@padding-base-vertical + 1); } - // Only right align form labels here when the columns stop stacking + // 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) { .control-label { text-align: right; + margin-bottom: 0; + padding-top: (@padding-base-vertical + 1); // Default padding plus a border } } -- cgit v1.2.3 From b4d66b7f6b8ca49fbf45fccf445910d607969946 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Sun, 9 Mar 2014 20:45:32 -0700 Subject: Fixes #12738 * Removes default max-height from .navbar-collapse (so not every navbar will get a max-height collapse section) * Scopes regular 340px max-height to fixed top and bottom navbars only (those are the only ones that really need a max-height to enable scrolling) * Adds a landscape media query for phones to cap the max-height at 200px for fixed navbars" --- less/navbar.less | 12 +++++++++++- less/variables.less | 2 +- 2 files changed, 12 insertions(+), 2 deletions(-) (limited to 'less') diff --git a/less/navbar.less b/less/navbar.less index 34897e225..6ddf26356 100644 --- a/less/navbar.less +++ b/less/navbar.less @@ -48,7 +48,6 @@ // content for the user's viewport. .navbar-collapse { - max-height: @navbar-collapse-max-height; overflow-x: visible; padding-right: @navbar-padding-horizontal; padding-left: @navbar-padding-horizontal; @@ -88,6 +87,17 @@ } } +.navbar-fixed-top, +.navbar-fixed-bottom { + .navbar-collapse { + max-height: @navbar-collapse-max-height; + + @media (max-width: @screen-phone) and (orientation: landscape) { + max-height: 200px; + } + } +} + // Both navbar header and collapse // diff --git a/less/variables.less b/less/variables.less index 23577e5f9..82616ac56 100644 --- a/less/variables.less +++ b/less/variables.less @@ -261,7 +261,7 @@ //## 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, and @screen-xs-min as of v3.2.0 +// Note: Deprecated @screen-xs and @screen-phone as of v3.0.1 @screen-xs: 480px; @screen-xs-min: @screen-xs; @screen-phone: @screen-xs-min; -- cgit v1.2.3 From a15c24410be8b94671dcfc3b154e0034a3aaf35f Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Sun, 9 Mar 2014 21:25:51 -0700 Subject: Fixes #12759 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Ensures proper sizing and alignment of input groups within inline and navbar forms. * Uses `inline-table` on the input group * Nukes the widths to `width: auto`—without this, the parent input group doesn’t size correctly and functions as `display: table;` or `block` --- less/forms.less | 12 ++++++++++++ 1 file changed, 12 insertions(+) (limited to 'less') diff --git a/less/forms.less b/less/forms.less index 47ed3426a..b16cf1ae8 100644 --- a/less/forms.less +++ b/less/forms.less @@ -368,6 +368,18 @@ input[type="checkbox"], width: auto; // Prevent labels from stacking above inputs in `.form-group` vertical-align: middle; } + + .input-group { + display: inline-table; + vertical-align: middle; + + .input-group-addon, + .input-group-btn, + .form-control { + width: auto; + } + } + // Input groups need that 100% width though .input-group > .form-control { width: 100%; -- cgit v1.2.3 From b1f71e5292017aca978fabb74d256989e1eeea07 Mon Sep 17 00:00:00 2001 From: Chris Rebert Date: Sun, 9 Mar 2014 21:35:48 -0700 Subject: fix grammar in comment in forms.less --- less/forms.less | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'less') diff --git a/less/forms.less b/less/forms.less index b16cf1ae8..de17d1c82 100644 --- a/less/forms.less +++ b/less/forms.less @@ -427,7 +427,7 @@ input[type="checkbox"], // Consistent vertical alignment of radios and checkboxes // - // Labels also get some reset styles, but that is scope to a media query below. + // Labels also get some reset styles, but that is scoped to a media query below. .radio, .checkbox, .radio-inline, -- cgit v1.2.3