less-rails-semantic_ui 1.12.3.0 → 2.0.0.0

data/assets/stylesheets/semantic_ui/definitions/elements/container.less

@@ -0,0 +1,135 @@
+/*
+ *= depend_on semantic_ui/theme.config
+ *= depend_on semantic_ui/config/globals/reset.overrides
+ *= depend_on semantic_ui/config/globals/reset.variables
+ *= depend_on semantic_ui/config/globals/site.overrides
+ *= depend_on semantic_ui/config/globals/site.variables
+ *= depend_on semantic_ui/config/elements/container.overrides
+ *= depend_on semantic_ui/config/elements/container.variables
+ */
+
+/*!
+ * # Semantic UI - Container
+ * http://github.com/semantic-org/semantic-ui/
+ *
+ *
+ * Copyright 2015 Contributors
+ * Released under the MIT license
+ * http://opensource.org/licenses/MIT
+ *
+ */
+
+/*******************************
+            Theme
+*******************************/
+
+@type    : 'element';
+@element : 'container';
+
+@import (multiple) 'semantic_ui/theme.config';
+
+& {
+
+/*******************************
+            Container
+*******************************/
+
+
+/* All Sizes */
+.ui.container {
+  display: block;
+  max-width: @maxWidth !important;
+}
+
+/* Mobile */
+@media only screen and (max-width: @largestMobileScreen) {
+  .ui.container {
+    width: @mobileWidth;
+    margin-left: @mobileGutter !important;
+    margin-right: @mobileGutter !important;
+  }
+  .ui.grid.container {
+    width: @mobileGridWidth !important;
+  }
+}
+
+/* Tablet */
+@media only screen and (min-width: @tabletBreakpoint) and (max-width: @largestTabletScreen) {
+  .ui.container {
+    width: @tabletWidth;
+    margin-left: @tabletGutter !important;
+    margin-right: @tabletGutter !important;
+  }
+  .ui.grid.container {
+    width: @tabletGridWidth !important;
+  }
+}
+
+/* Small Monitor */
+@media only screen and (min-width: @computerBreakpoint) and (max-width: @largestSmallMonitor) {
+  .ui.container {
+    width: @computerWidth;
+    margin-left: @computerGutter !important;
+    margin-right: @computerGutter !important;
+  }
+  .ui.grid.container {
+    width: @computerGridWidth !important;
+  }
+}
+
+/* Large Monitor */
+@media only screen and (min-width: @largeMonitorBreakpoint) {
+  .ui.container {
+    width: @largeMonitorWidth;
+    margin-left: @largeMonitorGutter !important;
+    margin-right: @largeMonitorGutter !important;
+  }
+  .ui.grid.container {
+    width: @largeMonitorGridWidth !important;
+  }
+}
+
+/*******************************
+             Types
+*******************************/
+
+
+/* Text Container */
+.ui.text.container {
+  font-family: @textFontFamily;
+  max-width: @textWidth !important;
+  line-height: @textLineHeight;
+}
+
+.ui.text.container {
+  font-size: @textSize;
+}
+
+/* Fluid */
+.ui.fluid.container {
+  width: 100%;
+}
+
+
+/*******************************
+           Variations
+*******************************/
+
+.ui[class*="left aligned"].container {
+  text-align: left;
+}
+.ui[class*="center aligned"].container {
+  text-align: center;
+}
+.ui[class*="right aligned"].container {
+  text-align: right;
+}
+.ui.justified.container {
+  text-align: justify;
+  hyphens: auto;
+}
+
+
+.loadUIOverrides();
+
+}

data/assets/stylesheets/semantic_ui/definitions/elements/divider.less

@@ -13,7 +13,7 @@
  * http://github.com/semantic-org/semantic-ui/
  *
  *
- * Copyright 2014 Contributors
+ * Copyright 2015 Contributors
  * Released under the MIT license
  * http://opensource.org/licenses/MIT
  *
@@ -71,7 +71,8 @@
 ---------------*/
 
 .ui.horizontal.divider {
-  position: relative;
+  display: table;
+  white-space: nowrap;
 
   height: auto;
   margin: @horizontalMargin;
@@ -82,24 +83,19 @@
 
 .ui.horizontal.divider:before,
 .ui.horizontal.divider:after {
-  position: absolute;
-  top: 50%;
   content: '';
-  z-index: 3;
-
-  width: 50%;
+  display: table-cell;
+  position: relative;
   top: 50%;
-  height: 0px;
-
-  border-top: @shadowWidth solid @shadowColor;
-  border-bottom: @highlightWidth solid @highlightColor;
+  width: 50%;
+  background-repeat: no-repeat;
 }
 
 .ui.horizontal.divider:before {
-  margin-left: @horizontalRulerOffset;
+  background-position: right @horizontalDividerMargin top 50%;
 }
 .ui.horizontal.divider:after {
-  margin-left: @horizontalDividerMargin;
+  background-position: left @horizontalDividerMargin top 50%;
 }
 
 /*--------------
@@ -146,42 +142,44 @@
 
 /* Inside grid */
 @media only screen and (max-width : (@tabletBreakpoint - 1px)) {
+
   .ui.stackable.grid .ui.vertical.divider,
   .ui.grid .stackable.row .ui.vertical.divider {
-    position: relative;
-    margin: @margin;
-    left: 50%;
+    display: table;
+    white-space: nowrap;
     height: auto;
+    margin: @horizontalMargin;
     overflow: hidden;
     line-height: 1;
     text-align: center;
+    position: static;
+    top: 0;
+    left: 0;
+    transform: none;
   }
 
   .ui.stackable.grid .ui.vertical.divider:before,
   .ui.grid .stackable.row .ui.vertical.divider:before,
   .ui.stackable.grid .ui.vertical.divider:after,
   .ui.grid .stackable.row .ui.vertical.divider:after {
-    position: absolute;
-    top: 50%;
-    left: auto;
+    position: static;
+    left: 0;
+    border-left: none;
     content: '';
-    z-index: 3;
-
-    width: 50%;
+    display: table-cell;
+    position: relative;
     top: 50%;
-    height: 0px;
-
-    border-top: @shadowWidth solid @shadowColor;
-    border-bottom: @highlightWidth solid @highlightColor;
+    width: 50%;
+    background-repeat: no-repeat;
   }
 
   .ui.stackable.grid .ui.vertical.divider:before,
   .ui.grid .stackable.row .ui.vertical.divider:before {
-    margin-left: -(50% + @horizontalDividerMargin);
+    background-position: right @horizontalDividerMargin top 50%;
   }
   .ui.stackable.grid .ui.vertical.divider:after,
   .ui.grid .stackable.row .ui.vertical.divider:after {
-    margin-left: @horizontalDividerMargin;
+    background-position: left @horizontalDividerMargin top 50%;
   }
 }
 
@@ -207,6 +205,10 @@
 .ui.hidden.divider {
   border-color: transparent !important;
 }
+.ui.hidden.divider:before,
+.ui.hidden.divider:after {
+  display: none;
+}
 
 /*--------------
     Inverted
@@ -221,9 +223,8 @@
 .ui.divider.inverted:after,
 .ui.divider.inverted:before {
   border-top-color: @invertedShadowColor !important;
-  border-bottom-color: @invertedHighlightColor !important;
-
   border-left-color: @invertedShadowColor !important;
+  border-bottom-color: @invertedHighlightColor !important;
   border-right-color: @invertedHighlightColor !important;
 }
 

data/assets/stylesheets/semantic_ui/definitions/elements/flag.less

@@ -13,7 +13,7 @@
  * http://github.com/semantic-org/semantic-ui/
  *
  *
- * Copyright 2014 Contributors
+ * Copyright 2015 Contributors
  * Released under the MIT license
  * http://opensource.org/licenses/MIT
  *

data/assets/stylesheets/semantic_ui/definitions/elements/header.less

@@ -13,7 +13,7 @@
  * http://github.com/semantic-org/semantic-ui/
  *
  *
- * Copyright 2014 Contributors
+ * Copyright 2015 Contributors
  * Released under the MIT license
  * http://opensource.org/licenses/MIT
  *
@@ -59,8 +59,8 @@
 
 .ui.header .sub.header {
   font-weight: normal;
-  margin: 0em;
   padding: 0em;
+  margin: @subHeaderMargin;
   font-size: @subHeaderFontSize;
   line-height: @subHeaderLineHeight;
   color: @subHeaderColor;
@@ -132,7 +132,7 @@
 
 .ui.header .ui.label {
   font-size: @labelSize;
-  margin: 0em 0em 0em @labelDistance;
+  margin-left: @labelDistance;
   vertical-align: @labelVerticalAlign;
 }
 
@@ -193,19 +193,19 @@ h5.ui.header .sub.header {
 
 .ui.huge.header {
   min-height: 1em;
-  font-size: @huge;
+  font-size: @hugeFontSize;
 }
 .ui.large.header {
-  font-size: @large;
+  font-size: @largeFontSize;
 }
 .ui.medium.header {
-  font-size: @medium;
+  font-size: @mediumFontSize;
 }
 .ui.small.header {
-  font-size: @small;
+  font-size: @smallFontSize;
 }
 .ui.tiny.header {
-  font-size: @tiny;
+  font-size: @tinyFontSize;
 }
 
 /* Sub Header */
@@ -225,6 +225,34 @@ h5.ui.header .sub.header {
   font-size: @tinySubHeaderFontSize;
 }
 
+/*--------------
+   Sub Heading
+---------------*/
+
+.ui.sub.header {
+  padding: 0em;
+  margin-bottom: @subHeadingDistance;
+  font-weight: @subHeadingFontWeight;
+  font-size: @subHeadingFontSize;
+  text-transform: @subHeadingTextTransform;
+  color: @subHeadingColor;
+}
+
+.ui.small.sub.header {
+  font-size: @smallSubHeadingSize;
+}
+.ui.sub.header {
+  font-size: @subHeadingFontSize;
+}
+.ui.large.sub.header {
+  font-size: @largeSubHeadingSize;
+}
+.ui.huge.sub.header {
+  font-size: @hugeSubHeadingSize;
+}
+
+
+
 /*-------------------
         Icon
 --------------------*/
@@ -250,6 +278,7 @@ h5.ui.header .sub.header {
   display: block;
   width: auto;
   height: auto;
+  line-height: 1;
   padding: 0em;
   font-size: @iconHeaderSize;
   margin: 0em auto @iconHeaderMargin;
@@ -286,133 +315,154 @@ h5.ui.header .sub.header {
            Variations
 *******************************/
 
-
 /*-------------------
-       Colors
+      Inverted
 --------------------*/
 
-.ui.black.header {
-  color: @black !important;
+.ui.inverted.header {
+  color: @invertedColor;
+}
+.ui.inverted.header .sub.header {
+  color: @invertedSubHeaderColor;
 }
-a.ui.black.header:hover {
-  color: @blackHover !important;
+.ui.inverted.attached.header {
+  background: @invertedAttachedBackground;
+  box-shadow: none;
+  border-color: transparent;
+}
+.ui.inverted.block.header {
+  background: @invertedBlockBackground;
+  box-shadow: none;
+}
+.ui.inverted.block.header {
+  border-bottom: none;
 }
 
-.ui.blue.header {
-  color: @blue !important;
+
+/*-------------------
+       Colors
+--------------------*/
+
+/*--- Red ---*/
+.ui.red.header {
+  color: @red !important;
 }
-a.ui.blue.header:hover {
-  color: @blueHover !important;
+a.ui.red.header:hover {
+  color: @redHover !important;
+}
+.ui.red.dividing.header {
+  border-bottom: @dividedColoredBorderWidth solid @red;
 }
 
-.ui.green.header {
-  color: @green !important;
+/* Inverted */
+.ui.inverted.red.header {
+  color: @lightRed !important;
 }
-a.ui.green.header:hover {
-  color: @greenHover !important;
+a.ui.inverted.red.header:hover {
+  color: @lightRedHover !important;
 }
 
+/*--- Orange ---*/
 .ui.orange.header {
   color: @orange !important;
 }
 a.ui.orange.header:hover {
   color: @orangeHover !important;
 }
-
-.ui.pink.header {
-  color: @pink !important;
-}
-a.ui.pink.header:hover {
-  color: @pinkHover !important;
+.ui.orange.dividing.header {
+  border-bottom: @dividedColoredBorderWidth solid @orange;
 }
-
-.ui.purple.header {
-  color: @purple !important;
+/* Inverted */
+.ui.inverted.orange.header {
+  color: @lightOrange !important;
 }
-a.ui.purple.header:hover {
-  color: @purpleHover !important;
+a.ui.inverted.orange.header:hover {
+  color: @lightOrangeHover !important;
 }
 
-.ui.red.header {
-  color: @red !important;
+/*--- Olive ---*/
+.ui.olive.header {
+  color: @olive !important;
 }
-a.ui.red.header:hover {
-  color: @redHover !important;
+a.ui.olive.header:hover {
+  color: @oliveHover !important;
 }
-
-.ui.teal.header {
-  color: @teal !important;
+.ui.olive.dividing.header {
+  border-bottom: @dividedColoredBorderWidth solid @olive;
 }
-a.ui.teal.header:hover {
-  color: @tealHover !important;
+/* Inverted */
+.ui.inverted.olive.header {
+  color: @lightOlive !important;
+}
+a.ui.inverted.olive.header:hover {
+  color: @lightOliveHover !important;
 }
 
+/*--- Yellow ---*/
 .ui.yellow.header {
   color: @yellow !important;
 }
 a.ui.yellow.header:hover {
   color: @yellowHover !important;
 }
-
-.ui.black.dividing.header {
-  border-bottom: @dividedColoredBorderWidth solid @blackDividedBorderColor;
-}
-.ui.blue.dividing.header {
-  border-bottom: @dividedColoredBorderWidth solid @blueDividedBorderColor;
+.ui.yellow.dividing.header {
+  border-bottom: @dividedColoredBorderWidth solid @yellow;
 }
-.ui.green.dividing.header {
-  border-bottom: @dividedColoredBorderWidth solid @greenDividedBorderColor;
+/* Inverted */
+.ui.inverted.yellow.header {
+  color: @lightYellow !important;
 }
-.ui.orange.dividing.header {
-  border-bottom: @dividedColoredBorderWidth solid @orangeDividedBorderColor;
+a.ui.inverted.yellow.header:hover {
+  color: @lightYellowHover !important;
 }
-.ui.pink.dividing.header {
-  border-bottom: @dividedColoredBorderWidth solid @pinkDividedBorderColor;
+
+/*--- Green ---*/
+.ui.green.header {
+  color: @green !important;
 }
-.ui.purple.dividing.header {
-  border-bottom: @dividedColoredBorderWidth solid @purpleDividedBorderColor;
+a.ui.green.header:hover {
+  color: @greenHover !important;
 }
-.ui.red.dividing.header {
-  border-bottom: @dividedColoredBorderWidth solid @redDividedBorderColor;
+.ui.green.dividing.header {
+  border-bottom: @dividedColoredBorderWidth solid @green;
 }
-.ui.teal.dividing.header {
-  border-bottom: @dividedColoredBorderWidth solid @tealDividedBorderColor;
+/* Inverted */
+.ui.inverted.green.header {
+  color: @lightGreen !important;
 }
-.ui.yellow.dividing.header {
-  border-bottom: @dividedColoredBorderWidth solid @yellowDividedBorderColor;
+a.ui.inverted.green.header:hover {
+  color: @lightGreenHover !important;
 }
 
-/*-------------------
-      Inverted
---------------------*/
-
-.ui.inverted.header {
-  color: @invertedColor;
+/*--- Teal ---*/
+.ui.teal.header {
+  color: @teal !important;
 }
-.ui.inverted.header .sub.header {
-  color: @invertedSubHeaderColor;
+a.ui.teal.header:hover {
+  color: @tealHover !important;
 }
-.ui.inverted.attached.header {
-  background: @invertedAttachedBackground;
-  box-shadow: none;
+.ui.teal.dividing.header {
+  border-bottom: @dividedColoredBorderWidth solid @teal;
 }
-.ui.inverted.block.header {
-  background: @invertedBlockBackground;
-  box-shadow: none;
+/* Inverted */
+.ui.inverted.teal.header {
+  color: @lightTeal !important;
+}
+a.ui.inverted.teal.header:hover {
+  color: @lightTealHover !important;
 }
 
-
-/*-------------------
-   Inverted Colors
---------------------*/
-
-.ui.inverted.black.header {
-  color: @darkGrey !important;
+/*--- Blue ---*/
+.ui.blue.header {
+  color: @blue !important;
+}
+a.ui.blue.header:hover {
+  color: @blueHover !important;
 }
-a.ui.inverted.black.header:hover {
-  color: @darkGreyHover !important;
+.ui.blue.dividing.header {
+  border-bottom: @dividedColoredBorderWidth solid @blue;
 }
-
+/* Inverted */
 .ui.inverted.blue.header {
   color: @lightBlue !important;
 }
@@ -420,27 +470,35 @@ a.ui.inverted.blue.header:hover {
   color: @lightBlueHover !important;
 }
 
-.ui.inverted.green.header {
-  color: @lightGreen !important;
+/*--- Violet ---*/
+.ui.violet.header {
+  color: @violet !important;
 }
-a.ui.inverted.green.header:hover {
-  color: @lightGreenHover !important;
+a.ui.violet.header:hover {
+  color: @violetHover !important;
 }
-
-.ui.inverted.orange.header {
-  color: @lightOrange !important;
+.ui.violet.dividing.header {
+  border-bottom: @dividedColoredBorderWidth solid @violet;
 }
-a.ui.inverted.orange.header:hover {
-  color: @lightOrangeHover !important;
+/* Inverted */
+.ui.inverted.violet.header {
+  color: @lightViolet !important;
+}
+a.ui.inverted.violet.header:hover {
+  color: @lightVioletHover !important;
 }
 
-.ui.inverted.pink.header {
-  color: @lightPink !important;
+/*--- Purple ---*/
+.ui.purple.header {
+  color: @purple !important;
 }
-a.ui.inverted.pink.header:hover {
-  color: @lightPinkHover !important;
+a.ui.purple.header:hover {
+  color: @purpleHover !important;
 }
-
+.ui.purple.dividing.header {
+  border-bottom: @dividedColoredBorderWidth solid @purple;
+}
+/* Inverted */
 .ui.inverted.purple.header {
   color: @lightPurple !important;
 }
@@ -448,30 +506,60 @@ a.ui.inverted.purple.header:hover {
   color: @lightPurpleHover !important;
 }
 
-.ui.inverted.red.header {
-  color: @lightRed !important;
+/*--- Pink ---*/
+.ui.pink.header {
+  color: @pink !important;
 }
-a.ui.inverted.red.header:hover {
-  color: @lightRedHover !important;
+a.ui.pink.header:hover {
+  color: @pinkHover !important;
 }
-
-.ui.inverted.teal.header {
-  color: @lightTeal !important;
+.ui.pink.dividing.header {
+  border-bottom: @dividedColoredBorderWidth solid @pink;
 }
-a.ui.inverted.teal.header:hover {
-  color: @lightTealHover !important;
+/* Inverted */
+.ui.inverted.pink.header {
+  color: @lightPink !important;
+}
+a.ui.inverted.pink.header:hover {
+  color: @lightPinkHover !important;
 }
 
-.ui.inverted.yellow.header {
-  color: @lightYellow !important;
+/*--- Brown ---*/
+.ui.brown.header {
+  color: @brown !important;
 }
-a.ui.inverted.yellow.header:hover {
-  color: @lightYellowHover !important;
+a.ui.brown.header:hover {
+  color: @brownHover !important;
+}
+.ui.brown.dividing.header {
+  border-bottom: @dividedColoredBorderWidth solid @brown;
+}
+/* Inverted */
+.ui.inverted.brown.header {
+  color: @lightBrown !important;
+}
+a.ui.inverted.brown.header:hover {
+  color: @lightBrownHover !important;
 }
 
-.ui.inverted.block.header {
-  border-bottom: none;
+/*--- Grey ---*/
+.ui.grey.header {
+  color: @grey !important;
+}
+a.ui.grey.header:hover {
+  color: @greyHover !important;
+}
+.ui.grey.dividing.header {
+  border-bottom: @dividedColoredBorderWidth solid @grey;
 }
+/* Inverted */
+.ui.inverted.grey.header {
+  color: @lightGrey !important;
+}
+a.ui.inverted.grey.header:hover {
+  color: @lightGreyHover !important;
+}
+
 
 /*-------------------
        Aligned
@@ -605,19 +693,19 @@ a.ui.inverted.yellow.header:hover {
 
 /* Attached Sizes */
 .ui.tiny.attached.header {
-  font-size: @tinyAttached;
+  font-size: @tinyAttachedSize;
 }
 .ui.small.attached.header {
-  font-size: @smallAttached;
+  font-size: @smallAttachedSize;
 }
 .ui.attached.header:not(h1):not(h2):not(h3):not(h4):not(h5):not(h6) {
-  font-size: @mediumAttached;
+  font-size: @mediumAttachedSize;
 }
 .ui.large.attached.header {
-  font-size: @largeAttached;
+  font-size: @largeAttachedSize;
 }
 .ui.huge.attached.header {
-  font-size: @hugeAttached;
+  font-size: @hugeAttachedSize;
 }
 
 /*-------------------
@@ -625,7 +713,7 @@ a.ui.inverted.yellow.header:hover {
 --------------------*/
 
 .ui.header:not(h1):not(h2):not(h3):not(h4):not(h5):not(h6) {
-  font-size: @medium;
+  font-size: @mediumFontSize;
 }
 
 .loadUIOverrides();