diff --git a/src/Umbraco.Web.UI.Client/lib/bootstrap/less/button-groups.less b/src/Umbraco.Web.UI.Client/lib/bootstrap/less/button-groups.less index 1f0c640b30..5f6da2a984 100644 --- a/src/Umbraco.Web.UI.Client/lib/bootstrap/less/button-groups.less +++ b/src/Umbraco.Web.UI.Client/lib/bootstrap/less/button-groups.less @@ -20,8 +20,8 @@ // Optional: Group multiple button groups together for a toolbar .btn-toolbar { font-size: 0; // Hack to remove whitespace that results from using inline-block - margin-top: @baseLineHeight / 2; - margin-bottom: @baseLineHeight / 2; + margin-top: (@baseLineHeight / 2); + margin-bottom: (@baseLineHeight / 2); > .btn + .btn, > .btn-group + .btn, > .btn + .btn-group { diff --git a/src/Umbraco.Web.UI.Client/lib/bootstrap/less/code.less b/src/Umbraco.Web.UI.Client/lib/bootstrap/less/code.less index 5eb8b638a2..36a6ae743e 100644 --- a/src/Umbraco.Web.UI.Client/lib/bootstrap/less/code.less +++ b/src/Umbraco.Web.UI.Client/lib/bootstrap/less/code.less @@ -8,7 +8,7 @@ code, pre.code { padding: 0 3px 2px; #font > #family > .monospace; - font-size: @baseFontSize - 2; + font-size: (@baseFontSize - 2); color: @blueExtraDark; .border-radius(3px); } @@ -24,9 +24,9 @@ code { // Blocks of code pre.code { display: block; - padding: (@baseLineHeight - 1) / 2; - margin: 0 0 @baseLineHeight / 2; - font-size: @baseFontSize - 1; // 14px to 13px + padding: ((@baseLineHeight - 1) / 2); + margin: 0 0 (@baseLineHeight / 2); + font-size: (@baseFontSize - 1); // 14px to 13px line-height: @baseLineHeight; word-break: break-all; word-wrap: break-word; diff --git a/src/Umbraco.Web.UI.Client/lib/bootstrap/less/forms.less b/src/Umbraco.Web.UI.Client/lib/bootstrap/less/forms.less index 38ed7a9914..0df6c459bd 100644 --- a/src/Umbraco.Web.UI.Client/lib/bootstrap/less/forms.less +++ b/src/Umbraco.Web.UI.Client/lib/bootstrap/less/forms.less @@ -23,15 +23,15 @@ legend { width: 100%; padding: 0; margin-bottom: @baseLineHeight; - font-size: @baseFontSize * 1.5; - line-height: @baseLineHeight * 2; + font-size: (@baseFontSize * 1.5); + line-height: (@baseLineHeight * 2); color: @grayDark; border: 0; border-bottom: 1px solid #e5e5e5; // Small small { - font-size: @baseLineHeight * .75; + font-size: (@baseLineHeight * .75); color: @grayLight; } } @@ -81,7 +81,7 @@ input[type="color"], display: inline-block; height: @baseLineHeight; padding: 4px 6px; - margin-bottom: @baseLineHeight / 2; + margin-bottom: (@baseLineHeight / 2); font-size: @baseFontSize; line-height: @baseLineHeight; color: @gray; @@ -401,7 +401,7 @@ select:focus:invalid { .help-block { display: block; // account for any element using help-block - margin-bottom: @baseLineHeight / 2; + margin-bottom: (@baseLineHeight / 2); } .help-inline { @@ -419,7 +419,7 @@ select:focus:invalid { .input-append, .input-prepend { display: inline-block; - margin-bottom: @baseLineHeight / 2; + margin-bottom: (@baseLineHeight / 2); vertical-align: middle; font-size: 0; // white space collapse hack white-space: nowrap; // Prevent span and input from separating @@ -624,7 +624,7 @@ input.search-query { // Margin to space out fieldsets .control-group { - margin-bottom: @baseLineHeight / 2; + margin-bottom: (@baseLineHeight / 2); } // Legend collapses margin, so next element is responsible for spacing @@ -645,7 +645,7 @@ legend + .control-group { // Float the labels left .control-label { float: left; - width: @horizontalComponentOffset - 20; + width: (@horizontalComponentOffset - 20); padding-top: 5px; text-align: right; } @@ -665,7 +665,7 @@ legend + .control-group { .input-prepend, .input-append { + .help-block { - margin-top: @baseLineHeight / 2; + margin-top: (@baseLineHeight / 2); } } // Move over buttons in .form-actions to align with .controls diff --git a/src/Umbraco.Web.UI.Client/lib/bootstrap/less/hero-unit.less b/src/Umbraco.Web.UI.Client/lib/bootstrap/less/hero-unit.less index 763d86aeee..a1889ad3c6 100644 --- a/src/Umbraco.Web.UI.Client/lib/bootstrap/less/hero-unit.less +++ b/src/Umbraco.Web.UI.Client/lib/bootstrap/less/hero-unit.less @@ -8,7 +8,7 @@ margin-bottom: 30px; font-size: 18px; font-weight: 200; - line-height: @baseLineHeight * 1.5; + line-height: (@baseLineHeight * 1.5); color: @heroUnitLeadColor; background-color: @heroUnitBackground; .border-radius(6px); @@ -20,6 +20,6 @@ letter-spacing: -1px; } li { - line-height: @baseLineHeight * 1.5; // Reset since we specify in type.less + line-height: (@baseLineHeight * 1.5); // Reset since we specify in type.less } } diff --git a/src/Umbraco.Web.UI.Client/lib/bootstrap/less/labels-badges.less b/src/Umbraco.Web.UI.Client/lib/bootstrap/less/labels-badges.less index bc321fe5c1..13e1553fbe 100644 --- a/src/Umbraco.Web.UI.Client/lib/bootstrap/less/labels-badges.less +++ b/src/Umbraco.Web.UI.Client/lib/bootstrap/less/labels-badges.less @@ -8,7 +8,7 @@ .badge { display: inline-block; padding: 2px 4px; - font-size: @baseFontSize * .846; + font-size: (@baseFontSize * .846); font-weight: bold; line-height: 14px; // ensure proper line-height if floated color: @white; diff --git a/src/Umbraco.Web.UI.Client/lib/bootstrap/less/mixins.less b/src/Umbraco.Web.UI.Client/lib/bootstrap/less/mixins.less index ec4f1abed9..0e795a5987 100644 --- a/src/Umbraco.Web.UI.Client/lib/bootstrap/less/mixins.less +++ b/src/Umbraco.Web.UI.Client/lib/bootstrap/less/mixins.less @@ -312,7 +312,7 @@ // Opacity .opacity(@opacity) { - opacity: @opacity / 100; + opacity: (@opacity / 100); } @@ -444,7 +444,7 @@ // 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. .navbarVerticalAlign(@elementHeight) { - margin-top: (@navbarHeight - @elementHeight) / 2; + margin-top: ((@navbarHeight - @elementHeight) / 2); } @@ -462,7 +462,7 @@ // Table columns .tableColumns(@columnSpan: 1) { float: none; // undo default grid column styles - width: ((@gridColumnWidth) * @columnSpan) + (@gridGutterWidth * (@columnSpan - 1)) - 16; // 16 is total padding on left and right of table cells + width: ((@gridColumnWidth * @columnSpan) + (@gridGutterWidth * (@columnSpan - 1)) - 16); // 16 is total padding on left and right of table cells margin-left: 0; // undo default grid column styles } @@ -474,8 +474,8 @@ } .makeColumn(@columns: 1, @offset: 0) { float: left; - margin-left: (@gridColumnWidth * @offset) + (@gridGutterWidth * (@offset - 1)) + (@gridGutterWidth * 2); - width: (@gridColumnWidth * @columns) + (@gridGutterWidth * (@columns - 1)); + margin-left: ((@gridColumnWidth * @offset) + (@gridGutterWidth * (@offset - 1)) + (@gridGutterWidth * 2)); + width: ((@gridColumnWidth * @columns) + (@gridGutterWidth * (@columns - 1))); } // The Grid @@ -485,22 +485,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) {} .offset (@columns) { - margin-left: (@gridColumnWidth * @columns) + (@gridGutterWidth * (@columns + 1)); + margin-left: ((@gridColumnWidth * @columns) + (@gridGutterWidth * (@columns + 1))); } .span (@columns) { - width: (@gridColumnWidth * @columns) + (@gridGutterWidth * (@columns - 1)); + width: ((@gridColumnWidth * @columns) + (@gridGutterWidth * (@columns - 1))); } .row { @@ -530,30 +530,30 @@ .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); } .offset@{index}:first-child { .offsetFirstChild(@index); } - .offsetX(@index - 1); + .offsetX((@index - 1)); } .offsetX (0) {} .offset (@columns) { - margin-left: (@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1)) + (@fluidGridGutterWidth*2); - *margin-left: (@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1)) - (.5 / @gridRowWidth * 100 * 1%) + (@fluidGridGutterWidth*2) - (.5 / @gridRowWidth * 100 * 1%); + margin-left: ((@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1)) + (@fluidGridGutterWidth * 2)); + *margin-left: ((@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1)) - (.5 / @gridRowWidth * 100 * 1%) + (@fluidGridGutterWidth*2) - (.5 / @gridRowWidth * 100 * 1%)); } .offsetFirstChild (@columns) { - margin-left: (@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1)) + (@fluidGridGutterWidth); - *margin-left: (@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1)) - (.5 / @gridRowWidth * 100 * 1%) + @fluidGridGutterWidth - (.5 / @gridRowWidth * 100 * 1%); + margin-left: ((@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1)) + (@fluidGridGutterWidth)); + *margin-left: ((@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1)) - (.5 / @gridRowWidth * 100 * 1%) + @fluidGridGutterWidth - (.5 / @gridRowWidth * 100 * 1%)); } .span (@columns) { - width: (@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1)); - *width: (@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1)) - (.5 / @gridRowWidth * 100 * 1%); + width: ((@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1))); + *width: ((@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1)) - (.5 / @gridRowWidth * 100 * 1%)); } .row-fluid { @@ -563,7 +563,7 @@ .input-block-level(); float: left; margin-left: @fluidGridGutterWidth; - *margin-left: @fluidGridGutterWidth - (.5 / @gridRowWidth * 100 * 1%); + *margin-left: (@fluidGridGutterWidth - (.5 / @gridRowWidth * 100 * 1%)); } [class*="span"]:first-child { margin-left: 0; @@ -585,12 +585,12 @@ .spanX (@index) when (@index > 0) { input.span@{index}, textarea.span@{index}, .uneditable-input.span@{index} { .span(@index); } - .spanX(@index - 1); + .spanX((@index - 1)); } .spanX (0) {} .span(@columns) { - width: ((@gridColumnWidth) * @columns) + (@gridGutterWidth * (@columns - 1)) - 14; + width: ((@gridColumnWidth * @columns) + (@gridGutterWidth * (@columns - 1)) - 14); } input, diff --git a/src/Umbraco.Web.UI.Client/lib/bootstrap/less/navbar.less b/src/Umbraco.Web.UI.Client/lib/bootstrap/less/navbar.less index 6d3d06f36a..dd1a5b0650 100644 --- a/src/Umbraco.Web.UI.Client/lib/bootstrap/less/navbar.less +++ b/src/Umbraco.Web.UI.Client/lib/bootstrap/less/navbar.less @@ -192,7 +192,7 @@ .navbar-static-top .container, .navbar-fixed-top .container, .navbar-fixed-bottom .container { -width: (@gridColumnWidth * @gridColumns) + (@gridGutterWidth * (@gridColumns - 1)); +width: ((@gridColumnWidth * @gridColumns) + (@gridGutterWidth * (@gridColumns - 1))); } // Fixed to top diff --git a/src/Umbraco.Web.UI.Client/lib/bootstrap/less/popovers.less b/src/Umbraco.Web.UI.Client/lib/bootstrap/less/popovers.less index 0836e896d2..f7d2924406 100644 --- a/src/Umbraco.Web.UI.Client/lib/bootstrap/less/popovers.less +++ b/src/Umbraco.Web.UI.Client/lib/bootstrap/less/popovers.less @@ -72,42 +72,42 @@ .popover { &.top .arrow { left: 50%; - margin-left: -@popoverArrowOuterWidth; + margin-left: (@popoverArrowOuterWidth * -1); border-bottom-width: 0; border-top-color: #999; // IE8 fallback border-top-color: @popoverArrowOuterColor; - bottom: -@popoverArrowOuterWidth; + bottom: (@popoverArrowOuterWidth * -1); &:after { bottom: 1px; - margin-left: -@popoverArrowWidth; + margin-left: (@popoverArrowWidth * -1); border-bottom-width: 0; border-top-color: @popoverArrowColor; } } &.right .arrow { top: 50%; - left: -@popoverArrowOuterWidth; - margin-top: -@popoverArrowOuterWidth; + left: (@popoverArrowOuterWidth * -1); + margin-top: (@popoverArrowOuterWidth * -1); border-left-width: 0; border-right-color: #999; // IE8 fallback border-right-color: @popoverArrowOuterColor; &:after { left: 1px; - bottom: -@popoverArrowWidth; + bottom: (@popoverArrowWidth * -1); border-left-width: 0; border-right-color: @popoverArrowColor; } } &.bottom .arrow { left: 50%; - margin-left: -@popoverArrowOuterWidth; + margin-left: (@popoverArrowOuterWidth * -1); border-top-width: 0; border-bottom-color: #999; // IE8 fallback border-bottom-color: @popoverArrowOuterColor; - top: -@popoverArrowOuterWidth; + top: (@popoverArrowOuterWidth * -1); &:after { top: 1px; - margin-left: -@popoverArrowWidth; + margin-left: (@popoverArrowWidth * -1); border-top-width: 0; border-bottom-color: @popoverArrowColor; } @@ -115,8 +115,8 @@ &.left .arrow { top: 50%; - right: -@popoverArrowOuterWidth; - margin-top: -@popoverArrowOuterWidth; + right: (@popoverArrowOuterWidth * -1); + margin-top: (@popoverArrowOuterWidth * -1); border-right-width: 0; border-left-color: #999; // IE8 fallback border-left-color: @popoverArrowOuterColor; @@ -124,7 +124,7 @@ right: 1px; border-right-width: 0; border-left-color: @popoverArrowColor; - bottom: -@popoverArrowWidth; + bottom: (@popoverArrowWidth * -1); } } diff --git a/src/Umbraco.Web.UI.Client/lib/bootstrap/less/responsive-1200px-min.less b/src/Umbraco.Web.UI.Client/lib/bootstrap/less/responsive-1200px-min.less index 4f35ba6ca2..a92b65c9e1 100644 --- a/src/Umbraco.Web.UI.Client/lib/bootstrap/less/responsive-1200px-min.less +++ b/src/Umbraco.Web.UI.Client/lib/bootstrap/less/responsive-1200px-min.less @@ -16,7 +16,7 @@ // Thumbnails .thumbnails { - margin-left: -@gridGutterWidth1200; + margin-left: (@gridGutterWidth1200 * -1); } .thumbnails > li { margin-left: @gridGutterWidth1200; diff --git a/src/Umbraco.Web.UI.Client/lib/bootstrap/less/thumbnails.less b/src/Umbraco.Web.UI.Client/lib/bootstrap/less/thumbnails.less index 6ec4bd4439..ce2bc0b079 100644 --- a/src/Umbraco.Web.UI.Client/lib/bootstrap/less/thumbnails.less +++ b/src/Umbraco.Web.UI.Client/lib/bootstrap/less/thumbnails.less @@ -7,7 +7,7 @@ // Make wrapper ul behave like the grid .thumbnails { - margin-left: -@gridGutterWidth; + margin-left: (@gridGutterWidth * -1); list-style: none; .clearfix(); } diff --git a/src/Umbraco.Web.UI.Client/lib/bootstrap/less/tooltip.less b/src/Umbraco.Web.UI.Client/lib/bootstrap/less/tooltip.less index 83d5f2bd76..3ee494f432 100644 --- a/src/Umbraco.Web.UI.Client/lib/bootstrap/less/tooltip.less +++ b/src/Umbraco.Web.UI.Client/lib/bootstrap/less/tooltip.less @@ -42,28 +42,28 @@ &.top .tooltip-arrow { bottom: 0; left: 50%; - margin-left: -@tooltipArrowWidth; + margin-left: (@tooltipArrowWidth * -1); border-width: @tooltipArrowWidth @tooltipArrowWidth 0; border-top-color: @tooltipArrowColor; } &.right .tooltip-arrow { top: 50%; left: 0; - margin-top: -@tooltipArrowWidth; + margin-top: (@tooltipArrowWidth * -1); border-width: @tooltipArrowWidth @tooltipArrowWidth @tooltipArrowWidth 0; border-right-color: @tooltipArrowColor; } &.left .tooltip-arrow { top: 50%; right: 0; - margin-top: -@tooltipArrowWidth; + margin-top: (@tooltipArrowWidth * -1); border-width: @tooltipArrowWidth 0 @tooltipArrowWidth @tooltipArrowWidth; border-left-color: @tooltipArrowColor; } &.bottom .tooltip-arrow { top: 0; left: 50%; - margin-left: -@tooltipArrowWidth; + margin-left: (@tooltipArrowWidth * -1); border-width: 0 @tooltipArrowWidth @tooltipArrowWidth; border-bottom-color: @tooltipArrowColor; } diff --git a/src/Umbraco.Web.UI.Client/lib/bootstrap/less/type.less b/src/Umbraco.Web.UI.Client/lib/bootstrap/less/type.less index 414ab10ba8..a5dfeaefba 100644 --- a/src/Umbraco.Web.UI.Client/lib/bootstrap/less/type.less +++ b/src/Umbraco.Web.UI.Client/lib/bootstrap/less/type.less @@ -7,13 +7,13 @@ // ------------------------- p { - margin: 0 0 @baseLineHeight / 2; + margin: 0 0 (@baseLineHeight / 2); } .lead { margin-bottom: @baseLineHeight; - font-size: @baseFontSize * 1.5; + font-size: (@baseFontSize * 1.5); font-weight: 200; - line-height: @baseLineHeight * 1.5; + line-height: (@baseLineHeight * 1.5); } @@ -72,17 +72,17 @@ h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 { h1, .h1, h2, .h2, -h3, .h3 { line-height: @baseLineHeight * 2; } +h3, .h3 { line-height: (@baseLineHeight * 2); } -h1, .h1 { font-size: @baseFontSize * 2.75; } // ~38px -h2, .h2 { font-size: @baseFontSize * 2.25; } // ~32px -h3, .h3 { font-size: @baseFontSize * 1.75; } // ~24px -h4, .h4 { font-size: @baseFontSize * 1.25; } // ~18px +h1, .h1 { font-size: (@baseFontSize * 2.75); } // ~38px +h2, .h2 { font-size: (@baseFontSize * 2.25); } // ~32px +h3, .h3 { font-size: (@baseFontSize * 1.75); } // ~24px +h4, .h4 { font-size: (@baseFontSize * 1.25); } // ~18px h5, .h5 { font-size: @baseFontSize; } -h6, .h6 { font-size: @baseFontSize * 0.85; } // ~12px +h6, .h6 { font-size: (@baseFontSize * 0.85); } // ~12px -h1 small, .h1 small { font-size: @baseFontSize * 1.75; } // ~24px -h2 small, .h2 small { font-size: @baseFontSize * 1.25; } // ~18px +h1 small, .h1 small { font-size: (@baseFontSize * 1.75); } // ~24px +h2 small, .h2 small { font-size: (@baseFontSize * 1.25); } // ~18px h3 small, .h3 small { font-size: @baseFontSize; } h4 small, .h4 small { font-size: @baseFontSize; } @@ -91,7 +91,7 @@ h4 small, .h4 small { font-size: @baseFontSize; } // ------------------------- .page-header { - padding-bottom: (@baseLineHeight / 2) - 1; + padding-bottom: ((@baseLineHeight / 2) - 1); margin: @baseLineHeight 0 (@baseLineHeight * 1.5); border-bottom: 1px solid @grayLighter; } @@ -104,7 +104,7 @@ h4 small, .h4 small { font-size: @baseFontSize; } // Unordered and Ordered lists ul, ol { padding: 0; - margin: 0 0 @baseLineHeight / 2 25px; + margin: 0 0 (@baseLineHeight / 2) 25px; } ul ul, ul ol, @@ -151,14 +151,14 @@ dt { font-weight: bold; } dd { - margin-left: @baseLineHeight / 2; + margin-left: (@baseLineHeight / 2); } // Horizontal layout (like forms) .dl-horizontal { .clearfix(); // Ensure dl clears floats if empty dd elements present dt { float: left; - width: @horizontalComponentOffset - 20; + width: (@horizontalComponentOffset - 20); clear: left; text-align: right; .text-overflow(); @@ -198,7 +198,7 @@ blockquote { border-left: 5px solid @grayLighter; p { margin-bottom: 0; - font-size: @baseFontSize * 1.25; + font-size: (@baseFontSize * 1.25); font-weight: 300; line-height: 1.25; } diff --git a/src/Umbraco.Web.UI.Client/lib/bootstrap/less/variables.less b/src/Umbraco.Web.UI.Client/lib/bootstrap/less/variables.less index 31c131b1e2..220bbde37d 100644 --- a/src/Umbraco.Web.UI.Client/lib/bootstrap/less/variables.less +++ b/src/Umbraco.Web.UI.Client/lib/bootstrap/less/variables.less @@ -62,9 +62,9 @@ // ------------------------- // Based on 14px font-size and 20px line-height -@fontSizeLarge: @baseFontSize * 1.25; // ~18px -@fontSizeSmall: @baseFontSize * 0.85; // ~12px -@fontSizeMini: @baseFontSize * 0.75; // ~11px +@fontSizeLarge: (@baseFontSize * 1.25); // ~18px +@fontSizeSmall: (@baseFontSize * 0.85); // ~12px +@fontSizeMini: (@baseFontSize * 0.75); // ~11px @paddingLarge: 11px 19px; // 44px @paddingSmall: 2px 10px; // 26px @@ -114,7 +114,7 @@ @inputBorderRadius: @baseBorderRadius; @inputDisabledBackground: @grayLighter; @formActionsBackground: #f5f5f5; -@inputHeight: @baseLineHeight + 10px; // base line-height + 8px vertical padding + 2px top/bottom border +@inputHeight: (@baseLineHeight + 10px); // base line-height + 8px vertical padding + 2px top/bottom border // Dropdowns @@ -178,7 +178,7 @@ // Navbar // ------------------------- @navbarCollapseWidth: 979px; -@navbarCollapseDesktopWidth: @navbarCollapseWidth + 1; +@navbarCollapseDesktopWidth: (@navbarCollapseWidth + 1); @navbarHeight: 40px; @navbarBackgroundHighlight: #ffffff; @@ -260,7 +260,7 @@ @popoverTitleBackground: darken(@popoverBackground, 3%); // Special enhancement for popovers -@popoverArrowOuterWidth: @popoverArrowWidth + 1; +@popoverArrowOuterWidth: (@popoverArrowWidth + 1); @popoverArrowOuterColor: rgba(0,0,0,.25); @@ -274,17 +274,17 @@ @gridColumns: 12; @gridColumnWidth: 60px; @gridGutterWidth: 20px; -@gridRowWidth: (@gridColumns * @gridColumnWidth) + (@gridGutterWidth * (@gridColumns - 1)); +@gridRowWidth: ((@gridColumns * @gridColumnWidth) + (@gridGutterWidth * (@gridColumns - 1))); // 1200px min @gridColumnWidth1200: 70px; @gridGutterWidth1200: 30px; -@gridRowWidth1200: (@gridColumns * @gridColumnWidth1200) + (@gridGutterWidth1200 * (@gridColumns - 1)); +@gridRowWidth1200: ((@gridColumns * @gridColumnWidth1200) + (@gridGutterWidth1200 * (@gridColumns - 1))); // 768px-979px @gridColumnWidth768: 42px; @gridGutterWidth768: 20px; -@gridRowWidth768: (@gridColumns * @gridColumnWidth768) + (@gridGutterWidth768 * (@gridColumns - 1)); +@gridRowWidth768: ((@gridColumns * @gridColumnWidth768) + (@gridGutterWidth768 * (@gridColumns - 1))); // Fluid grid diff --git a/src/Umbraco.Web.UI.Client/src/less/button-groups.less b/src/Umbraco.Web.UI.Client/src/less/button-groups.less index 444a56803c..921b7f21fa 100644 --- a/src/Umbraco.Web.UI.Client/src/less/button-groups.less +++ b/src/Umbraco.Web.UI.Client/src/less/button-groups.less @@ -20,8 +20,8 @@ // Optional: Group multiple button groups together for a toolbar .btn-toolbar { font-size: 0; // Hack to remove whitespace that results from using inline-block - margin-top: @baseLineHeight / 2; - margin-bottom: @baseLineHeight / 2; + margin-top: (@baseLineHeight / 2); + margin-bottom: (@baseLineHeight / 2); > .btn + .btn, > .btn-group + .btn, > .btn + .btn-group { diff --git a/src/Umbraco.Web.UI.Client/src/less/canvas-designer.less b/src/Umbraco.Web.UI.Client/src/less/canvas-designer.less index 24d03d01a1..85d189d5a0 100644 --- a/src/Umbraco.Web.UI.Client/src/less/canvas-designer.less +++ b/src/Umbraco.Web.UI.Client/src/less/canvas-designer.less @@ -172,7 +172,7 @@ body { z-index:1; box-shadow: 0 5px 10px 0 rgba(0,0,0,.26); > .menu-bar__button { - z-index: @zindexDropdown + 1; + z-index: (@zindexDropdown + 1); } .dropdown-menu { display:block; diff --git a/src/Umbraco.Web.UI.Client/src/less/components/application/umb-tour.less b/src/Umbraco.Web.UI.Client/src/less/components/application/umb-tour.less index bf2f030cea..ba61975479 100644 --- a/src/Umbraco.Web.UI.Client/src/less/components/application/umb-tour.less +++ b/src/Umbraco.Web.UI.Client/src/less/components/application/umb-tour.less @@ -124,7 +124,7 @@ width: 800px; min-height: 400px; padding: 40px; - border-radius: @baseBorderRadius * 2; + border-radius: (@baseBorderRadius * 2); .umb-tour-step__close { top: 40px; right: 40px; diff --git a/src/Umbraco.Web.UI.Client/src/less/components/card.less b/src/Umbraco.Web.UI.Client/src/less/components/card.less index 4e3a8b0d70..3e24abdaa9 100644 --- a/src/Umbraco.Web.UI.Client/src/less/components/card.less +++ b/src/Umbraco.Web.UI.Client/src/less/components/card.less @@ -144,7 +144,7 @@ width: 100%; height: 100%; padding: 10px 5px; - border-radius: @baseBorderRadius * 2; + border-radius: (@baseBorderRadius * 2); transition: background-color 120ms; font-size: 13px; line-height: 1.3em; @@ -212,7 +212,7 @@ display: block; width: 100%; padding-top: 100%; - border-radius: @baseBorderRadius * 2; + border-radius: (@baseBorderRadius * 2); box-sizing: border-box; transition: background-color 120ms; @@ -236,7 +236,7 @@ flex-direction: column; background-color: transparent; border:1.5px dashed @ui-action-discreet-border; - border-radius: @baseBorderRadius * 2; + border-radius: (@baseBorderRadius * 2); } } diff --git a/src/Umbraco.Web.UI.Client/src/less/components/editor/umb-editor.less b/src/Umbraco.Web.UI.Client/src/less/components/editor/umb-editor.less index 85dbb05a1b..0cbb3ee60f 100644 --- a/src/Umbraco.Web.UI.Client/src/less/components/editor/umb-editor.less +++ b/src/Umbraco.Web.UI.Client/src/less/components/editor/umb-editor.less @@ -52,7 +52,7 @@ @step: 60px; .level-loop (@i) when (@i > 0) { - @x: @i * @step; + @x: (@i * @step); .umb-editor--level@{i} { transform: translateX(@x); } @@ -61,7 +61,7 @@ right:@x; } - .level-loop(@i - 1); + .level-loop((@i - 1)); } .level-loop(@iterations); @@ -88,7 +88,7 @@ } } - .create-editor-sizes(@iterator + 1); + .create-editor-sizes((@iterator + 1)); } .create-editor-sizes(); diff --git a/src/Umbraco.Web.UI.Client/src/less/components/umb-box.less b/src/Umbraco.Web.UI.Client/src/less/components/umb-box.less index 1fe59ab9dd..5038b94fe8 100644 --- a/src/Umbraco.Web.UI.Client/src/less/components/umb-box.less +++ b/src/Umbraco.Web.UI.Client/src/less/components/umb-box.less @@ -3,12 +3,12 @@ .umb-box { background: @white; border-radius: 3px; - margin-bottom: @boxUnit * 2; + margin-bottom: (@boxUnit * 2); box-shadow: 0 1px 1px 0 rgba(0,0,0,.16); } .umb-box-header { - padding: @boxUnit @boxUnit * 2; + padding: @boxUnit (@boxUnit * 2); border-bottom: 1px solid @gray-9; display: flex; align-items: center; @@ -29,19 +29,19 @@ } .umb-box-content { - padding: @boxUnit * 2; + padding: (@boxUnit * 2); } // allow side-by-side boxes .umb-box-row { - margin-left:-@boxUnit; - margin-right:-@boxUnit; - display:flex; + margin-left: (@boxUnit * -1); + margin-right: (@boxUnit * -1); + display: flex; justify-content: space-around; .umb-box { - margin-left:@boxUnit; - margin-right:@boxUnit; - flex:1; + margin-left: @boxUnit; + margin-right: @boxUnit; + flex: 1; } -} \ No newline at end of file +} diff --git a/src/Umbraco.Web.UI.Client/src/less/forms.less b/src/Umbraco.Web.UI.Client/src/less/forms.less index 4000372cdd..bc5b274f6a 100644 --- a/src/Umbraco.Web.UI.Client/src/less/forms.less +++ b/src/Umbraco.Web.UI.Client/src/less/forms.less @@ -148,15 +148,15 @@ legend { width: 100%; padding: 0; margin-bottom: @baseLineHeight; - font-size: @baseFontSize * 1.5; - line-height: @baseLineHeight * 2; + font-size: (@baseFontSize * 1.5); + line-height: (@baseLineHeight * 2); color: @grayDark; border: 0; border-bottom: 1px solid @gray-8; // Small small { - font-size: @baseLineHeight * .75; + font-size: (@baseLineHeight * .75); color: @gray-8; } } @@ -208,7 +208,7 @@ input[type="color"], display: inline-block; height: @inputHeight; padding: 4px 6px; - margin-bottom: @baseLineHeight / 2; + margin-bottom: (@baseLineHeight / 2); font-size: @baseFontSize; line-height: @baseLineHeight; color: @gray-2; @@ -548,7 +548,7 @@ input[type="checkbox"][readonly] { .help-block { display: block; // account for any element using help-block - margin-bottom: @baseLineHeight / 2; + margin-bottom: (@baseLineHeight / 2); } .help-inline { @@ -574,7 +574,7 @@ table.domains .help-inline { .input-append, .input-prepend { display: inline-block; - margin-bottom: @baseLineHeight / 2; + margin-bottom: (@baseLineHeight / 2); vertical-align: middle; font-size: 0; // white space collapse hack white-space: nowrap; // Prevent span and input from separating @@ -759,7 +759,7 @@ input.search-query { // Margin to space out fieldsets .control-group { - margin-bottom: @baseLineHeight / 2; + margin-bottom: (@baseLineHeight / 2); } //modifier for control group @@ -785,7 +785,7 @@ legend + .control-group { // Float the labels left .control-label { float: left; - width: @horizontalComponentOffset - 20; + width: (@horizontalComponentOffset - 20); padding-top: 5px; text-align: right; } @@ -810,7 +810,7 @@ legend + .control-group { .input-prepend, .input-append { + .help-block { - margin-top: @baseLineHeight / 2; + margin-top: (@baseLineHeight / 2); } } // Move over buttons in .form-actions to align with .controls diff --git a/src/Umbraco.Web.UI.Client/src/less/hacks.less b/src/Umbraco.Web.UI.Client/src/less/hacks.less index 8d3117febe..911d89e369 100644 --- a/src/Umbraco.Web.UI.Client/src/less/hacks.less +++ b/src/Umbraco.Web.UI.Client/src/less/hacks.less @@ -193,8 +193,8 @@ code { // 1: Wrapping code is unreadable on small devices. pre { display: block; - padding: (@baseLineHeight - 1) / 2; - margin: 0 0 @baseLineHeight / 2; + padding: ((@baseLineHeight - 1) / 2); + margin: 0 0 (@baseLineHeight / 2); font-family: @sansFontFamily; color: @gray-2; line-height: @baseLineHeight; diff --git a/src/Umbraco.Web.UI.Client/src/less/mixins.less b/src/Umbraco.Web.UI.Client/src/less/mixins.less index b046ca69d9..c0ddcd6cdb 100644 --- a/src/Umbraco.Web.UI.Client/src/less/mixins.less +++ b/src/Umbraco.Web.UI.Client/src/less/mixins.less @@ -306,7 +306,7 @@ // Opacity .opacity(@opacity) { - opacity: @opacity / 100; + opacity: (@opacity / 100); } // Position @@ -468,7 +468,7 @@ // 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. .navbarVerticalAlign(@elementHeight) { - margin-top: (@navbarHeight - @elementHeight) / 2; + margin-top: ((@navbarHeight - @elementHeight) / 2); } @@ -486,20 +486,20 @@ // Table columns .tableColumns(@columnSpan: 1) { float: none; // undo default grid column styles - width: ((@gridColumnWidth) * @columnSpan) + (@gridGutterWidth * (@columnSpan - 1)) - 16; // 16 is total padding on left and right of table cells + width: ((@gridColumnWidth * @columnSpan) + (@gridGutterWidth * (@columnSpan - 1)) - 16); // 16 is total padding on left and right of table cells margin-left: 0; // undo default grid column styles } // Make a Grid // Use .makeRow and .makeColumn to assign semantic layouts grid system behavior .makeRow() { - margin-left: @gridGutterWidth * -1; + margin-left: (@gridGutterWidth * -1); .clearfix(); } .makeColumn(@columns: 1, @offset: 0) { float: left; - margin-left: (@gridColumnWidth * @offset) + (@gridGutterWidth * (@offset - 1)) + (@gridGutterWidth * 2); - width: (@gridColumnWidth * @columns) + (@gridGutterWidth * (@columns - 1)); + margin-left: ((@gridColumnWidth * @offset) + (@gridGutterWidth * (@offset - 1)) + (@gridGutterWidth * 2)); + width: ((@gridColumnWidth * @columns) + (@gridGutterWidth * (@columns - 1))); } // The Grid @@ -509,26 +509,26 @@ .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) {} .offset (@columns) { - margin-left: (@gridColumnWidth * @columns) + (@gridGutterWidth * (@columns + 1)); + margin-left: ((@gridColumnWidth * @columns) + (@gridGutterWidth * (@columns + 1))); } .span (@columns) { - width: (@gridColumnWidth * @columns) + (@gridGutterWidth * (@columns - 1)); + width: ((@gridColumnWidth * @columns) + (@gridGutterWidth * (@columns - 1))); } .row { - margin-left: @gridGutterWidth * -1; + margin-left: (@gridGutterWidth * -1); .clearfix(); } @@ -554,27 +554,27 @@ .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); } .offset@{index}:first-child { .offsetFirstChild(@index); } - .offsetX(@index - 1); + .offsetX((@index - 1)); } .offsetX (0) {} .offset (@columns) { - margin-left: (@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1)) + (@fluidGridGutterWidth*2); + margin-left: ((@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1)) + (@fluidGridGutterWidth * 2)); } .offsetFirstChild (@columns) { - margin-left: (@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1)) + (@fluidGridGutterWidth); + margin-left: ((@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1)) + (@fluidGridGutterWidth)); } .span (@columns) { - width: (@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1)); + width: ((@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1))); } .row-fluid { @@ -605,12 +605,12 @@ .spanX (@index) when (@index > 0) { input.span@{index}, textarea.span@{index}, .uneditable-input.span@{index} { .span(@index); } - .spanX(@index - 1); + .spanX((@index - 1)); } .spanX (0) {} .span(@columns) { - width: ((@gridColumnWidth) * @columns) + (@gridGutterWidth * (@columns - 1)) - 14; + width: ((@gridColumnWidth * @columns) + (@gridGutterWidth * (@columns - 1)) - 14); } input, diff --git a/src/Umbraco.Web.UI.Client/src/less/property-editors.less b/src/Umbraco.Web.UI.Client/src/less/property-editors.less index c3ad08b8f8..058216efe1 100644 --- a/src/Umbraco.Web.UI.Client/src/less/property-editors.less +++ b/src/Umbraco.Web.UI.Client/src/less/property-editors.less @@ -469,7 +469,7 @@ .umb-cropper .crop-container { position: relative; width: 100%; - padding-bottom: 9 / 16 * 100%; + padding-bottom: (9 / 16 * 100%); } .umb-cropper img { @@ -519,7 +519,7 @@ left: 0; width: 100%; height: 100%; - z-index: @zindexCropperOverlay - 1; + z-index: (@zindexCropperOverlay - 1); box-shadow: 0 0 0 2000px rgba(255, 255, 255, .8); } .umb-cropper .viewport .__mask-info { @@ -529,7 +529,7 @@ min-width: 100px; right: 0; text-align: right; - z-index: @zindexCropperOverlay - 1; + z-index: (@zindexCropperOverlay - 1); font-size: 12px; opacity: 0.7; padding: 0px 6px; @@ -735,7 +735,7 @@ top: 3px; right: 3px; cursor: pointer; - z-index: @zindexCropperOverlay + 1; + z-index: (@zindexCropperOverlay + 1); } .umb-close-cropper:hover { diff --git a/src/Umbraco.Web.UI.Client/src/less/variables.less b/src/Umbraco.Web.UI.Client/src/less/variables.less index eb31d9f7c1..9ac8e521f1 100644 --- a/src/Umbraco.Web.UI.Client/src/less/variables.less +++ b/src/Umbraco.Web.UI.Client/src/less/variables.less @@ -243,10 +243,10 @@ // ------------------------- // Based on 14px font-size and 20px line-height -@fontSizeLarge: @baseFontSize * 1.25; // ~18px -@fontSizeMedium: @baseFontSize * 1.15; // ~14px -@fontSizeSmall: @baseFontSize * 0.85; // ~12px -@fontSizeMini: @baseFontSize * 0.75; // ~11px +@fontSizeLarge: (@baseFontSize * 1.25); // ~18px +@fontSizeMedium: (@baseFontSize * 1.15); // ~14px +@fontSizeSmall: (@baseFontSize * 0.85); // ~12px +@fontSizeMini: (@baseFontSize * 0.75); // ~11px @paddingLarge: 11px 19px; // 44px @paddingSmall: 2px 10px; // 26px @@ -313,7 +313,7 @@ @inputBorderRadius: 0; @inputDisabledBackground: @gray-10; @formActionsBackground: @gray-9; -@inputHeight: @baseLineHeight + 12px; // base line-height + 8px vertical padding + 2px top/bottom border +@inputHeight: (@baseLineHeight + 12px); // base line-height + 8px vertical padding + 2px top/bottom border @controlRequiredColor: @red; @@ -401,7 +401,7 @@ // Navbar // ------------------------- @navbarCollapseWidth: 979px; -@navbarCollapseDesktopWidth: @navbarCollapseWidth + 1; +@navbarCollapseDesktopWidth: (@navbarCollapseWidth + 1); @navbarHeight: 40px; @navbarBackgroundHighlight: @white; @@ -507,7 +507,7 @@ @popoverTitleBackground: darken(@popoverBackground, 3%); // Special enhancement for popovers -@popoverArrowOuterWidth: @popoverArrowWidth + 1; +@popoverArrowOuterWidth: (@popoverArrowWidth + 1); @popoverArrowOuterColor: @gray-7; @@ -521,17 +521,17 @@ @gridColumns: 12; @gridColumnWidth: 60px; @gridGutterWidth: 0; -@gridRowWidth: (@gridColumns * @gridColumnWidth) + (@gridGutterWidth * (@gridColumns - 1)); +@gridRowWidth: ((@gridColumns * @gridColumnWidth) + (@gridGutterWidth * (@gridColumns - 1))); // 1200px min @gridColumnWidth1200: 70px; @gridGutterWidth1200: 30px; -@gridRowWidth1200: (@gridColumns * @gridColumnWidth1200) + (@gridGutterWidth1200 * (@gridColumns - 1)); +@gridRowWidth1200: ((@gridColumns * @gridColumnWidth1200) + (@gridGutterWidth1200 * (@gridColumns - 1))); // 768px-979px @gridColumnWidth768: 42px; @gridGutterWidth768: 20px; -@gridRowWidth768: (@gridColumns * @gridColumnWidth768) + (@gridGutterWidth768 * (@gridColumns - 1)); +@gridRowWidth768: ((@gridColumns * @gridColumnWidth768) + (@gridGutterWidth768 * (@gridColumns - 1))); // Fluid grid diff --git a/src/Umbraco.Web.UI.Client/src/views/components/blockcard/umb-block-card.less b/src/Umbraco.Web.UI.Client/src/views/components/blockcard/umb-block-card.less index d582365102..ce40546158 100644 --- a/src/Umbraco.Web.UI.Client/src/views/components/blockcard/umb-block-card.less +++ b/src/Umbraco.Web.UI.Client/src/views/components/blockcard/umb-block-card.less @@ -55,7 +55,7 @@ umb-block-card { .__showcase { position: relative; width: 100%; - padding-bottom: 10/16*100%; + padding-bottom: (10 / 16 * 100%); background-color: @gray-12; background-size: contain; diff --git a/src/Umbraco.Web.UI.Client/src/views/components/mediacard/umb-media-card-grid.less b/src/Umbraco.Web.UI.Client/src/views/components/mediacard/umb-media-card-grid.less index f7e5764335..34003e61d7 100644 --- a/src/Umbraco.Web.UI.Client/src/views/components/mediacard/umb-media-card-grid.less +++ b/src/Umbraco.Web.UI.Client/src/views/components/mediacard/umb-media-card-grid.less @@ -62,7 +62,7 @@ width: 28px; height: 28px; margin-left: -18px; - margin-top: -18px - 8px; + margin-top: (-18px - 8px); border-radius: 3em; font-size: 14px; border: 2px solid @blueMid; diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blocklist/umb-block-list-property-editor.less b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blocklist/umb-block-list-property-editor.less index 11d70f4397..7978b79df9 100644 --- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blocklist/umb-block-list-property-editor.less +++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blocklist/umb-block-list-property-editor.less @@ -201,7 +201,7 @@ ng-form.ng-invalid-val-server-match-settings > .umb-block-list__block > .umb-blo box-sizing: border-box; width: 28px; height: 28px; - margin-left: -16px - 8px; + margin-left: (-16px - 8px); margin-top: -16px; border-radius: 3em; font-size: 14px; diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/notsupported/notsupported.less b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/notsupported/notsupported.less index 5eaec3f67b..d2c7641b3f 100644 --- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/notsupported/notsupported.less +++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/notsupported/notsupported.less @@ -3,5 +3,5 @@ color: white; padding: 5px 10px; width: auto; - border-radius: @baseBorderRadius * 2; + border-radius: (@baseBorderRadius * 2); }