fix(core): divisions need parenthesis to support less 4

LESS 4 enforces parenthesis to divider math operations. This was missing at a few places so Fomantic did not build with LESS 4
fomantic · Dec 27, 2020 · ec80f1e · ec80f1e
1 parent de42d96
commit ec80f1e
Show file tree

Hide file tree

Showing 12 changed files with 50 additions and 50 deletions.
diff --git a/src/definitions/collections/form.less b/src/definitions/collections/form.less
@@ -178,13 +178,13 @@
   margin-top: @inputLineHeight + @checkboxSliderFieldTopMargin;
 }
 .ui.ui.form .field .fields .field:not(:only-child) .ui.checkbox {
-  margin-top: @checkboxFieldTopMargin / 2;
+  margin-top: (@checkboxFieldTopMargin / 2);
 }
 .ui.ui.form .field .fields .field:not(:only-child) .ui.toggle.checkbox {
-  margin-top: @checkboxToggleFieldTopMargin / 2;
+  margin-top: (@checkboxToggleFieldTopMargin / 2);
 }
 .ui.ui.form .field .fields .field:not(:only-child) .ui.slider.checkbox {
-  margin-top: @checkboxSliderFieldTopMargin / 2;
+  margin-top: (@checkboxSliderFieldTopMargin / 2);
 }
 
 & when (@variationFormTransparent) {

diff --git a/src/definitions/collections/grid.less b/src/definitions/collections/grid.less
@@ -139,7 +139,7 @@
   margin: (@rowSpacing / 2) (@gutterWidth / 2);
 }
 .ui.grid .column + .ui.vertical.divider {
-  height: e(%("calc(50%% - %d)", @rowSpacing / 2));
+  height: e(%("calc(50%% - %d)", (@rowSpacing / 2)));
 }
 
 /* Remove Border on Last Horizontal Segment */

diff --git a/src/definitions/modules/slider.less b/src/definitions/modules/slider.less
@@ -220,7 +220,7 @@
       bottom: 100%;
     }
     .ui.labeled.ticked.slider > .labels .halftick.label:after {
-      height: @labelHeight / 2;
+      height: (@labelHeight / 2);
     }
   }
 
@@ -389,7 +389,7 @@ each(@colors, {
          height: @@lh;
        }
        .ui.@{value}.labeled.slider:not(.vertical) > .labels .halftick.label:after {
-         height: @@lh / 2;
+         height: (@@lh / 2);
        }
      }
      & when (@variationSliderVertical) {
@@ -408,7 +408,7 @@ each(@colors, {
            width: @@lh;
          }
          .ui.@{value}.labeled.vertical.slider> .labels .halftick.label:after {
-           width: @@lh / 2;
+           width: (@@lh / 2);
          }
        }
      }

diff --git a/src/themes/default/collections/grid.variables b/src/themes/default/collections/grid.variables
@@ -74,18 +74,18 @@
 /*--------------
     Compact
 ---------------*/
-@compactGutterWidth: @gutterWidth / 2;
-@compactRowSpacing: @rowSpacing / 2;
-@compactCelledRelaxedPadding: @celledRelaxedPadding / 2;
-@compactCelledVeryRelaxedPadding: @celledVeryRelaxedPadding / 2;
+@compactGutterWidth: (@gutterWidth / 2);
+@compactRowSpacing: (@rowSpacing / 2);
+@compactCelledRelaxedPadding: (@celledRelaxedPadding / 2);
+@compactCelledVeryRelaxedPadding: (@celledVeryRelaxedPadding / 2);
 
 /*------------------
     Very Compact
 ------------------*/
-@veryCompactGutterWidth: @compactGutterWidth / 2;
-@veryCompactRowSpacing: @compactRowSpacing / 2;
-@veryCompactCelledRelaxedPadding: @compactCelledRelaxedPadding / 2;
-@veryCompactCelledVeryRelaxedPadding: @compactCelledVeryRelaxedPadding / 2;
+@veryCompactGutterWidth: (@compactGutterWidth / 2);
+@veryCompactRowSpacing: (@compactRowSpacing / 2);
+@veryCompactCelledRelaxedPadding: (@compactCelledRelaxedPadding / 2);
+@veryCompactCelledVeryRelaxedPadding: (@compactCelledVeryRelaxedPadding / 2);
 
 
 /*******************************

diff --git a/src/themes/default/collections/table.variables b/src/themes/default/collections/table.variables
@@ -202,7 +202,7 @@
 /* Colors */
 @coloredBorderSize: 0.2em;
 @coloredBorderRadius: 0 0 @borderRadius @borderRadius;
-@coloredBorderSizeCover: @coloredBorderSize / 2;
+@coloredBorderSizeCover: (@coloredBorderSize / 2);
 
 /* Inverted */
 @invertedBackground: #333333;

diff --git a/src/themes/default/elements/header.variables b/src/themes/default/elements/header.variables
@@ -73,9 +73,9 @@
 --------------------*/
 
 /* Sizing */
-@massiveFontSize: unit(32 / 14, em);
+@massiveFontSize: unit((32 / 14), em);
 @hugeFontSize   : unit(@h1, em);
-@bigFontSize    : unit(26 / 14, em);
+@bigFontSize    : unit((26 / 14), em);
 @largeFontSize  : unit(@h2, em);
 @mediumFontSize : unit(@h3, em);
 @smallFontSize  : unit(@h4, em);

diff --git a/src/themes/default/elements/list.variables b/src/themes/default/elements/list.variables
@@ -47,7 +47,7 @@
 /* Content */
 @contentDistance: 0.5em;
 @contentLineHeight: @itemLineHeight;
-@contentLineHeightOffset: (@contentLineHeight - 1em) / 2;
+@contentLineHeightOffset: ((@contentLineHeight - 1em) / 2);
 @contentVerticalAlign: top;
 @contentColor: @textColor;
 

diff --git a/src/themes/default/globals/site.variables b/src/themes/default/globals/site.variables
@@ -645,14 +645,14 @@
   This rounds @size values to the closest pixel then expresses that value in (r)em.
   This ensures all size values round to exact pixels
 */
-@miniRaw         : unit( round(@miniSize * @emSize) / @emSize );
-@tinyRaw         : unit( round(@tinySize * @emSize) / @emSize );
-@smallRaw        : unit( round(@smallSize * @emSize) / @emSize );
-@mediumRaw       : unit( round(@mediumSize * @emSize) / @emSize );
-@largeRaw        : unit( round(@largeSize * @emSize) / @emSize );
-@bigRaw          : unit( round(@bigSize * @emSize) / @emSize );
-@hugeRaw         : unit( round(@hugeSize * @emSize) / @emSize );
-@massiveRaw      : unit( round(@massiveSize * @emSize) / @emSize );
+@miniRaw         : unit( (round(@miniSize * @emSize) / @emSize ));
+@tinyRaw         : unit( (round(@tinySize * @emSize) / @emSize ));
+@smallRaw        : unit( (round(@smallSize * @emSize) / @emSize ));
+@mediumRaw       : unit( (round(@mediumSize * @emSize) / @emSize ));
+@largeRaw        : unit( (round(@largeSize * @emSize) / @emSize ));
+@bigRaw          : unit( (round(@bigSize * @emSize) / @emSize ));
+@hugeRaw         : unit( (round(@hugeSize * @emSize) / @emSize ));
+@massiveRaw      : unit( (round(@massiveSize * @emSize) / @emSize ));
 
 @mini            : unit( @miniRaw, rem);
 @tiny            : unit( @tinyRaw, rem);
@@ -766,7 +766,7 @@
 
 /* Used to match floats with text */
 @lineHeightOffset       : ((@lineHeight - 1em) / 2);
-@headerLineHeightOffset : (@headerLineHeight - 1em) / 2;
+@headerLineHeightOffset : ((@headerLineHeight - 1em) / 2);
 
 /* Header Spacing */
 @headerTopMargin    : e(%("calc(2rem - %d)", @headerLineHeightOffset));

diff --git a/src/themes/default/modules/checkbox.variables b/src/themes/default/modules/checkbox.variables
@@ -114,7 +114,7 @@
 @sliderLineWidth: 3.5rem;
 @sliderTransitionDuration: 0.3s;
 
-@sliderHandleOffset: (1rem - @sliderHandleSize) / 2;
+@sliderHandleOffset: ((1rem - @sliderHandleSize) / 2);
 @sliderHandleTransition: left @sliderTransitionDuration @defaultEasing;
 @sliderHandleTransitionRightAligned: right @sliderTransitionDuration @defaultEasing;
 
@@ -171,7 +171,7 @@
 @toggleLaneVerticalOffset: 0;
 @toggleOffOffset: -0.05rem;
 @toggleOnOffset: (@toggleLaneWidth - @toggleHandleSize) + 0.15rem;
-@toggleCenterOffset: @toggleOnOffset / 2;
+@toggleCenterOffset: (@toggleOnOffset / 2);
 @toggleCenterLaneBackground: @veryStrongTransparentBlack;
 
 @toggleLabelDistance: @toggleLaneWidth + 1rem;
@@ -203,23 +203,23 @@
 @checkboxInvertedHoverBackground: @black;
 
 @miniCheckboxSize: @relativeMini;
-@miniCheckboxCircleScale: @miniRaw / 2;
-@miniCheckboxCircleLeft: unit((@miniRaw - @miniCheckboxCircleScale) / 2 + 0.05 , em);
+@miniCheckboxCircleScale: (@miniRaw / 2);
+@miniCheckboxCircleLeft: unit(((@miniRaw - @miniCheckboxCircleScale) / 2) + 0.05 , em);
 @tinyCheckboxSize: @relativeTiny;
-@tinyCheckboxCircleScale: @tinyRaw / 2;
-@tinyCheckboxCircleLeft: unit((@tinyRaw - @tinyCheckboxCircleScale) / 2 + 0.05 , em);
+@tinyCheckboxCircleScale: (@tinyRaw / 2);
+@tinyCheckboxCircleLeft: unit(((@tinyRaw - @tinyCheckboxCircleScale) / 2) + 0.05 , em);
 @smallCheckboxSize: @relativeSmall;
-@smallCheckboxCircleScale: @smallRaw / 2;
-@smallCheckboxCircleLeft: unit((@smallRaw - @smallCheckboxCircleScale) / 2 + 0.05 , em);
+@smallCheckboxCircleScale: (@smallRaw / 2);
+@smallCheckboxCircleLeft: unit(((@smallRaw - @smallCheckboxCircleScale) / 2) + 0.05 , em);
 @largeCheckboxSize: @relativeLarge;
-@largeCheckboxCircleScale: @largeRaw / 2;
-@largeCheckboxCircleLeft: unit((@largeRaw - @largeCheckboxCircleScale) / 2 + 0.05 , em);
+@largeCheckboxCircleScale: (@largeRaw / 2);
+@largeCheckboxCircleLeft: unit(((@largeRaw - @largeCheckboxCircleScale) / 2) + 0.05 , em);
 @bigCheckboxSize: @relativeBig;
-@bigCheckboxCircleScale: @bigRaw / 2;
-@bigCheckboxCircleLeft: unit((@bigRaw - @bigCheckboxCircleScale) / 2 + 0.05 , em);
+@bigCheckboxCircleScale: (@bigRaw / 2);
+@bigCheckboxCircleLeft: unit(((@bigRaw - @bigCheckboxCircleScale) / 2) + 0.05 , em);
 @hugeCheckboxSize: @relativeHuge;
-@hugeCheckboxCircleScale: @hugeRaw / 2;
-@hugeCheckboxCircleLeft: unit((@hugeRaw - @hugeCheckboxCircleScale) / 2 + 0.05 , em);
+@hugeCheckboxCircleScale: (@hugeRaw / 2);
+@hugeCheckboxCircleLeft: unit(((@hugeRaw - @hugeCheckboxCircleScale) / 2) + 0.05 , em);
 @massiveCheckboxSize: @relativeMassive;
-@massiveCheckboxCircleScale: @massiveRaw / 2;
-@massiveCheckboxCircleLeft: unit((@massiveRaw - @massiveCheckboxCircleScale) / 2 + 0.05 , em);
+@massiveCheckboxCircleScale: (@massiveRaw / 2);
+@massiveCheckboxCircleLeft: unit(((@massiveRaw - @massiveCheckboxCircleScale) / 2) + 0.05 , em);
diff --git a/src/themes/default/modules/dropdown.variables b/src/themes/default/modules/dropdown.variables
@@ -99,12 +99,12 @@
 
 /* Menu Image */
 @menuImageMaxHeight: 2em;
-@menuImageVerticalMargin: -(@menuImageMaxHeight - 1em) / 2;
+@menuImageVerticalMargin: (-(@menuImageMaxHeight - 1em) / 2);
 
 /* Item Sub-Element */
 @itemElementFloat: none;
 @itemElementDistance: @mini;
-@itemElementBottomDistance: @itemElementDistance / 2;
+@itemElementBottomDistance: (@itemElementDistance / 2);
 
 /* Sub-Menu Dropdown Icon */
 @itemDropdownIconDistance: 1em;
@@ -166,7 +166,7 @@
 @selectionIconZIndex: 3;
 @selectionIconHitbox: @selectionVerticalPadding;
 @selectionIconMargin: -@selectionIconHitbox;
-@selectionIconPadding: @selectionIconHitbox / @dropdownIconSize;
+@selectionIconPadding: (@selectionIconHitbox / @dropdownIconSize);
 @selectionIconTransition: opacity @defaultDuration @defaultEasing;
 
 @selectionMenuBorderRadius: 0 0 @borderRadius @borderRadius;

diff --git a/src/themes/default/modules/modal.variables b/src/themes/default/modules/modal.variables
@@ -19,7 +19,7 @@
 
 @closeHitbox: 2.25rem;
 @closeDistance: 0.25rem;
-@closeHitBoxOffset: (@closeHitbox - 1rem) / 2;
+@closeHitBoxOffset: ((@closeHitbox - 1rem) / 2);
 @closePadding: @closeHitBoxOffset 0 0 0;
 @closeTop: -(@closeDistance + @closeHitbox);
 @closeRight: -(@closeDistance + @closeHitbox);
@@ -92,7 +92,7 @@
 @widescreenMonitorMargin: 0 0 0 0;
 
 @fullScreenWidth: 95%;
-@fullScreenOffset: (100% - @fullScreenWidth) / 2;
+@fullScreenOffset: ((100% - @fullScreenWidth) / 2);
 @fullScreenMargin: 1em auto;
 
 /* Coupling */

diff --git a/src/themes/default/views/card.variables b/src/themes/default/views/card.variables
@@ -73,7 +73,7 @@
 @headerMargin: '';
 @headerFontWeight: @bold;
 @headerFontSize: @relativeBig;
-@headerLineHeightOffset: -(@lineHeight - 1em) / 2;
+@headerLineHeightOffset: (-(@lineHeight - 1em) / 2);
 @headerColor: @darkTextColor;
 
 /* Metadata */