less-rails-semantic_ui 1.12.3.0 → 2.0.0.0

data/assets/stylesheets/semantic_ui/theme.less

@@ -4,30 +4,37 @@
 
 @theme : @@element;
 
-/*------------------
-    Default Theme
--------------------*/
 
-@import "@{themesFolder}/default/globals/site.variables";
-@import "@{themesFolder}/default/@{type}s/@{element}.variables";
+/*--------------------
+   Site Variables
+---------------------*/
 
-/*------------------
-   Packaged Theme
--------------------*/
+/* Default */
+@import "@{themesFolder}/default/globals/site.variables";
 
+/* Packaged Theme */
 @import "@{themesFolder}/@{site}/globals/site.variables";
-@import "@{themesFolder}/@{theme}/@{type}s/@{element}.variables";
-
-/*------------------
-     Site Theme
--------------------*/
 
+/* Site Theme */
 @import "@{siteFolder}/globals/site.variables";
+
+
+/*-------------------
+ Component Variables
+---------------------*/
+
+/* Default */
+@import "@{themesFolder}/default/@{type}s/@{element}.variables";
+
+/* Packaged Theme */
+@import "@{themesFolder}/@{theme}/@{type}s/@{element}.variables";
+
+/* Site Theme */
 @import "@{siteFolder}/@{type}s/@{element}.variables";
 
 
 /*******************************
-        Import Mix-ins
+             Mix-ins
 *******************************/
 
 /*------------------
@@ -35,7 +42,7 @@
 -------------------*/
 
 .loadFonts() when (@importGoogleFonts) {
-  @import (css) '@{googleProtocol}fonts.googleapis.com/css?family=@{googleFontRequest}';
+  @import url('@{googleProtocol}fonts.googleapis.com/css?family=@{googleFontRequest}');
 }
 
 /*------------------

data/assets/stylesheets/semantic_ui/themes/amazon/elements/button.overrides

@@ -21,20 +21,20 @@
 }
 
 
-.ui.labeled.icon.buttons .button .icon,
-.ui.labeled.icon.button .icon {
+.ui.labeled.icon.buttons .button > .icon,
+.ui.labeled.icon.button > .icon {
   padding-bottom: 0.48em;
   padding-top: 0.48em;
   position: absolute;
   text-align: center;
   width: 2em;
   height: 2em;
-  top: 0.3em;
+  top: 0.35em;
   left: 0.4em;
   border-radius: 3px;
 }
-.ui.right.labeled.icon.buttons .button .icon,
-.ui.right.labeled.icon.button .icon {
+.ui.right.labeled.icon.buttons .button > .icon,
+.ui.right.labeled.icon.button > .icon {
   left: auto;
   right: 0.4em;
   border-radius: 3px;

data/assets/stylesheets/semantic_ui/themes/amazon/elements/button.variables

@@ -8,12 +8,13 @@
 @textColor: #111111;
 @fontWeight: normal;
 @transition:
-  opacity @transitionDuration @transitionEasing,
-  background-color @transitionDuration @transitionEasing,
-  color @transitionDuration @transitionEasing,
-  background @transitionDuration @transitionEasing
+  opacity @defaultDuration @defaultEasing,
+  background-color @defaultDuration @defaultEasing,
+  color @defaultDuration @defaultEasing,
+  background @defaultDuration @defaultEasing
 ;
 
+@hoverBackgroundColor: #E0E0E0;
 
 @borderRadius: 3px;
 @verticalPadding: 0.8em;

data/assets/stylesheets/semantic_ui/themes/basic/collections/table.variables

@@ -3,6 +3,7 @@
 --------------------*/
 
 @headerBackground: @white;
+@footerBackground: @white;
 
 @cellVerticalPadding: 1em;
 @cellHorizontalPadding: 1em;

data/assets/stylesheets/semantic_ui/themes/basic/views/card.variables

@@ -21,13 +21,15 @@
 @extraBoxShadow: none;
 @extraPadding: 0.5em 0em;
 
-@extraLinkColor: @linkColor;
-@extraLinkHoverColor: @linkColor;
+@extraLinkColor: @textColor;
+@extraLinkHoverColor: @linkHoverColor;
 
-@headerFontSize: 1.2em;
-@headerLinkColor: @linkColor;
+@headerFontSize: @relativeLarge;
+@headerLinkColor: @textColor;
+@headerLinkHoverColor: @linkHoverColor;
 
 @imageBorderRadius: @borderRadius;
 @imageBorder: 1px solid @borderColor;
 
+@linkHoverBackground: transparent;
 @linkHoverBoxShadow: none;

data/assets/stylesheets/semantic_ui/themes/bookish/elements/header.variables

@@ -30,8 +30,8 @@
 @h5: 0.9rem;
 
 /* Sizing */
-@tiny: 1.5em;
-@small: 1.33em;
+@huge: 1.75em;
+@large: 1.33em;
 @medium: 1.33em;
-@large: 1em;
-@huge: 0.9em;
+@small: 1em;
+@tiny: 0.9em;

data/assets/stylesheets/semantic_ui/themes/bootstrap3/elements/button.variables

@@ -8,7 +8,7 @@
 @fontWeight: normal;
 @textColor: rgba(51, 51, 51, 1);
 
-@borderRadius: 0.2857rem;
+@borderRadius: @4px;
 
 @lineHeight: 1.42857;
 @verticalPadding: 0.8571em;

data/assets/stylesheets/semantic_ui/themes/chubby/collections/form.overrides

@@ -5,4 +5,12 @@
 .ui.form .selection.dropdown {
   padding: 1.1em 1.2em;
   border-width: 2px;
+}
+.ui.form .selection.dropdown .menu {
+  min-width: calc(100% + 4px);
+  margin: 0 -2px;
+  border-width: 2px;
+}
+.ui.form .selection.dropdown input {
+  padding: inherit;
 }

data/assets/stylesheets/semantic_ui/themes/chubby/collections/menu.variables

@@ -0,0 +1,40 @@
+/*******************************
+             Menu
+*******************************/
+
+@background: @darkWhite;
+@boxShadow: none;
+@dividerSize: 0px;
+
+@verticalBoxShadow: 0px 0px 0px 2px @borderColor inset;
+@verticalActiveBoxShadow: none;
+
+@itemVerticalPadding: 1.25em;
+@itemHorizontalPadding: 2em;
+@itemFontWeight: bold;
+
+@activeItemBackground: @primaryColor;
+@activeItemTextColor: @white;
+@activeHoverItemBackground: @primaryColorHover;
+@activeHoverItemColor: @white;
+
+@secondaryItemPadding: @relativeSmall @relativeMedium;
+
+@secondaryActiveItemBackground: @primaryColor;
+@secondaryActiveItemColor: @white;
+@secondaryActiveHoverItemBackground: @primaryColorHover;
+@secondaryActiveHoverItemColor: @white;
+
+@secondaryPointingBorderWidth: 4px;
+@secondaryPointingActiveBorderColor: @primaryColor;
+@secondaryPointingActiveTextColor: @primaryColor;
+
+@arrowSize: 1em;
+@arrowActiveColor: @primaryColor;
+@arrowActiveHoverColor: @primaryColorHover;
+@arrowBorder: transparent;
+
+@paginationActiveBackground: @lightGrey;
+
+@borderColor: @darkWhite;
+@tabularBorderWidth: 2px;

data/assets/stylesheets/semantic_ui/themes/classic/modules/progress.variables

@@ -6,3 +6,4 @@
 @boxShadow: 0px 0px 4px rgba(0, 0, 0, 0.1) inset;
 @barBackground: @subtleGradient #888888;
 @border: 1px solid @borderColor;
+@padding: @relative3px;

data/assets/stylesheets/semantic_ui/themes/classic/views/card.overrides

@@ -75,7 +75,7 @@
 
 @extraPadding: 0.5em 0.75em;
 @extraColor: @lightTextColor;
-@extraTransition: color @transitionDuration @transitionEasing;
+@extraTransition: color @defaultDuration @defaultEasing;
 
 /*-------------------
        States

data/assets/stylesheets/semantic_ui/themes/colored/modules/checkbox.variables

@@ -0,0 +1,17 @@
+/* Checkbox */
+@checkboxActiveBackground: @primaryColor;
+@checkboxActiveBorderColor: @primaryColor;
+@checkboxActiveCheckColor: @white;
+@checkboxTransition: none;
+
+/* Slider */
+@sliderOnLineColor: @primaryColor;
+
+/* Radio */
+@radioActiveBulletColor @primaryColor;
+
+/* Handle */
+@handleBackground: @white @subtleGradient;
+@handleBoxShadow:
+  0px 0px 0px 1px @selectedBorderColor inset
+;

data/assets/stylesheets/semantic_ui/themes/default/collections/breadcrumb.variables

@@ -10,11 +10,11 @@
 @display: inline-block;
 @verticalAlign: middle;
 
-@dividerSpacing: 0.2rem;
-@dividerOpacity: 0.5;
+@dividerSpacing: @3px;
+@dividerOpacity: 0.7;
 @dividerColor: @lightTextColor;
 
-@dividerSize: 0.9em;
+@dividerSize: @relativeSmall;
 @dividerVerticalAlign: baseline;
 
 @iconDividerSize: @relativeTiny;
@@ -24,20 +24,10 @@
 @sectionPadding: 0em;
 
 /* Coupling */
-@segmentPadding: 0.5em 1em;
+@segmentPadding: @relativeMini @relativeMedium;
 
 /*-------------------
        States
 --------------------*/
 
-@activeFontWeight: bold;
-
-/* Sizes */
-@mini: 0.65em;
-@tiny: 0.7em;
-@small: 0.75em;
-@medium: 1em;
-@big: 1.05em;
-@large: 1.1em;
-@huge: 1.3em;
-@massive: 1.5em;
+@activeFontWeight: bold;

data/assets/stylesheets/semantic_ui/themes/default/collections/form.variables

@@ -17,9 +17,9 @@
 @fieldMargin: 0em 0em @rowDistance;
 
 /* Form Label */
-@labelDistance: 0.2857rem;
+@labelDistance: @4px;
 @labelMargin: 0em 0em @labelDistance 0em;
-@labelFontSize: 0.9285em;
+@labelFontSize: @relativeSmall;
 @labelFontWeight: bold;
 @labelTextTransform: none;
 @labelColor: @textColor;
@@ -28,19 +28,13 @@
 @inputFont: @pageFont;
 @inputWidth: 100%;
 @inputFontSize: 1em;
-@inputVerticalPadding: 0.78571em;
-@inputHorizontalPadding: 1em;
-@inputLineHeight: 1.2142em;
 @inputPadding: (@inputVerticalPadding + ((1em - @inputLineHeight) / 2)) @inputHorizontalPadding;
-@inputBackground: #FFFFFF;
 @inputBorder: 1px solid @borderColor;
 @inputBorderRadius: @absoluteBorderRadius;
 @inputColor: @textColor;
 @inputTransition:
-  background-color 0.2s ease,
-  color 0.2s ease,
-  box-shadow 0.2s ease,
-  border-color 0.2s ease
+  color @defaultDuration @defaultEasing,
+  border-color @defaultDuration @defaultEasing
 ;
 @inputBoxShadow: 0em 0em 0em 0em transparent inset;
 
@@ -81,17 +75,15 @@
         States
 --------------------*/
 
-/* Disabled */
-
 /* Focus */
-@inputFocusPointerSize: 1px;
+@inputFocusPointerSize: 0px;
 
 /* Input Focus */
 @inputFocusBackground: @inputBackground;
 @inputFocusBorderColor: @selectedBorderColor;
-@inputFocusColor: rgba(0, 0, 0, 0.85);
+@inputFocusColor: @selectedTextColor;
 @inputFocusBoxShadow: @inputFocusPointerSize 0em 0em 0em @selectedBorderColor inset;
-@inputFocusBorderRadius: 0em @inputBorderRadius @inputBorderRadius 0em;
+@inputFocusBorderRadius: @inputBorderRadius;
 
 /* Text Area Focus */
 @textAreaFocusBackground: @inputFocusBackground;
@@ -100,25 +92,39 @@
 @textAreaFocusBoxShadow: @inputFocusBoxShadow;
 @textAreaFocusBorderRadius: @inputFocusBorderRadius;
 
-/* Error */
-@formErrorColor: @negativeColor;
+/* Disabled */
+@disabledLabelOpacity: @disabledOpacity;
+
+/* Errored Input */
+@formErrorColor: @negativeTextColor;
 @formErrorBorder: @negativeBorderColor;
 @formErrorBackground: @negativeBackgroundColor;
 
+/* AutoFill */
+@inputAutoFillBackground: #FFFFF0;
+@inputAutoFillBorder: #E5DFA1;
+@inputAutoFillFocusBackground: @inputAutoFillBackground;
+@inputAutoFillFocusBorder: #D5C315;
+@inputAutoFillErrorBackground: #FFFAF0;
+@inputAutoFillErrorBorder: #E0B4B4;
+
+
 /* Input Error */
-@inputErrorPointerSize: 2px;
-@inputErrorBorderRadius: 0em @inputBorderRadius @inputBorderRadius 0em;
-@inputErrorBoxShadow: @inputErrorPointerSize 0em 0em 0em @formErrorColor inset;
+@inputErrorBorderRadius: @inputBorderRadius;
+@inputErrorBoxShadow: none;
 
 /* Dropdown Error */
 @dropdownErrorHoverBackground: #FBE7E7;
+@dropdownErrorSelectedBackground: @dropdownErrorHoverBackground;
 @dropdownErrorActiveBackground: #FDCFCF;
+@dropdownErrorLabelBackground: #EACBCB;
+@dropdownErrorLabelColor: @errorTextColor;
 
 /* Focused Error */
 @inputErrorFocusBackground: @negativeBackgroundColor;
-@inputErrorFocusColor: @negativeColorHover;
+@inputErrorFocusColor: @negativeTextColor;
 @inputErrorFocusBorder: @negativeBorderColor;
-@inputErrorFocusBoxShadow: @inputErrorPointerSize 0em 0em 0em @negativeColorHover inset;
+@inputErrorFocusBoxShadow: none;
 
 /* Placeholder */
 @inputPlaceholderColor: lighten(@inputColor, 55);
@@ -133,8 +139,6 @@
 
 /* Loading Spinner */
 @loaderSize: 3em;
-@loaderOffset: -(@loaderSize / 2);
-@loaderMargin: @loaderOffset 0em 0em @loaderOffset;
 @loaderLineZIndex: 101;
 
 /*-------------------
@@ -168,23 +172,15 @@
 
 
 /* Inline */
-@inlineLabelFontSize: @labelFontSize;
-@inlineLabelVerticalAlign: middle;
-@inlineGroupedFieldLabelDistance: 0.5rem;
-@inlineCheckboxLabelDistance: 1.75em;
+@inlineInputSize: @relativeMedium;
 
-@inlineLabelMargin: 0em 1em 0em 0em;
-@inlineLabelDistance: @labelDistance;
+@inlineLabelDistance: @relativeTiny;
 @inlineLabelColor: @labelColor;
 @inlineLabelFontSize: @labelFontSize;
 @inlineLabelFontWeight: @labelFontWeight;
 @inlineLabelTextTransform: @labelTextTransform;
 
-/* Sizes */
-@small: 0.875em;
-@medium: auto;
-@large: 1.125em;
-@huge: 1.2em;
+@groupedInlineLabelMargin: 0.035714em 1em 0em 0em;
 
 /*-------------------
        Groups

data/assets/stylesheets/semantic_ui/themes/default/collections/grid.variables

@@ -22,36 +22,12 @@
 @tableWidth: ~"calc(100% + "@gutterWidth~")";
 @columnMaxImageWidth: 100%;
 
+@consecutiveGridDistance: (@rowSpacing / 2);
+
 /*******************************
            Variations
 *******************************/
 
-/*--------------
-     Page
----------------*/
-
-/* Column Gutters */
-@mobileWidth: auto;
-@mobileMargin: 0em;
-@mobileGutter: 0em;
-
-@tabletWidth: auto;
-@tabletMargin: 0em;
-@tabletGutter: 4em;
-
-@computerWidth: auto;
-@computerMargin: 0em;
-@computerGutter: 8%;
-
-@largeMonitorWidth: auto;
-@largeMonitorMargin: 0em;
-@largeMonitorGutter: 15%;
-
-@widescreenMonitorWidth: auto;
-@widescreenMargin: 0em;
-@widescreenMonitorGutter: 23%;
-
-
 /*--------------
      Relaxed
 ---------------*/
@@ -77,8 +53,8 @@
 @celledWidth: 1px;
 @celledBorderColor: @solidBorderColor;
 
-@celledPadding: 0.75em;
-@celledRelaxedPadding: 1em;
+@celledPadding: 1em;
+@celledRelaxedPadding: 1.5em;
 @celledVeryRelaxedPadding: 2em;
 
 /*--------------
@@ -90,3 +66,33 @@
 @stackableMobileBorder: 1px solid @borderColor;
 @stackableInvertedMobileBorder: 1px solid @whiteBorderColor;
 
+
+/*******************************
+             Legacy
+*******************************/
+
+/*--------------
+     Page
+---------------*/
+
+/* Legacy (DO NOT USE)
+ */
+@mobileWidth: auto;
+@mobileMargin: 0em;
+@mobileGutter: 0em;
+
+@tabletWidth: auto;
+@tabletMargin: 0em;
+@tabletGutter: 2em;
+
+@computerWidth: auto;
+@computerMargin: 0em;
+@computerGutter: 3%;
+
+@largeMonitorWidth: auto;
+@largeMonitorMargin: 0em;
+@largeMonitorGutter: 15%;
+
+@widescreenMonitorWidth: auto;
+@widescreenMargin: 0em;
+@widescreenMonitorGutter: 23%;