less-rails-semantic_ui 1.2.0.0 → 1.3.1.0

data/assets/stylesheets/semantic_ui/definitions/collections/table.less

@@ -76,14 +76,18 @@
   border-bottom: @headerBorder;
   border-left: @headerDivider;
 }
-.ui.table thead th:first-child {
-  border-radius: @borderRadius 0em 0em 0em;
+
+.ui.table thead tr > th:first-child {
   border-left: none;
 }
-.ui.table thead th:last-child {
+
+.ui.table thead tr:first-child > th:first-child {
+  border-radius: @borderRadius 0em 0em 0em;
+}
+.ui.table thead tr:first-child > th:last-child {
   border-radius: 0em @borderRadius 0em 0em;
 }
-.ui.table thead th:only-child {
+.ui.table thead tr:first-child > th:only-child {
   border-radius: @borderRadius @borderRadius 0em 0em;
 }
 
@@ -103,13 +107,16 @@
   font-weight: @footerFontWeight;
   text-transform: @footerTextTransform;
 }
-.ui.table tfoot th:first-child {
+.ui.table tfoot tr > th:first-child {
+  border-left: none;
+}
+.ui.table tfoot tr:first-child > th:first-child {
   border-radius: 0em 0em 0em @borderRadius;
 }
-.ui.table tfoot th:last-child {
+.ui.table tfoot tr:first-child > th:last-child {
   border-radius: 0em 0em @borderRadius 0em;
 }
-.ui.table tfoot th:only-child {
+.ui.table tfoot tr:first-child > th:only-child {
   border-radius: 0em 0em @borderRadius @borderRadius;
 }
 
@@ -149,52 +156,64 @@
 
 
 /* Responsive */
-@media only screen and (max-width : 768px) {
-  .ui.table {
-    display: block;
+@media only screen and (max-width : @largestMobileScreen) {
+  .ui.table:not(.unstackable),
+  .ui.table:not(.unstackable) tbody,
+  .ui.table:not(.unstackable) tr,
+  .ui.table:not(.unstackable) tr > th,
+  .ui.table:not(.unstackable) tr > td  {
+    display: block !important;
+    width: 100% !important;
+    display: block !important;
+  }
+
+  .ui.table:not(.unstackable) {
     padding: 0em;
   }
-  .ui.table thead {
+  .ui.table:not(.unstackable) thead {
     display: @responsiveHeaderDisplay;
   }
-  .ui.table tfoot {
+  .ui.table:not(.unstackable) tfoot {
     display: @responsiveFooterDisplay;
   }
-  .ui.table tbody {
-    display: block;
-  }
-  .ui.table tr {
-    display: block;
-  }
-
-  .ui.table tr > th,
-  .ui.table tr > td {
+  .ui.table:not(.unstackable) tr > th,
+  .ui.table:not(.unstackable) tr > td {
     background: none;
-    width: 100% !important;
-    display: block;
     border: none !important;
     padding: @responsiveCellVerticalPadding @responsiveCellHorizontalPadding;
     box-shadow: @responsiveCellBoxShadow;
   }
-  .ui.table th:first-child,
-  .ui.table td:first-child {
+  .ui.table:not(.unstackable) th:first-child,
+  .ui.table:not(.unstackable) td:first-child {
     font-weight: bold;
     padding-top: @responsiveRowVerticalPadding;
   }
-  .ui.table th:last-child,
-  .ui.table td:last-child {
+  .ui.table:not(.unstackable) th:last-child,
+  .ui.table:not(.unstackable) td:last-child {
     box-shadow: @responsiveRowBoxShadow;
     padding-bottom: @responsiveRowVerticalPadding;
   }
 
   /* Clear BG Colors */
-  .ui.table tr > td.warning,
-  .ui.table tr > td.error,
-  .ui.table tr > td.active,
-  .ui.table tr > td.positive,
-  .ui.table tr > td.negative {
+  .ui.table:not(.unstackable) tr > td.warning,
+  .ui.table:not(.unstackable) tr > td.error,
+  .ui.table:not(.unstackable) tr > td.active,
+  .ui.table:not(.unstackable) tr > td.positive,
+  .ui.table:not(.unstackable) tr > td.negative {
     background-color: @responsiveStatusColor !important;
   }
+
+  /* Definition Table */
+  .ui.definition.table:not(.unstackable) thead th:first-child {
+    box-shadow: none !important;
+  }
+  .ui.definition.table:not(.unstackable) tr td:first-child {
+    padding-bottom: @responsiveRowVerticalPadding;
+  }
+  .ui.definition.table:not(.unstackable) tr td:nth-child(n+2) {
+    padding-top: @responsiveRowVerticalPadding;
+  }
+
 }
 
 
@@ -202,6 +221,31 @@
              Types
 *******************************/
 
+/*--------------
+    Complex
+---------------*/
+
+.ui.structured.table {
+  border-collapse: collapse;
+}
+.ui.structured.table thead th {
+  border-left: @headerDivider;
+  border-right: @headerDivider;
+}
+.ui.structured.sortable.table thead th {
+  border-left: @sortableBorder;
+  border-right: @sortableBorder;
+}
+.ui.structured.basic.table th {
+  border-left: @basicTableHeaderDivider;
+  border-right: @basicTableHeaderDivider;
+}
+.ui.structured.celled.table tr th,
+.ui.structured.celled.table tr td {
+  border-left: @cellBorder;
+  border-right: @cellBorder;
+}
+
 /*--------------
    Definition
 ---------------*/
@@ -365,6 +409,71 @@
           Variations
 *******************************/
 
+/*--------------
+    Stackable
+---------------*/
+
+@media only screen and (max-width : @largestTabletScreen) {
+
+  .ui[class*="tablet stackable"].table,
+  .ui[class*="tablet stackable"].table tbody,
+  .ui[class*="tablet stackable"].table tr,
+  .ui[class*="tablet stackable"].table tr > th,
+  .ui[class*="tablet stackable"].table tr > td  {
+    display: block !important;
+    width: 100% !important;
+    display: block !important;
+  }
+
+  .ui[class*="tablet stackable"].table {
+    padding: 0em;
+  }
+  .ui[class*="tablet stackable"].table thead {
+    display: @responsiveHeaderDisplay;
+  }
+  .ui[class*="tablet stackable"].table tfoot {
+    display: @responsiveFooterDisplay;
+  }
+  .ui[class*="tablet stackable"].table tr > th,
+  .ui[class*="tablet stackable"].table tr > td {
+    background: none;
+    border: none !important;
+    padding: @responsiveCellVerticalPadding @responsiveCellHorizontalPadding;
+    box-shadow: @responsiveCellBoxShadow;
+  }
+  .ui[class*="tablet stackable"].table th:first-child,
+  .ui[class*="tablet stackable"].table td:first-child {
+    font-weight: bold;
+    padding-top: @responsiveRowVerticalPadding;
+  }
+  .ui[class*="tablet stackable"].table th:last-child,
+  .ui[class*="tablet stackable"].table td:last-child {
+    box-shadow: @responsiveRowBoxShadow;
+    padding-bottom: @responsiveRowVerticalPadding;
+  }
+
+  /* Clear BG Colors */
+  .ui[class*="tablet stackable"].table tr > td.warning,
+  .ui[class*="tablet stackable"].table tr > td.error,
+  .ui[class*="tablet stackable"].table tr > td.active,
+  .ui[class*="tablet stackable"].table tr > td.positive,
+  .ui[class*="tablet stackable"].table tr > td.negative {
+    background-color: @responsiveStatusColor !important;
+  }
+
+  /* Definition Table */
+  .ui.definition[class*="tablet stackable"].table thead th:first-child {
+    box-shadow: none !important;
+  }
+  .ui.definition[class*="tablet stackable"].table tr td:first-child {
+    padding-bottom: @responsiveRowVerticalPadding;
+  }
+  .ui.definition[class*="tablet stackable"].table tr td:nth-child(n+2) {
+    padding-top: @responsiveRowVerticalPadding;
+  }
+
+}
+
 /*--------------
      Aligned
 ---------------*/
@@ -709,6 +818,7 @@
 }
 .ui.inverted.sortable.table thead th {
   border-left-color: @sortableInvertedBorderColor;
+  border-right-color: @sortableInvertedBorderColor;
 }
 
 
@@ -792,23 +902,28 @@
 .ui[class*="very basic"].table:not(.sortable):not(.striped) td {
   padding: @basicTableCellVerticalPadding @basicTableCellHorizontalPadding;
 }
-.ui[class*="very basic"].table:not(.sortable):not(.striped) thead th {
-  padding-top: 0em;
+.ui[class*="very basic"].table:not(.sortable):not(.striped) th:first-child,
+.ui[class*="very basic"].table:not(.sortable):not(.striped) td:first-child {
+  padding-left: 0em;
 }
-.ui[class*="very basic"].table:not(.sortable):not(.striped) tbody tr:last-child td {
-  padding-bottom: 0em;
+.ui[class*="very basic"].table:not(.sortable):not(.striped) th:last-child,
+.ui[class*="very basic"].table:not(.sortable):not(.striped) td:last-child {
+  padding-right: 0em;
+}
+.ui[class*="very basic"].table:not(.sortable):not(.striped) thead tr:first-child th {
+  padding-top: 0em;
 }
 
 /*--------------
      Celled
 ---------------*/
 
-.ui.celled.table th,
-.ui.celled.table td {
+.ui.celled.table tr th,
+.ui.celled.table tr td {
   border-left: @cellBorder;
 }
-.ui.celled.table th:first-child,
-.ui.celled.table td:first-child {
+.ui.celled.table tr th:first-child,
+.ui.celled.table tr td:first-child {
   border-left: none;
 }
 

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

@@ -885,6 +885,9 @@
 }
 .ui.buttons .or:before {
   position: absolute;
+  text-align: center;
+  border-radius: @circularRadius;
+
   content: @orText;
   top: 50%;
   left: 50%;
@@ -902,9 +905,7 @@
 
   font-style: @orTextStyle;
   font-weight: @orTextWeight;
-  text-align: center;
 
-  border-radius: 500em;
   box-shadow: @orBoxShadow;
 }
 .ui.buttons .or[data-text]:before {

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

@@ -35,16 +35,19 @@
   max-width: 100%;
   background-color: @placeholderColor;
 }
+
 img.ui.image {
   display: block;
-  background: none;
 }
+
+.ui.image svg,
 .ui.image img {
   display: block;
   max-width: 100%;
   height: auto;
 }
 
+
 /*******************************
             States
 *******************************/
@@ -66,6 +69,7 @@ img.ui.image {
 ---------------*/
 
 .ui.inline.image,
+.ui.inline.image svg,
 .ui.inline.image img {
   display: inline-block;
 }
@@ -76,18 +80,21 @@ img.ui.image {
 
 .ui.top.aligned.images .image,
 .ui.top.aligned.image,
+.ui.top.aligned.image svg,
 .ui.top.aligned.image img {
   display: inline-block;
   vertical-align: top;
 }
 .ui.middle.aligned.images .image,
 .ui.middle.aligned.image,
+.ui.middle.aligned.image svg,
 .ui.middle.aligned.image img {
   display: inline-block;
   vertical-align: middle;
 }
 .ui.bottom.aligned.images .image,
 .ui.bottom.aligned.image,
+.ui.bottom.aligned.image svg,
 .ui.bottom.aligned.image img {
   display: inline-block;
   vertical-align: bottom;
@@ -99,7 +106,9 @@ img.ui.image {
 
 .ui.rounded.images .image,
 .ui.rounded.images img,
+.ui.rounded.images svg,
 .ui.rounded.image img,
+.ui.rounded.image svg,
 .ui.rounded.image {
   border-radius: @roundedBorderRadius;
 }
@@ -110,7 +119,9 @@ img.ui.image {
 
 .ui.bordered.images .image,
 .ui.bordered.images img,
+.ui.bordered.images svg,
 .ui.bordered.image img,
+.ui.bordered.image svg,
 img.ui.bordered.image {
   border: @imageBorder;
 }
@@ -126,7 +137,9 @@ img.ui.bordered.image {
 
 .ui.circular.images .image,
 .ui.circular.images img,
+.ui.circular.images svg,
 .ui.circular.image img,
+.ui.circular.image svg,
 .ui.circular.image {
   -webkit-border-radius: @circularRadius;
   -moz-border-radius: @circularRadius;
@@ -140,6 +153,8 @@ img.ui.bordered.image {
 .ui.fluid.images,
 .ui.fluid.image,
 .ui.fluid.images img,
+.ui.fluid.images svg,
+.ui.fluid.image svg,
 .ui.fluid.image img {
   display: block;
   width: 100%;
@@ -152,7 +167,9 @@ img.ui.bordered.image {
 
 .ui.avatar.images .image,
 .ui.avatar.images img,
+.ui.avatar.images svg,
 .ui.avatar.image img,
+.ui.avatar.image svg,
 .ui.avatar.image {
   margin-right: @avatarMargin;
 
@@ -202,48 +219,56 @@ img.ui.bordered.image {
 
 .ui.mini.images .image,
 .ui.mini.images img,
+.ui.mini.images svg,
 .ui.mini.image {
   width: @miniWidth;
   font-size: @mini;
 }
 .ui.tiny.images .image,
 .ui.tiny.images img,
+.ui.tiny.images svg,
 .ui.tiny.image {
   width: @tinyWidth;
   font-size: @tiny;
 }
 .ui.small.images .image,
 .ui.small.images img,
+.ui.small.images svg,
 .ui.small.image {
   width: @smallWidth;
   font-size: @small;
 }
 .ui.medium.images .image,
 .ui.medium.images img,
+.ui.medium.images svg,
 .ui.medium.image {
   width: @mediumWidth;
   font-size: @medium;
 }
 .ui.large.images .image,
 .ui.large.images img,
+.ui.large.images svg,
 .ui.large.image {
   width: @largeWidth;
   font-size: @large;
 }
 .ui.big.images .image,
 .ui.big.images img,
+.ui.big.images svg,
 .ui.big.image {
   width: @bigWidth;
   font-size: @big;
 }
 .ui.huge.images .image,
 .ui.huge.images img,
+.ui.huge.images svg,
 .ui.huge.image {
   width: @hugeWidth;
   font-size: @huge;
 }
 .ui.massive.images .image,
 .ui.massive.images img,
+.ui.massive.images svg,
 .ui.massive.image {
   width: @massiveWidth;
   font-size: @massive;
@@ -259,7 +284,8 @@ img.ui.bordered.image {
 }
 
 .ui.images .image,
-.ui.images img {
+.ui.images img,
+.ui.images svg {
   display: inline-block;
   margin: 0em @imageHorizontalMargin @imageVerticalMargin;
 }

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

@@ -120,6 +120,22 @@ a.ui.label {
        Coupling
 --------------------*/
 
+/* Remove border radius on attached segment */
+.ui.attached.segment > .ui.top.left.attached.label,
+.ui.bottom.attached.segment > .ui.top.left.attached.label  {
+  border-radius-top-left: 0;
+}
+.ui.attached.segment > .ui.top.right.attached.label,
+.ui.bottom.attached.segment > .ui.top.right.attached.label  {
+  border-radius-top-right: 0;
+}
+.ui.top.attached.segment > .ui.bottom.left.attached.label  {
+  border-radius-bottom-left: 0;
+}
+.ui.top.attached.segment > .ui.bottom.right.attached.label  {
+  border-radius-bottom-right: 0;
+}
+
 /* Padding on next content after a label */
 .ui.top.attached.label:first-child + :not(.attached) {
   margin-top: @attachedSegmentPadding !important;
@@ -416,7 +432,7 @@ a.ui.label {
   width: auto;
   top: auto;
   bottom: 0em;
-  border-radius: 0em 0em @borderRadius @borderRadius ;
+  border-radius: 0em @borderRadius 0em @borderRadius;
 }
 .ui.bottom.right.attached.label {
   top: auto;

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

@@ -65,11 +65,7 @@
   border: none;
   box-shadow: 0px 1px 0px @borderColor;
 }
-.ui[class*="vertical segment"]:first-child {
-  padding-top: 0em;
-}
 .ui[class*="vertical segment"]:last-child {
-  padding-bottom: 0em;
   box-shadow: none;
 }
 

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

@@ -115,10 +115,12 @@
 .ui.ordered.steps .step:before {
   display: table-cell;
   position: static;
+  text-align: center;
+  content: counters(ordered, ".");
+  vertical-align: @iconVerticalAlign;
   padding-right: @iconDistance;
   font-size: @iconSize;
   counter-increment: ordered;
-  content: counters(ordered, ".");
 }
 
 .ui.ordered.steps .step > * {
@@ -158,6 +160,36 @@
 }
 
 
+/*---------------
+    Responsive
+----------------*/
+
+/* Mobile (Default) */
+@media only screen and (max-width: (@largestMobileScreen)) {
+
+.ui.steps {
+  overflow: visible;
+}
+.ui.steps .step {
+  display: block;
+  border-radius: @borderRadius;
+  padding: @verticalPadding @horizontalPadding;
+}
+.ui.steps .step:first-child {
+  padding: @verticalPadding @horizontalPadding;
+  border-radius: @stepsBorderRadius @stepsBorderRadius 0em 0em;
+}
+.ui.steps .step:last-child {
+  border-radius: 0em 0em @stepsBorderRadius @stepsBorderRadius;
+}
+
+/* Arrow */
+.ui.steps .step:after {
+  display: none;
+}
+
+}
+
 /*******************************
             Group
 *******************************/
@@ -269,15 +301,54 @@
            Variations
 *******************************/
 
+
+/*--------------
+   Stackable
+---------------*/
+
+
+/* Tablet Or Below */
+@media only screen and (min-width: @computerBreakpoint) {
+
+.ui[class*="tablet stackable"].steps {
+  overflow: visible;
+}
+.ui[class*="tablet stackable"].steps .step {
+  display: block;
+  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;
+}
+
+}
+
+
+/*--------------
+      Fluid
+---------------*/
+
 /* Fluid */
 .ui.fluid.steps {
   width: 100%;
 }
 
+/*--------------
+    Attached
+---------------*/
 
-/* Attached */
+/* Top */
 .attached.ui.steps {
-  margin: 0em;
+  margin: @attachedTopMargin;
   border-radius: @stepsBorderRadius @stepsBorderRadius 0em 0em;
 }
 .attached.ui.steps .step:first-child {
@@ -287,9 +358,9 @@
   border-radius: 0em @stepsBorderRadius 0em 0em;
 }
 
-/* Bottom Side */
+/* Bottom */
 .bottom.attached.ui.steps {
-  margin-top: -1px;
+  margin: @attachedBottomMargin;
   border-radius: 0em 0em @stepsBorderRadius @stepsBorderRadius;
 }
 .bottom.attached.ui.steps .step:first-child {
@@ -299,8 +370,10 @@
   border-radius: 0em 0em @stepsBorderRadius 0em;
 }
 
+/*-------------------
+    Evenly Divided
+--------------------*/
 
-/* Evenly divided  */
 .ui.one.steps,
 .ui.two.steps,
 .ui.three.steps,
@@ -336,12 +409,11 @@
   width: 12.500%;
 }
 
+/*-------------------
+       Sizes
+--------------------*/
 
 
-/*******************************
-             Sizes
-*******************************/
-
 .ui.small.step,
 .ui.small.steps .step {
   font-size: @small;