diff --git a/less/code.less b/less/code.less index 1adb3efd40..c28b42fddc 100644 --- a/less/code.less +++ b/less/code.less @@ -8,7 +8,7 @@ code, pre { padding: 0 3px 2px; #font > #family > .monospace; - font-size: @font-size-base - 2; + font-size: (@font-size-base - 2); color: @grayDark; border-radius: 4px; } @@ -25,9 +25,9 @@ code { // Blocks of code pre { display: block; - padding: (@line-height-base - 1) / 2; - margin: 0 0 @line-height-base / 2; - font-size: @font-size-base - 1; // 14px to 13px + padding: ((@line-height-base - 1) / 2); + margin: 0 0 (@line-height-base / 2); + font-size: (@font-size-base - 1); // 14px to 13px line-height: @line-height-base; word-break: break-all; word-wrap: break-word; diff --git a/less/forms.less b/less/forms.less index b710b32fe5..30af1692b1 100644 --- a/less/forms.less +++ b/less/forms.less @@ -21,8 +21,8 @@ legend { width: 100%; padding: 0; margin-bottom: @line-height-base; - font-size: @font-size-base * 1.5; - line-height: @line-height-base * 2; + font-size: (@font-size-base * 1.5); + line-height: (@line-height-base * 2); color: @grayDark; border: 0; border-bottom: 1px solid #e5e5e5; @@ -58,7 +58,7 @@ input[type="color"] { .box-sizing(border-box); // Makes inputs behave like true block-level elements min-height: @input-height-base; // Make inputs at least the height of their button counterpart (base line-height + padding + border) padding: 6px 9px; - // margin-bottom: @line-height-base / 2; + // margin-bottom: (@line-height-base / 2); font-size: @font-size-base; line-height: @line-height-base; color: @gray; @@ -168,7 +168,7 @@ textarea { .checkbox { display: block; min-height: @line-height-base; // clear the floating input if there is no label text - margin-bottom: @line-height-base / 2; + margin-bottom: (@line-height-base / 2); padding-left: 20px; label { display: inline; @@ -186,7 +186,7 @@ textarea { } .radio + .radio, .checkbox + .checkbox { - margin-top: (@line-height-base / 4) * -1; + margin-top: ((@line-height-base / 4) * -1); } // Move the options list down to align with labels @@ -359,7 +359,7 @@ select:focus:invalid { .help-block { display: block; // account for any element using help-block - margin-bottom: @line-height-base / 2; + margin-bottom: (@line-height-base / 2); } .help-inline { @@ -530,7 +530,7 @@ select:focus:invalid { // Float the labels left .control-group > .control-label { float: left; - width: @component-offset-horizontal - 20; + width: (@component-offset-horizontal - 20); padding-top: 6px; text-align: right; } diff --git a/less/grid.less b/less/grid.less index a64ca9c88f..01b31de67f 100644 --- a/less/grid.less +++ b/less/grid.less @@ -10,14 +10,14 @@ // Mobile-first defaults .row { - margin-left: @grid-gutter-width / -2; - margin-right: @grid-gutter-width / -2; + margin-left: (@grid-gutter-width / -2); + margin-right: (@grid-gutter-width / -2); .clear_float(); } [class^="span"] { min-height: 1px; - padding-left: @grid-gutter-width / 2; - padding-right: @grid-gutter-width / 2; + padding-left: (@grid-gutter-width / 2); + padding-right: (@grid-gutter-width / 2); // Proper box-model (padding doesn't add to width) -webkit-box-sizing: border-box; -moz-box-sizing: border-box; diff --git a/less/jumbotron.less b/less/jumbotron.less index ebe9bd971d..c5d850bf9f 100644 --- a/less/jumbotron.less +++ b/less/jumbotron.less @@ -8,7 +8,7 @@ margin-bottom: 30px; font-size: 21px; font-weight: 200; - line-height: @line-height-base * 1.5; + line-height: (@line-height-base * 1.5); color: @jumbotron-lead-color; background-color: @jumbotron-background; h1 { diff --git a/less/mixins.less b/less/mixins.less index 67e2ed689a..54597476e7 100644 --- a/less/mixins.less +++ b/less/mixins.less @@ -293,7 +293,7 @@ .opacity(@opacity) { opacity: @opacity; // IE8 filter - @opacity-ie: @opacity * 100; + @opacity-ie: (@opacity * 100); filter: ~"alpha(opacity=@{opacity-ie})"; } @@ -423,8 +423,8 @@ // Vertically center elements in the navbar. // Example: an element has a height of 30px, so write out `.navbarVerticalAlign(30px);` to calculate the appropriate top margin. .navbar-vertical-align(@element-height) { - margin-top: (@navbar-height - @element-height) / 2; - margin-bottom: (@navbar-height - @element-height) / 2; + margin-top: ((@navbar-height - @element-height) / 2); + margin-bottom: ((@navbar-height - @element-height) / 2); } @@ -471,22 +471,22 @@ .spanX (@index) when (@index > 0) { .span@{index} { .span(@index); } - .spanX(@index - 1); + .spanX((@index - 1)); } .spanX(0) {} .offsetX (@index) when (@index > 0) { .offset@{index} { .offset(@index); } - .offsetX(@index - 1); + .offsetX((@index - 1)); } .offsetX (0) {} // Base styles .offset(@columns) { - margin-left: percentage(@columns / @grid-columns); + margin-left: percentage((@columns / @grid-columns)); } .span(@columns) { - width: percentage(@columns / @grid-columns); + width: percentage((@columns / @grid-columns)); } // Generate .spanX and .offsetX diff --git a/less/modals.less b/less/modals.less index 076c39be35..9d9baccea1 100644 --- a/less/modals.less +++ b/less/modals.less @@ -41,7 +41,7 @@ right: 0; width: auto; padding: 10px; - z-index: @zindex-modal-background + 10; + z-index: (@zindex-modal-background + 10); } // Actual modal @@ -64,7 +64,7 @@ right: 0; bottom: 0; left: 0; - z-index: @zindex-modal-background - 10; + z-index: (@zindex-modal-background - 10); background-color: #000; // Fade for backdrop &.fade { .opacity(0); } diff --git a/less/navbar.less b/less/navbar.less index 6c385332f0..15f8a2503f 100644 --- a/less/navbar.less +++ b/less/navbar.less @@ -21,8 +21,8 @@ margin-top: 15px; } .nav > li > a { - padding-top: (@navbar-height - @line-height-base) / 2; - padding-bottom: (@navbar-height - @line-height-base) / 2; + padding-top: ((@navbar-height - @line-height-base) / 2); + padding-bottom: ((@navbar-height - @line-height-base) / 2); color: @navbar-link-color; line-height: 20px; } @@ -276,8 +276,8 @@ } .navbar-brand { float: left; - padding-top: (@navbar-height - @line-height-base) / 2; - padding-bottom: (@navbar-height - @line-height-base) / 2; + padding-top: ((@navbar-height - @line-height-base) / 2); + padding-bottom: ((@navbar-height - @line-height-base) / 2); margin-left: -10px; } .navbar .nav { @@ -297,7 +297,7 @@ // Change the height and height, disable bottom border, then add right border .navbar .nav > .divider { width: 1px; - height: @navbar-height * .6; + height: (@navbar-height * .6); margin: (@navbar-height * .2) 9px; border-bottom: 0; border-right: 1px solid lighten(@navbar-bg, 5%); diff --git a/less/type.less b/less/type.less index 697b7ad20c..8d177b61d1 100644 --- a/less/type.less +++ b/less/type.less @@ -7,11 +7,11 @@ // ------------------------- p { - margin: 0 0 @line-height-base / 2; + margin: 0 0 (@line-height-base / 2); } .lead { margin-bottom: @line-height-base; - font-size: @font-size-base * 1.5; + font-size: (@font-size-base * 1.5); font-weight: 200; line-height: 1.25; } @@ -68,28 +68,28 @@ h1, h2, h3 { margin-top: @line-height-base; - margin-bottom: @line-height-base / 2; - line-height: @line-height-base * 2; + margin-bottom: (@line-height-base / 2); + line-height: (@line-height-base * 2); } h3 { - line-height: @line-height-base * 1.5; + line-height: (@line-height-base * 1.5); } h4, h5, h6 { - margin-top: @line-height-base / 2; - margin-bottom: @line-height-base / 2; + margin-top: (@line-height-base / 2); + margin-bottom: (@line-height-base / 2); } -h1 { font-size: @font-size-base * 2.75; font-size: 4rem; } // ~38px -h2 { font-size: @font-size-base * 2.25; font-size: 3rem; } // ~32px -h3 { font-size: @font-size-base * 1.75; font-size: 2.5rem; } // ~24px -h4 { font-size: @font-size-base * 1.25; font-size: 2rem; } // ~18px -h5 { font-size: @font-size-base; font-size: 1.6rem; } -h6 { font-size: @font-size-base * 0.85; font-size: 1.2rem; } // ~12px +h1 { font-size: (@font-size-base * 2.75); font-size: 4rem; } // ~38px +h2 { font-size: (@font-size-base * 2.25); font-size: 3rem; } // ~32px +h3 { font-size: (@font-size-base * 1.75); font-size: 2.5rem; } // ~24px +h4 { font-size: (@font-size-base * 1.25); font-size: 2rem; } // ~18px +h5 { font-size: @font-size-base; font-size: 1.6rem; } +h6 { font-size: (@font-size-base * 0.85); font-size: 1.2rem; } // ~12px -h1 small { font-size: @font-size-base * 1.75; } // ~24px -h2 small { font-size: @font-size-base * 1.25; } // ~18px +h1 small { font-size: (@font-size-base * 1.75); } // ~24px +h2 small { font-size: (@font-size-base * 1.25); } // ~18px h3 small { font-size: @font-size-base; } h4 small { font-size: @font-size-base; } @@ -98,7 +98,7 @@ h4 small { font-size: @font-size-base; } // ------------------------- .page-header { - padding-bottom: (@line-height-base / 2) - 1; + padding-bottom: ((@line-height-base / 2) - 1); margin: (@line-height-base * 2) 0 @line-height-base; border-bottom: 1px solid @grayLighter; } @@ -151,14 +151,14 @@ dt { font-weight: bold; } dd { - margin-left: @line-height-base / 2; + margin-left: (@line-height-base / 2); } // Horizontal layout (like forms) .dl-horizontal { .clear_float(); // Ensure dl clears floats if empty dd elements present dt { float: left; - width: @component-offset-horizontal - 20; + width: (@component-offset-horizontal - 20); clear: left; text-align: right; .text-overflow(); @@ -198,7 +198,7 @@ blockquote { border-left: 5px solid @grayLighter; p { margin-bottom: 0; - font-size: @font-size-base * 1.25; + font-size: (@font-size-base * 1.25); font-weight: 300; line-height: 1.25; } diff --git a/less/variables.less b/less/variables.less index 47a02256a5..ef9ac5a2a8 100644 --- a/less/variables.less +++ b/less/variables.less @@ -46,9 +46,9 @@ @font-family-base: @font-family-sans-serif; @font-size-base: 14px; -@font-size-large: @font-size-base * 1.25; // ~18px -@font-size-small: @font-size-base * 0.85; // ~12px -@font-size-mini: @font-size-base * 0.75; // ~11px +@font-size-large: (@font-size-base * 1.25); // ~18px +@font-size-small: (@font-size-base * 0.85); // ~12px +@font-size-mini: (@font-size-base * 0.75); // ~11px @line-height-base: 20px; @@ -115,9 +115,9 @@ @input-color-placeholder: @grayLight; -@input-height-base: @line-height-base + 14px; // base line-height + 12px vertical padding + 2px top/bottom border -@input-height-large: @line-height-base + 24px; // base line-height + 22px vertical padding + 2px top/bottom border -@input-height-small: @line-height-base + 6px; // base line-height + 4px vertical padding + 2px top/bottom border +@input-height-base: (@line-height-base + 14px); // base line-height + 12px vertical padding + 2px top/bottom border +@input-height-large: (@line-height-base + 24px); // base line-height + 22px vertical padding + 2px top/bottom border +@input-height-small: (@line-height-base + 6px); // base line-height + 4px vertical padding + 2px top/bottom border // adjust min-height on input sizes @@ -266,7 +266,7 @@ @popover-title-background: darken(@popover-background, 3%); // Special enhancement for popovers -@popover-arrow-outer-width: @popover-arrow-width + 1; +@popover-arrow-outer-width: (@popover-arrow-width + 1); @popover-arrow-outer-color: rgba(0,0,0,.25); @@ -315,4 +315,4 @@ @grid-columns: 12; @grid-column-width: 60px; @grid-gutter-width: 20px; -@grid-row-width: (@grid-columns * @grid-column-width) + (@grid-gutter-width * (@grid-columns - 1)); +@grid-row-width: ((@grid-columns * @grid-column-width) + (@grid-gutter-width * (@grid-columns - 1)));