fomantic-ui 2.9.1-beta.24 → 2.9.1-beta.26

package/src/themes/flat/collections/form.overrides

@@ -16,7 +16,7 @@
     border: none;
     box-shadow: none !important;
     border-bottom: 1px solid #ddd;
-    border-radius: 0em !important;
+    border-radius: 0 !important;
 }
 .ui.form .selection.dropdown > .menu {
     border-top-width: 1px !important;

package/src/themes/flat/collections/form.variables

@@ -7,10 +7,10 @@
 -------------------- */
 
 /* Text */
-@paragraphMargin: 1em 0em;
+@paragraphMargin: 1em 0;
 
 /* Field */
-@fieldMargin: 0em 0em 1em;
+@fieldMargin: 0 0 1em;
 
 /* Form Label */
 @labelFontSize: @relative11px;
@@ -22,7 +22,7 @@
 @inputHorizontalPadding: 0.5em;
 @inputBackground: transparent;
 @inputBorder: none;
-@inputBorderRadius: 0em;
+@inputBorderRadius: 0;
 @inputBoxShadow: none;
 @invertedInputColor: @invertedTextColor;
 
@@ -32,10 +32,10 @@
 @textAreaBorder: 1px solid #DDDDDD;
 
 /* Divider */
-@dividerMargin: 1em 0em;
+@dividerMargin: 1em 0;
 
 /* Validation Prompt */
-@validationMargin: 0em 0em 0em 1em;
+@validationMargin: 0 0 0 1em;
 @validationArrowOffset: -0.3em;
 
 /* -------------------
@@ -45,8 +45,8 @@
 /* Disabled */
 
 /* Focus */
-@inputFocusPointerSize: 0px;
-@inputErrorPointerSize: 0px;
+@inputFocusPointerSize: 0;
+@inputErrorPointerSize: 0;
 
 /* Dropdown Error */
 @dropdownErrorHoverBackground: #FFF2F2;
@@ -56,7 +56,7 @@
 @inputErrorFocusBackground: @negativeBackgroundColor;
 @inputErrorFocusColor: @negativeColorHover;
 @inputErrorFocusBorder: @negativeBorderColor;
-@inputErrorFocusBoxShadow: @inputErrorPointerSize 0em 0em 0em @negativeColorHover inset;
+@inputErrorFocusBoxShadow: @inputErrorPointerSize 0 0 0 @negativeColorHover inset;
 
 /* Placeholder */
 @inputPlaceholderColor: lighten(@inputColor, 55);
@@ -66,7 +66,7 @@
 
 /* Loading */
 @formLoaderDimmerColor: rgba(255, 255, 255, 0.6);
-@formLoaderPath: "@{imagePath}/loader-large.gif";
+@formLoaderPath: '@{imagePath}/loader-large.gif';
 @formLoaderPosition: 50% 50%;
 
 /* (x) Wide Field */

package/src/themes/flat/globals/site.variables

@@ -6,83 +6,83 @@
         Paths
 -------------------- */
 
-@imagePath : "../../themes/default/assets/images";
-@fontPath : "../../themes/default/assets/fonts";
+@imagePath: '../../themes/default/assets/images';
+@fontPath: '../../themes/default/assets/fonts';
 
 /* -------------------
        Fonts
 -------------------- */
 
-@headerFont : "Open Sans", "Helvetica Neue", Arial, Helvetica, sans-serif;
-@pageFont : "Open Sans", "Helvetica Neue", Arial, Helvetica, sans-serif;
+@headerFont: 'Open Sans', 'Helvetica Neue', Arial, Helvetica, sans-serif;
+@pageFont: 'Open Sans', 'Helvetica Neue', Arial, Helvetica, sans-serif;
 
 /* -------------------
       Site Colors
 -------------------- */
 
 /* ---  Colors  --- */
-@blue : #0074D9;
-@green : #2ECC40;
-@orange : #FF851B;
-@pink : #D9499A;
-@purple : #A24096;
-@red : #FF4136;
-@teal : #39CCCC;
-@yellow : #FFCB08;
-
-@black : #191919;
-@grey : #CCCCCC;
-@white : #FFFFFF;
+@blue: #0074D9;
+@green: #2ECC40;
+@orange: #FF851B;
+@pink: #D9499A;
+@purple: #A24096;
+@red: #FF4136;
+@teal: #39CCCC;
+@yellow: #FFCB08;
+
+@black: #191919;
+@grey: #CCCCCC;
+@white: #FFFFFF;
 
 /* ---  Light Colors  --- */
-@lightBlue : #54C8FF;
-@lightGreen : #2ECC40;
-@lightOrange : #FF851B;
-@lightPink : #FF8EDF;
-@lightPurple : #CDC6FF;
-@lightRed : #FF695E;
-@lightTeal : #6DFFFF;
-@lightYellow : #FFE21F;
-
-@primaryColor : @blue;
-@secondaryColor : @black;
+@lightBlue: #54C8FF;
+@lightGreen: #2ECC40;
+@lightOrange: #FF851B;
+@lightPink: #FF8EDF;
+@lightPurple: #CDC6FF;
+@lightRed: #FF695E;
+@lightTeal: #6DFFFF;
+@lightYellow: #FFE21F;
+
+@primaryColor: @blue;
+@secondaryColor: @black;
 
 /* -------------------
         Page
 -------------------- */
 
-@bodyBackground : #FCFCFC;
-@fontSize : 14px;
-@textColor : rgba(0, 0, 0, 0.8);
+@bodyBackground: #FCFCFC;
+@fontSize: 14px;
+@textColor: rgba(0, 0, 0, 0.8);
 
-@headerMargin : 1em 0em 1rem;
-@paragraphMargin : 0em 0em 1em;
+@headerMargin: 1em 0 1rem;
+@paragraphMargin: 0 0 1em;
 
-@linkColor : #009FDA;
-@linkUnderline : none;
-@linkHoverColor : lighten( @linkColor, 5);
-@linkHoverUnderline : @linkUnderline;
+@linkColor: #009FDA;
+@linkUnderline: none;
+@linkHoverColor: lighten( @linkColor, 5);
+@linkHoverUnderline: @linkUnderline;
 
-@highlightBackground : #FFFFCC;
-@highlightColor : @textColor;
+@highlightBackground: #FFFFCC;
+@highlightColor: @textColor;
 
 /* -------------------
   Background Colors
 -------------------- */
 
-@subtleTransparentBlack : rgba(0, 0, 0, 0.03);
-@transparentBlack : rgba(0, 0, 0, 0.05);
-@strongTransparentBlack : rgba(0, 0, 0, 0.1);
+@subtleTransparentBlack: rgba(0, 0, 0, 0.03);
+@transparentBlack: rgba(0, 0, 0, 0.05);
+@strongTransparentBlack: rgba(0, 0, 0, 0.1);
 
-@subtleTransparentWhite : rgba(255, 255, 255, 0.01);
-@transparentWhite : rgba(255, 255, 255, 0.05);
-@strongTransparentWhite : rgba(255, 255, 255, 0.01);
+@subtleTransparentWhite: rgba(255, 255, 255, 0.01);
+@transparentWhite: rgba(255, 255, 255, 0.05);
+@strongTransparentWhite: rgba(255, 255, 255, 0.01);
 
 /* Used for differentiating neutrals */
 @subtleGradient: linear-gradient(transparent, rgba(0, 0, 0, 0.05));
 
 /* Used for differentiating layers */
-@subtleShadow: 0px 1px 2px 0 rgba(0, 0, 0, 0.05);
+@subtleShadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
 
 /* -------------------
         Grid
@@ -94,8 +94,8 @@
      Breakpoints
 -------------------- */
 
-@mobileBreakpoint : 320px;
-@tabletBreakpoint : 768px;
-@computerBreakpoint : 992px;
-@largeMonitorBreakpoint : 1400px;
-@widescreenMonitorBreakpoint : 1900px;
+@mobileBreakpoint: 320px;
+@tabletBreakpoint: 768px;
+@computerBreakpoint: 992px;
+@largeMonitorBreakpoint: 1400px;
+@widescreenMonitorBreakpoint: 1900px;

package/src/themes/github/collections/form.overrides

@@ -10,6 +10,6 @@
 
 .ui.selection.dropdown:focus {
     box-shadow:
-        0px 1px 2px rgba(0, 0, 0, 0.075) inset,
-        0px 0px 5px rgba(81, 167, 232, 0.5);
+        0 1px 2px rgba(0, 0, 0, 0.075) inset,
+        0 0 5px rgba(81, 167, 232, 0.5);
 }

package/src/themes/github/collections/form.variables

@@ -20,8 +20,8 @@
 
 @inputFocusBackground: #FFFFFF;
 @inputFocusBoxShadow:
-    0px 1px 2px rgba(0, 0, 0, 0.075) inset,
-    0px 0px 5px rgba(81, 167, 232, 0.5)
+    0 1px 2px rgba(0, 0, 0, 0.075) inset,
+    0 0 5px rgba(81, 167, 232, 0.5)
 ;
 @inputFocusBorderColor: #51A7E8;
 @inputFocusBorderRadius: @inputBorderRadius;

package/src/themes/github/collections/menu.overrides

@@ -3,5 +3,5 @@
 *******************************/
 
 .ui.menu .item > .label {
-    box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1) inset;
+    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1) inset;
 }

package/src/themes/github/collections/menu.variables

@@ -8,7 +8,7 @@
 @background: #FFFFFF linear-gradient(rgba(255, 255, 255, 0.05), rgba(0, 0, 0, 0.05));
 @fontWeight: normal;
 
-@activeBorderSize: 0em;
+@activeBorderSize: 0;
 
 @hoverBackground: rgba(0, 0, 0, 0.02);
 @downBackground: rgba(0, 0, 0, 0.06);
@@ -53,8 +53,8 @@
 @verticalItemBackground: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.02));
 
 @invertedBackground: @black linear-gradient(rgba(255, 255, 255, 0.05), rgba(0, 0, 0, 0));
-@invertedBoxShadow             :
-    0px 1px 2px 0px rgba(0, 0, 0, 0.15),
-    0px 0px 0px 1px rgba(255, 255, 255, 0.15)
+@invertedBoxShadow:
+    0 1px 2px 0 rgba(0, 0, 0, 0.15),
+    0 0 0 1px rgba(255, 255, 255, 0.15)
 ;
 @secondaryVerticalPadding: 0.75em;

package/src/themes/github/collections/message.variables

@@ -1,7 +1,7 @@
 @background: linear-gradient(rgba(255, 255, 255, 0.1), rgba(0, 0, 0, 0.05)) #FEFEFE;
 @boxShadow:
-    0px 0px 0px 1px rgba(255, 255, 255, 0.3) inset,
-    0px 0px 0px 1px rgba(0, 0, 0, 0.2) inset
+    0 0 0 1px rgba(255, 255, 255, 0.3) inset,
+    0 0 0 1px rgba(0, 0, 0, 0.2) inset
 ;
 @verticalPadding: 15px;
 @horizontalPadding: 15px;
@@ -13,9 +13,9 @@
 @errorTextColor: #991111;
 
 @floatingBoxShadow:
-    0px 0px 0px 1px rgba(0, 0, 0, 0.1) inset,
-    0px 2px 3px 0px rgba(0, 0, 0, 0.1),
-    0px 0px 0px 1px rgba(0, 0, 0, 0.05) inset
+    0 0 0 1px rgba(0, 0, 0, 0.1) inset,
+    0 2px 3px 0 rgba(0, 0, 0, 0.1),
+    0 0 0 1px rgba(0, 0, 0, 0.05) inset
 ;
 
 @infoBorderColor: #97C1DA;

package/src/themes/github/elements/button.variables

@@ -8,8 +8,8 @@
 @fontWeight: bold;
 @textColor: #333333;
 
-@textShadow: 0px 1px 0px rgba(255, 255, 255, 0.9);
-@invertedTextShadow: 0px -1px 0px rgba(0, 0, 0, 0.25);
+@textShadow: 0 1px 0 rgba(255, 255, 255, 0.9);
+@invertedTextShadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
 
 @borderRadius: @relativeBorderRadius;
 

package/src/themes/github/elements/icon.variables

@@ -3,7 +3,7 @@
 @fonts: {
     @solid: {
         font-family: @fontName;
-        src: url("@{fontPath}/@{fontName}.woff2") format('woff');
+        src: url('@{fontPath}/@{fontName}.woff2') format('woff');
         font-style: normal;
         font-weight: @normal;
         font-variant: normal;
@@ -23,6 +23,6 @@
 @small: 13px;
 @medium: 16px;
 @large: 18px;
-@big : 20px;
+@big: 20px;
 @huge: 28px;
 @massive: 32px;

package/src/themes/github/elements/segment.variables

@@ -8,7 +8,7 @@
 
 @segmentBorderWidth: 1px;
 @border: 1px solid #D8DEE2;
-@boxShadow: 0px 1px 3px rgba(0, 0, 0, 0.075);
+@boxShadow: 0 1px 3px rgba(0, 0, 0, 0.075);
 
 @verticalPadding: 20px;
 @horizontalPadding: 20px;
@@ -20,7 +20,7 @@
 *******************************/
 
 /* Raised */
-@raisedBoxShadow: 0px 1px 3px rgba(0, 0, 0, 0.075);
+@raisedBoxShadow: 0 1px 3px rgba(0, 0, 0, 0.075);
 
 /* Colors */
 @coloredBorderSize: 0.5em;

package/src/themes/github/elements/step.overrides

@@ -19,7 +19,7 @@
     display: block;
     border: none;
     top: 50%;
-    right: 0%;
+    right: 0;
     border-left: none;
     border-bottom: 1px solid rgba(0, 0, 0, 0.2);
     border-right: 1px solid rgba(0, 0, 0, 0.2);

package/src/themes/github/elements/step.variables

@@ -13,7 +13,7 @@
 
 /* Group */
 @stepsBackground: #FFFFFF;
-@stepsBoxShadow: 0px 0px 1px 0px rgba(0, 0, 0, 0.15);
+@stepsBoxShadow: 0 0 1px 0 rgba(0, 0, 0, 0.15);
 
 /* States */
 @activeBackground: #FFFFFF;
@@ -23,4 +23,4 @@
 @arrowTopOffset: 100%;
 @arrowRightOffset: 50%;
 @arrowBorderColor: rgba(0, 0, 0, 0.2);
-@arrowBorderWidth: 0px 0px @borderWidth @borderWidth;
+@arrowBorderWidth: 0 0 @borderWidth @borderWidth;

package/src/themes/github/globals/site.variables

@@ -2,13 +2,13 @@
      User Global Variables
 *******************************/
 
-@pageMinWidth : 1049px;
-@pageOverflowX : visible;
+@pageMinWidth: 1049px;
+@pageOverflowX: visible;
 
 @emSize: 13px;
-@fontSize : 13px;
-@fontName : 'Arial';
-@importGoogleFonts : false;
+@fontSize: 13px;
+@fontName: 'Arial';
+@importGoogleFonts: false;
 @importFonts: false;
 
 @h1: 2.25em;

package/src/themes/github/modules/dropdown.overrides

@@ -9,14 +9,14 @@
 
 /* Dropdown Carets */
 @font-face {
-    font-family: 'Dropdown';
+    font-family: Dropdown;
     src: url(data:application/font-woff;base64,d09GRk9UVE8AAASEAAsAAAAABwQAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAABDRkYgAAAC5AAAAU8AAAHrSr22AUZGVE0AAARQAAAAHAAAAByNrZ/TR0RFRgAABDQAAAAcAAAAIAAnABhPUy8yAAABYAAAAEIAAABgTadXCGNtYXAAAAKEAAAAVAAAAWQFcOKQaGVhZAAAAQgAAAAyAAAANg+j805oaGVhAAABPAAAABsAAAAkAwcBDWhtdHgAAARsAAAAFgAAAB4EAQASbWF4cAAAAVgAAAAGAAAABgAIUABuYW1lAAABpAAAAN8AAAG2rSbAM3Bvc3QAAALYAAAADAAAACAAAwAAeJxjYGRgYADiKjtG3nh+m68M3EwMIHCBwT0CRN9PyHYCUp6Mqox5QJqDASwNAMNOBrgAAHicY2BkYGB88P8BkFRlYACTjAyogB0AWWsDFgAAAFAAAAgAAHicY2Bm+Mg4gYGVgYHRhzGNgYHBHUp/ZZBkaGFABYwCSJyANNcUBgcGhg+3GB/8fwCUfMCgAFIDV6AAhIwAUbEMSQAAeJx1zTEKwkAUBNBJjIoKIggW2mwvBEVvIAgiNhY2VjEuQUh2YY2FeACPYOltvIH3cZJ8ywQS3p/d+QEwwAce/o8v9tDGUOzTU3GDXokD+ihuooeHuMX8Je5ijC9bXtCRP1T20Kcq+/RE3KAX4oDeipsYIRa3mD/FXSzxLtZeeGyR8bUwHGObWUvsoZHghhQRHEed3NLI1d+vyw/c43DleZErzBFixli768UaNQ9n9d11OedsJdxiyk0RZ40zsxPu/G7K7k66IUvW5CrRRrso12d1uqtNbHfcF+IHrnU+mwB4nGNgYGBmgGAZBkYGEIgD8hjBfBYGJyDNxcDBwASEjAwKH279//v/P1iVwofrYDbj/8dgPkQvGwMPkGRhYAWy2MHCbEDMxIAXMOOXHvIAAINhDt14nGNgZsALAAB9AAR4nE2Pv0rEQBCHZ3J7d4vGqEcOFaKC/zolZ6OWwmElNj6ClYWmyivcblyzE+RaK8EHsPMxBBtrwUdwA1fobpI7ZWBYfux8fD8ExgAR+fVVcpMkt4AeIAzLLSi3sdzxyt1WucqU31I+25iDtcvej1Kzh99V7+a19NoRPC1GAEsRvCxHwCP87MG8I7WgDRwWoAcrEMGmnT3YT+N0kB7G6Vk8PHLr2K0Tt04HB3FjMhUCQIESM7xDhfeYA3dcz5IZdOAcHuAD14MgeAu+zTNTRV5oTUR5obgZdwpVZFqQzEfKTiaE4JNwEralHGUuErnQNjE2oYxUwS0ldBTSxI3L7cOyKo60ib0lezSl1Rw+GXdq1pQiH03SdzKka4ymosLQTMcedSuIlEJUMqNcUi0jdIP5Ysb++leqLtSI/NWSTS0xq0WyYajQXPSVP/cLitO4NgB4nGNgZGBg4AFiAQYJBiYgzQLEIJoRggEFbQBAAAAAAQAAAADeTO04AAAAANAAR1gAAAAA32BrQnicY2BAAEYQVoVghu0MQgwMAAc/ARcAAA==) format('woff');
     font-weight: normal;
     font-style: normal;
 }
 
 .ui.dropdown > .dropdown.icon {
-    font-family: 'Dropdown';
+    font-family: Dropdown;
     line-height: 1;
     height: 1em;
     width: 1.23em;
@@ -40,10 +40,10 @@
 
 .ui.dropdown .item .left.dropdown.icon::before,
 .ui.dropdown .left.menu .item .dropdown.icon::before {
-    content: "\f0d9"/*rtl:"\f0da"*/;
+    content: '\f0d9'/*rtl:'\f0da'*/;
 }
 
 /* Vertical Menu Dropdown */
 .ui.vertical.menu .dropdown.item > .dropdown.icon::before {
-    content: "\f0da"/*rtl:"\f0d9"*/;
+    content: '\f0da'/*rtl:'\f0d9'*/;
 }

package/src/themes/github/modules/dropdown.variables

@@ -6,25 +6,25 @@
     width @defaultDuration @defaultEasing
 ;
 
-@menuPadding: 0px;
+@menuPadding: 0;
 
 @itemVerticalPadding: @relative8px;
 @itemHorizontalPadding: @relative14px;
 
-@dropdownIconMargin: 0em 0em 0em 2px;
+@dropdownIconMargin: 0 0 0 2px;
 
-@raisedBoxShadow: 0px 3px 12px rgba(0, 0, 0, 0.15);
+@raisedBoxShadow: 0 3px 12px rgba(0, 0, 0, 0.15);
 
-@menuPadding: @relative5px 0px;
+@menuPadding: @relative5px 0;
 
-@menuHeaderMargin: 0em;
+@menuHeaderMargin: 0;
 @menuHeaderPadding: @relative6px @itemHorizontalPadding;
 @menuHeaderFontSize: @relative12px;
 @menuHeaderTextTransform: none;
 @menuHeaderFontWeight: normal;
 @menuHeaderColor: #767676;
 
-@menuDividerMargin: @relative8px 0em;
+@menuDividerMargin: @relative8px 0;
 
 @disabledOpacity: 0.6;
 

package/src/themes/gmail/collections/message.overrides

@@ -0,0 +1,3 @@
+/*******************************
+           Overrides
+*******************************/

package/src/themes/gmail/collections/message.variables

@@ -1,13 +1,13 @@
 @background: #F3F3F3;
 
-@boxShadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1) inset;
+@boxShadow: 0 0 0 1px rgba(0, 0, 0, 0.1) inset;
 @borderRadius: 4px;
 @verticalPadding: 7px;
 @horizontalPadding: 15px;
 
 @headerFontSize: 1em;
 
-@floatingBoxShadow: 0px 2px 4px rgba(0, 0, 0, 0.2);
+@floatingBoxShadow: 0 2px 4px rgba(0, 0, 0, 0.2);
 
 @iconSize: 1.5em;
 @iconDistance: 1em;

package/src/themes/instagram/views/card.overrides

@@ -6,6 +6,6 @@
 
 .ui.cards > .card,
 .ui.card {
-    font-family: 'Montserrat';
+    font-family: Montserrat;
     font-size-adjust: 0.5;
 }

package/src/themes/instagram/views/card.variables

@@ -17,6 +17,6 @@
 
 @metaColor: #A5A7AA;
 
-@linkHoverRaiseDistance: 0px;
+@linkHoverRaiseDistance: 0;
 @linkHoverBoxShadow: none;
 @linkHoverBorder: 1px solid #D0D0D8;

package/src/themes/joypixels/elements/emoji.variables

@@ -13,8 +13,8 @@
    Downloading and hosting the joxpixels assets locally may require an additional license depending on the usage
    Find joypixels licenses at https://www.joypixels.com/licenses
 */
-@emojiPath: "https://cdn.jsdelivr.net/joypixels/assets/6.6/png/unicode/128/";
-@emojiFileType: "png";
+@emojiPath: 'https://cdn.jsdelivr.net/joypixels/assets/6.6/png/unicode/128/';
+@emojiFileType: 'png';
 
 /* --------------
    Definition

package/src/themes/material/collections/menu.variables

@@ -3,8 +3,8 @@
 *******************************/
 
 @fontFamily: 'Roboto', Arial, sans-serif;
-@boxShadow: 0px 1px 6px rgba(0, 0, 0, 0.2);
-@dividerSize: 0px;
+@boxShadow: 0 1px 6px rgba(0, 0, 0, 0.2);
+@dividerSize: 0;
 
 @itemVerticalPadding: @relativeLarge;
 @itemHorizontalPadding: @relativeLarge;

package/src/themes/material/elements/button.overrides

@@ -2,12 +2,12 @@
 
 .ui.primary.button:hover {
     box-shadow:
-        0px 0px 0px 1px rgba(0, 0, 0, 0.3) inset,
-        0px 2px 3px 0px rgba(0, 0, 0, 0.35) !important;
+        0 0 0 1px rgba(0, 0, 0, 0.3) inset,
+        0 2px 3px 0 rgba(0, 0, 0, 0.35) !important;
 }
 
 .ui.secondary.button:hover {
     box-shadow:
-        0px 0px 0px 1px rgba(0, 0, 0, 0.2) inset,
-        0px 2px 3px 0px rgba(0, 0, 0, 0.3) !important;
+        0 0 0 1px rgba(0, 0, 0, 0.2) inset,
+        0 2px 3px 0 rgba(0, 0, 0, 0.3) !important;
 }

package/src/themes/material/elements/button.variables

@@ -6,26 +6,26 @@
        Element
 -------------------- */
 
-@googleFontName : 'Roboto';
-@pageFont : 'Roboto', Arial, sans-serif;
+@googleFontName: 'Roboto';
+@pageFont: 'Roboto', Arial, sans-serif;
 
 @medium: 13px;
 
-@verticalPadding : 0.8em;
-@horizontalPadding : 0.8em;
-@borderRadius : @relative3px;
-@color : #222222;
-@fontWeight : normal;
-@textTransform : none;
+@verticalPadding: 0.8em;
+@horizontalPadding: 0.8em;
+@borderRadius: @relative3px;
+@color: #222222;
+@fontWeight: normal;
+@textTransform: none;
 
-@backgroundColor : @white;
-@backgroundImage : linear-gradient(transparent, rgba(0, 0, 0, 0.02));
+@backgroundColor: @white;
+@backgroundImage: linear-gradient(transparent, rgba(0, 0, 0, 0.02));
 
 @solidBorderColor: #DDDDDD;
 
 @borderBoxShadowColor: @solidBorderColor;
-@borderBoxShadow: 0px 0px 0px 1px @solidBorderColor inset;
-@shadowBoxShadow: 0px 0px 0px 0px transparent;
+@borderBoxShadow: 0 0 0 1px @solidBorderColor inset;
+@shadowBoxShadow: 0 0 0 0 transparent;
 
 @transition:
     opacity 0.3s @defaultEasing,
@@ -42,7 +42,7 @@
 @hoverBackgroundColor: @white;
 @hoverBoxShadow:
     @borderBoxShadow,
-    0px 2px 3px 0px rgba(0, 0, 0, 0.2) !important
+    0 2px 3px 0 rgba(0, 0, 0, 0.2) !important
 ;
 
 @downBackgroundColor: @white;
@@ -51,14 +51,14 @@
 @downBoxShadow: @borderBoxShadow;
 
 @activeBackgroundColor: #F0F0F0;
-@activeBoxShadow: 0px 0px 0px 1px #DDDDDD;
+@activeBoxShadow: 0 0 0 1px #DDDDDD;
 
 /* -------------------
       Variations
 -------------------- */
 
 /* Basic */
-@basicBorderSize: 0px;
+@basicBorderSize: 0;
 @basicBorderRadius: 4px;
 @basicColoredBorderSize: 1px;
 @basicHoverBackground: @white;
@@ -67,27 +67,27 @@
 @basicDownBoxShadow: @downBoxShadow;
 
 @basicActiveBackground: #FFFFFF;
-@basicActiveBoxShadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.2);
+@basicActiveBoxShadow: 0 0 0 1px rgba(0, 0, 0, 0.2);
 
 /* Labeled */
 @labeledIconBackgroundColor: transparent;
 @labeledIconWidth: 2em;
 
-@labeledLabelBorderOffset: 0px;
+@labeledLabelBorderOffset: 0;
 
 /* Colored */
-@coloredBackgroundImage : @subtleGradient;
-@coloredBoxShadow : 0px 0px 0px 1px rgba(0, 0, 0, 0.1) inset;
+@coloredBackgroundImage: @subtleGradient;
+@coloredBoxShadow: 0 0 0 1px rgba(0, 0, 0, 0.1) inset;
 
 /* Primary */
-@primaryColor : #4184F3;
-@primaryBoxShadow : 0px 0px 0px 1px #0157E4 inset;
+@primaryColor: #4184F3;
+@primaryBoxShadow: 0 0 0 1px #0157E4 inset;
 
 /* Secondary */
-@secondaryColor : #EEEEEE;
-@secondaryBackgroundImage : @backgroundImage;
-@secondaryTextColor : @textColor;
-@secondaryBoxShadow : @borderBoxShadow;
+@secondaryColor: #EEEEEE;
+@secondaryBackgroundImage: @backgroundImage;
+@secondaryTextColor: @textColor;
+@secondaryBoxShadow: @borderBoxShadow;
 
 /* Emotive */
 @positiveColor: #3D9400;

package/src/themes/material/elements/header.variables

@@ -2,7 +2,7 @@
        Header
 -------------------- */
 
-@headerFont : 'Roboto', Arial, sans-serif;
+@headerFont: 'Roboto', Arial, sans-serif;
 @fontWeight: normal;
 
 @iconSize: 2em;
@@ -12,8 +12,8 @@
 @subHeaderFontSize: 1rem;
 
 /* HTML Headings */
-@h1 : 2.25rem;
-@h2 : 2rem;
-@h3 : 1.75rem;
-@h4 : 1.5rem;
-@h5 : 1.25rem;
+@h1: 2.25rem;
+@h2: 2rem;
+@h3: 1.75rem;
+@h4: 1.5rem;
+@h5: 1.25rem;