rbbt-rest 1.6.13 → 1.6.14

data/share/views/public/plugins/semantic-ui/src/definitions/elements/step.less

@@ -1,41 +1,99 @@
-/*
- * # Semantic - Steps
- * http://github.com/jlukic/semantic-ui/
+/*!
+ * # Semantic UI - Step
+ * http://github.com/semantic-org/semantic-ui/
  *
  *
- * Copyright 2014 Contributor
+ * Copyright 2015 Contributors
  * Released under the MIT license
  * http://opensource.org/licenses/MIT
  *
  */
 
+
 /*******************************
-            Theme
+             Step
 *******************************/
 
+/*--------------
+   Load Theme
+---------------*/
+
 @type    : 'element';
 @element : 'step';
 
-@import '../../theme.config';
+@import (multiple) '../../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;
+}
 
 /*******************************
-            Step
+           Singular
 *******************************/
 
 .ui.steps .step {
-  display: inline-block;
   position: relative;
+  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;
-  vertical-align: top;
+  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: '';
@@ -45,8 +103,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);
 }
 
@@ -55,7 +116,6 @@
   transition: @transition;
 }
 
-
 /*******************************
             Content
 *******************************/
@@ -66,6 +126,9 @@
   font-size: @titleFontSize;
   font-weight: @titleFontWeight;
 }
+.ui.steps .step > .title {
+  width: 100%;
+}
 
 /* Description */
 .ui.steps .step .description {
@@ -73,20 +136,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 */
@@ -107,17 +182,21 @@
   counter-reset: ordered;
 }
 .ui.ordered.steps .step:before {
-  display: table-cell;
+  display: block;
   position: static;
-  padding-right: @iconDistance;
+  text-align: center;
+  content: counters(ordered, ".");
+  align-self: @iconAlign;
+  margin-right: @iconDistance;
   font-size: @iconSize;
   counter-increment: ordered;
-  content: counters(ordered, ".");
+  font-family: @orderedFontFamily;
+  font-weight: @orderedFontWeight;
 }
 
 .ui.ordered.steps .step > * {
-  display: table-cell;
-  vertical-align: @iconVerticalAlign;
+  display: block;
+  align-self: @iconAlign;
 }
 
 
@@ -126,18 +205,22 @@
 ---------------*/
 
 .ui.vertical.steps {
+  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;
 }
 
@@ -145,49 +228,66 @@
 .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;
 }
 
 
-/*******************************
-            Group
-*******************************/
+/*---------------
+    Responsive
+----------------*/
 
-.ui.steps {
-  display: inline-block;
-  font-size: 0em;
+/* Mobile (Default) */
+@media only screen and (max-width: (@largestMobileScreen)) {
 
-  background: @stepsBackground;
-  box-shadow: @stepsBoxShadow;
-
-  line-height: @lineHeight;
-  box-sizing: border-box;
-  border-radius: @stepsBorderRadius;
+.ui.steps {
+  display: inline-flex;
+  overflow: visible;
+  flex-direction: column;
+}
+.ui.steps .step {
+  width: 100% !important;
+  flex-direction: column;
+  border-radius: @borderRadius;
+  padding: @verticalPadding @horizontalPadding;
 }
-
 .ui.steps .step:first-child {
-  padding-left: @horizontalPadding;
-  border-radius: @stepsBorderRadius 0em 0em @stepsBorderRadius;
+  padding: @verticalPadding @horizontalPadding;
+  border-radius: @stepsBorderRadius @stepsBorderRadius 0em 0em;
 }
 .ui.steps .step:last-child {
-  border-radius: 0em @stepsBorderRadius @stepsBorderRadius 0em;
+  border-radius: 0em 0em @stepsBorderRadius @stepsBorderRadius;
 }
-.ui.steps .step:only-child {
-  -webkit-border-radius: @stepsBorderRadius;
-  -moz-border-radius: @stepsBorderRadius;
-  border-radius: @stepsBorderRadius;
+
+/* Arrow */
+.ui.steps .step:after {
+  display: none !important;
 }
 
-.ui.steps .step:last-child {
-  margin-right: 0em;
+/* Content */
+.ui.steps .step .content {
+  text-align: center;
 }
-.ui.steps .step:last-child:after {
-  display: none;
+
+/* Icon */
+.ui.steps .step > .icon,
+.ui.ordered.steps .step:before {
+  margin: 0em 0em @mobileIconDistance 0em;
 }
 
+}
 
 /*******************************
              States
@@ -227,6 +327,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,
@@ -263,38 +372,96 @@
            Variations
 *******************************/
 
+
+/*--------------
+   Stackable
+---------------*/
+
+/* Tablet Or Below */
+@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 {
+  flex-direction: column;
+  border-radius: @borderRadius;
+  padding: @verticalPadding @horizontalPadding;
+}
+.ui[class*="tablet stackable"].steps .step:first-child {
+  padding: @verticalPadding @horizontalPadding;
+  border-radius: @stepsBorderRadius @stepsBorderRadius 0em 0em;
+}
+.ui[class*="tablet stackable"].steps .step:last-child {
+  border-radius: 0em 0em @stepsBorderRadius @stepsBorderRadius;
+}
+
+/* Arrow */
+.ui[class*="tablet stackable"].steps .step:after {
+  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
+---------------*/
+
 /* Fluid */
 .ui.fluid.steps {
+  display: flex;
   width: 100%;
 }
 
+/*--------------
+    Attached
+---------------*/
 
-/* Attached */
-.attached.ui.steps {
-  margin: 0em;
+/* Top */
+.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 Side */
-.bottom.attached.ui.steps {
-  margin-top: -1px;
+/* Bottom */
+.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;
 }
 
+/*-------------------
+    Evenly Divided
+--------------------*/
 
-/* Evenly divided  */
 .ui.one.steps,
 .ui.two.steps,
 .ui.three.steps,
@@ -303,7 +470,17 @@
 .ui.six.steps,
 .ui.seven.steps,
 .ui.eight.steps {
-  display: block;
+  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%;
@@ -330,12 +507,11 @@
   width: 12.500%;
 }
 
+/*-------------------
+       Sizes
+--------------------*/
 
 
-/*******************************
-             Sizes
-*******************************/
-
 .ui.small.step,
 .ui.small.steps .step {
   font-size: @small;