less-rails-semantic_ui 1.12.3.0 → 2.0.0.0

data/assets/stylesheets/semantic_ui/definitions/elements/step.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
  *
@@ -33,25 +33,77 @@
 
 @import (multiple) 'semantic_ui/theme.config';
 
+/*******************************
+            Plural
+*******************************/
+
+.ui.steps {
+  display: inline-flex;
+  flex-direction: row;
+  align-items: stretch;
+  margin: @stepMargin;
+  background: @stepsBackground;
+  box-shadow: @stepsBoxShadow;
+  line-height: @lineHeight;
+  border-radius: @stepsBorderRadius;
+  border: @stepsBorder;
+}
+
+.ui.steps:first-child {
+  margin-top: 0em;
+}
+.ui.steps:last-child {
+  margin-bottom: 0em;
+}
+
+.ui.steps .step:first-child {
+  padding-left: @horizontalPadding;
+  border-radius: @stepsBorderRadius 0em 0em @stepsBorderRadius;
+}
+.ui.steps .step:last-child {
+  border-radius: 0em @stepsBorderRadius @stepsBorderRadius 0em;
+}
+.ui.steps .step:only-child {
+  -webkit-border-radius: @stepsBorderRadius;
+  -moz-border-radius: @stepsBorderRadius;
+  border-radius: @stepsBorderRadius;
+}
+
+.ui.steps .step:last-child {
+  border-right: none;
+  margin-right: 0em;
+}
+.ui.steps .step:last-child:after {
+  display: @lastArrowDisplay;
+}
+
 /*******************************
            Singular
 *******************************/
 
 .ui.steps .step {
   position: relative;
-  display: table-cell;
+  display: flex;
+  flex: 1 0 auto;
+  flex-wrap: wrap;
+  flex-direction: row;
   vertical-align: middle;
+  align-items: center;
+  justify-content: @justifyContent;
 
   margin: @verticalMargin @horizontalMargin;
-  padding: @verticalPadding @horizontalPadding @verticalPadding @leftPadding;
+  padding: @verticalPadding @horizontalPadding;
   background: @background;
   color: @textColor;
   box-shadow: @boxShadow;
   border-radius: @borderRadius;
+  border: @border;
+  border-right: @divider;
 }
 
 
 .ui.steps .step:after {
+  display: none;
   position: absolute;
   z-index: 2;
   content: '';
@@ -61,8 +113,11 @@
   background-color: @arrowBackgroundColor;
   width: @arrowSize;
   height: @arrowSize;
-  border-bottom: 1px solid @arrowBorderColor;
-  border-right: 1px solid @arrowBorderColor;
+
+  border-style: solid;
+  border-color: @borderColor;
+  border-width: @arrowBorderWidth;
+
   transform: translateY(-50%) translateX(50%) rotate(-45deg);
 }
 
@@ -71,42 +126,6 @@
   transition: @transition;
 }
 
-/*******************************
-            Plural
-*******************************/
-
-.ui.steps {
-  display: table;
-  table-layout: fixed;
-  background: @stepsBackground;
-  box-shadow: @stepsBoxShadow;
-
-  line-height: @lineHeight;
-  box-sizing: border-box;
-  border-radius: @stepsBorderRadius;
-}
-
-.ui.steps .step:first-child {
-  padding-left: @horizontalPadding;
-  border-radius: @stepsBorderRadius 0em 0em @stepsBorderRadius;
-}
-.ui.steps .step:last-child {
-  border-radius: 0em @stepsBorderRadius @stepsBorderRadius 0em;
-}
-.ui.steps .step:only-child {
-  -webkit-border-radius: @stepsBorderRadius;
-  -moz-border-radius: @stepsBorderRadius;
-  border-radius: @stepsBorderRadius;
-}
-
-.ui.steps .step:last-child {
-  margin-right: 0em;
-}
-.ui.steps .step:last-child:after {
-  display: none;
-}
-
-
 /*******************************
             Content
 *******************************/
@@ -117,6 +136,9 @@
   font-size: @titleFontSize;
   font-weight: @titleFontWeight;
 }
+.ui.steps .step > .title {
+  width: 100%;
+}
 
 /* Description */
 .ui.steps .step .description {
@@ -124,20 +146,32 @@
   font-size: @descriptionFontSize;
   color: @descriptionColor;
 }
+.ui.steps .step > .description {
+  width: 100%;
+}
 .ui.steps .step .title ~ .description {
   margin-top: @descriptionDistance;
 }
 
 /* Icon */
+.ui.steps .step > .icon {
+  line-height: 1;
+  font-size: @iconSize;
+  margin: 0em @iconDistance 0em 0em;
+}
 .ui.steps .step > .icon,
 .ui.steps .step > .icon ~ .content {
-  display: table-cell;
-  vertical-align: @iconVerticalAlign;
+  display: block;
+  flex: 0 1 auto;
+  align-self: @iconAlign;
 }
-.ui.steps .step > .icon {
-  font-size: @iconSize;
-  margin: 0em;
-  padding-right: @iconDistance;
+.ui.steps .step > .icon ~ .content {
+  flex-grow: 1 0 auto;
+}
+
+/* Horizontal Icon */
+.ui.steps:not(.vertical) .step > .icon {
+  width: auto;
 }
 
 /* Link */
@@ -158,19 +192,21 @@
   counter-reset: ordered;
 }
 .ui.ordered.steps .step:before {
-  display: table-cell;
+  display: block;
   position: static;
   text-align: center;
   content: counters(ordered, ".");
-  vertical-align: @iconVerticalAlign;
-  padding-right: @iconDistance;
+  align-self: @iconAlign;
+  margin-right: @iconDistance;
   font-size: @iconSize;
   counter-increment: ordered;
+  font-family: @orderedFontFamily;
+  font-weight: @orderedFontWeight;
 }
 
 .ui.ordered.steps .step > * {
-  display: table-cell;
-  vertical-align: @iconVerticalAlign;
+  display: block;
+  align-self: @iconAlign;
 }
 
 
@@ -179,19 +215,22 @@
 ---------------*/
 
 .ui.vertical.steps {
-  display: inline-block;
+  display: inline-flex;
+  flex-direction: column;
   overflow: visible;
 }
 .ui.vertical.steps .step {
-  display: block;
+  justify-content: flex-start;
   border-radius: @borderRadius;
   padding: @verticalPadding @horizontalPadding;
+  border-bottom: @verticalDivider;
 }
 .ui.vertical.steps .step:first-child {
   padding: @verticalPadding @horizontalPadding;
   border-radius: @stepsBorderRadius @stepsBorderRadius 0em 0em;
 }
 .ui.vertical.steps .step:last-child {
+  border-bottom: none;
   border-radius: 0em 0em @stepsBorderRadius @stepsBorderRadius;
 }
 
@@ -199,10 +238,20 @@
 .ui.vertical.steps .step:after {
   display: none;
 }
+.ui.vertical.steps .step:after {
+  top: @verticalArrowTopOffset;
+  right: @verticalArrowRightOffset;
+  border-width: @verticalArrowBorderWidth;
+}
 
-/* Active Arrow */
+.ui.vertical.steps .step:after {
+  display: @verticalArrowDisplay;
+}
 .ui.vertical.steps .active.step:after {
-  display: block;
+  display: @verticalActiveArrowDisplay;
+}
+.ui.vertical.steps .step:last-child:after {
+  display: @verticalLastArrowDisplay;
 }
 
 
@@ -214,10 +263,13 @@
 @media only screen and (max-width: (@largestMobileScreen)) {
 
 .ui.steps {
+  display: inline-flex;
   overflow: visible;
+  flex-direction: column;
 }
 .ui.steps .step {
-  display: block;
+  width: 100% !important;
+  flex-direction: column;
   border-radius: @borderRadius;
   padding: @verticalPadding @horizontalPadding;
 }
@@ -231,7 +283,18 @@
 
 /* Arrow */
 .ui.steps .step:after {
-  display: none;
+  display: none !important;
+}
+
+/* Content */
+.ui.steps .step .content {
+  text-align: center;
+}
+
+/* Icon */
+.ui.steps .step > .icon,
+.ui.ordered.steps .step:before {
+  margin: 0em 0em @mobileIconDistance 0em;
 }
 
 }
@@ -274,6 +337,15 @@
   color: @activeIconColor;
 }
 
+/* Active Arrow */
+.ui.steps .step:after {
+  display: @arrowDisplay;
+}
+.ui.steps .active.step:after {
+  display: @activeArrowDisplay;
+}
+
+
 /* Active Hover */
 .ui.steps .link.active.step:hover::after,
 .ui.steps .link.active.step:hover,
@@ -315,15 +387,18 @@
    Stackable
 ---------------*/
 
-
 /* Tablet Or Below */
-@media only screen and (min-width: @computerBreakpoint) {
+@media only screen and (max-width: @computerBreakpoint) {
 
 .ui[class*="tablet stackable"].steps {
+  display: inline-flex;
   overflow: visible;
+  flex-direction: column;
 }
+
+/* Steps */
 .ui[class*="tablet stackable"].steps .step {
-  display: block;
+  flex-direction: column;
   border-radius: @borderRadius;
   padding: @verticalPadding @horizontalPadding;
 }
@@ -334,13 +409,24 @@
 .ui[class*="tablet stackable"].steps .step:last-child {
   border-radius: 0em 0em @stepsBorderRadius @stepsBorderRadius;
 }
+
 /* Arrow */
 .ui[class*="tablet stackable"].steps .step:after {
-  display: none;
+  display: none !important;
 }
 
+/* Content */
+.ui[class*="tablet stackable"].steps .step .content {
+  text-align: center;
 }
 
+/* Icon */
+.ui[class*="tablet stackable"].steps .step > .icon,
+.ui[class*="tablet stackable"].ordered.steps .step:before {
+  margin: 0em 0em @mobileIconDistance 0em;
+}
+
+}
 
 /*--------------
       Fluid
@@ -348,6 +434,7 @@
 
 /* Fluid */
 .ui.fluid.steps {
+  display: flex;
   width: 100%;
 }
 
@@ -356,26 +443,28 @@
 ---------------*/
 
 /* Top */
-.attached.ui.steps {
-  margin: @attachedTopMargin;
+.ui.attached.steps {
+  width: @attachedWidth !important;
+  margin: 0em @attachedHorizontalOffset @attachedVerticalOffset;
+  max-width: @attachedWidth;
   border-radius: @stepsBorderRadius @stepsBorderRadius 0em 0em;
 }
-.attached.ui.steps .step:first-child {
+.ui.attached.steps .step:first-child {
   border-radius: @stepsBorderRadius 0em 0em 0em;
 }
-.attached.ui.steps .step:last-child {
+.ui.attached.steps .step:last-child {
   border-radius: 0em @stepsBorderRadius 0em 0em;
 }
 
 /* Bottom */
-.bottom.attached.ui.steps {
-  margin: @attachedBottomMargin;
+.ui.bottom.attached.steps {
+  margin: @attachedVerticalOffset @attachedHorizontalOffset 0em;
   border-radius: 0em 0em @stepsBorderRadius @stepsBorderRadius;
 }
-.bottom.attached.ui.steps .step:first-child {
+.ui.bottom.attached.steps .step:first-child {
   border-radius: 0em 0em 0em @stepsBorderRadius;
 }
-.bottom.attached.ui.steps .step:last-child {
+.ui.bottom.attached.steps .step:last-child {
   border-radius: 0em 0em @stepsBorderRadius 0em;
 }
 
@@ -393,6 +482,16 @@
 .ui.eight.steps {
   width: 100%;
 }
+.ui.one.steps > .step,
+.ui.two.steps > .step,
+.ui.three.steps > .step,
+.ui.four.steps > .step,
+.ui.five.steps > .step,
+.ui.six.steps > .step,
+.ui.seven.steps > .step,
+.ui.eight.steps > .step {
+  flex-wrap: nowrap;
+}
 .ui.one.steps > .step {
   width: 100%;
 }

data/assets/stylesheets/semantic_ui/definitions/globals/reset.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/globals/site.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
  *
@@ -47,6 +47,7 @@ html {
 body {
   margin: 0px;
   padding: 0px;
+  overflow-x: @pageOverflowX;
   min-width: @pageMinWidth;
   background: @pageBackground;
   font-family: @pageFont;
@@ -131,6 +132,7 @@ a {
 }
 a:hover {
   color: @linkHoverColor;
+  text-decoration: @linkHoverUnderline;
 }
 
 /*******************************