fomantic-ui-sass 2.8.2 → 2.8.7

data/app/assets/stylesheets/semantic-ui/elements/_image.scss

@@ -74,27 +74,39 @@ img.ui.image {
     Vertical Aligned
   -------------------*/
 
-.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;
 }
+.ui.top.aligned.images .image,
+.ui.images .ui.top.aligned.image {
+  -ms-flex-item-align: start;
+      align-self: flex-start;
+}
+.ui.middle.aligned.images .image,
+.ui.images .ui.middle.aligned.image {
+  -ms-flex-item-align: center;
+      align-self: center;
+}
+.ui.bottom.aligned.images .image,
+.ui.images .ui.bottom.aligned.image {
+  -ms-flex-item-align: end;
+      align-self: flex-end;
+}
 
 /*--------------
        Rounded
@@ -206,11 +218,28 @@ img.ui.bordered.image {
 .ui.floated.image:last-child {
   margin-bottom: 0;
 }
-.ui.centered.images,
 .ui.centered.image {
+  display: block;
   margin-left: auto;
   margin-right: auto;
 }
+.ui.centered.images {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-orient: horizontal;
+  -webkit-box-direction: normal;
+      -ms-flex-direction: row;
+          flex-direction: row;
+  -ms-flex-wrap: wrap;
+      flex-wrap: wrap;
+  -webkit-box-align: stretch;
+      -ms-flex-align: stretch;
+          align-items: stretch;
+  -webkit-box-pack: center;
+      -ms-flex-pack: center;
+          justify-content: center;
+}
 
 /*--------------
      Sizes

data/app/assets/stylesheets/semantic-ui/elements/_input.scss

@@ -175,7 +175,7 @@
   color: #e7bdbc;
 }
 .ui.input.error > input:-ms-input-placeholder {
-  color: #e7bdbc;
+  color: #e7bdbc !important;
 }
 
 /* Focused Placeholder */
@@ -186,7 +186,7 @@
   color: #da9796;
 }
 .ui.input.error > input:focus:-ms-input-placeholder {
-  color: #da9796;
+  color: #da9796 !important;
 }
 .ui.input.info > input {
   background-color: #F8FFFF;
@@ -204,7 +204,7 @@
   color: #98cfe1;
 }
 .ui.input.info > input:-ms-input-placeholder {
-  color: #98cfe1;
+  color: #98cfe1 !important;
 }
 
 /* Focused Placeholder */
@@ -215,7 +215,7 @@
   color: #70bdd6;
 }
 .ui.input.info > input:focus:-ms-input-placeholder {
-  color: #70bdd6;
+  color: #70bdd6 !important;
 }
 .ui.input.success > input {
   background-color: #FCFFF5;
@@ -233,7 +233,7 @@
   color: #8fcf90;
 }
 .ui.input.success > input:-ms-input-placeholder {
-  color: #8fcf90;
+  color: #8fcf90 !important;
 }
 
 /* Focused Placeholder */
@@ -244,7 +244,7 @@
   color: #6cbf6d;
 }
 .ui.input.success > input:focus:-ms-input-placeholder {
-  color: #6cbf6d;
+  color: #6cbf6d !important;
 }
 .ui.input.warning > input {
   background-color: #FFFAF3;
@@ -262,7 +262,7 @@
   color: #edad3e;
 }
 .ui.input.warning > input:-ms-input-placeholder {
-  color: #edad3e;
+  color: #edad3e !important;
 }
 
 /* Focused Placeholder */
@@ -273,7 +273,7 @@
   color: #e39715;
 }
 .ui.input.warning > input:focus:-ms-input-placeholder {
-  color: #e39715;
+  color: #e39715 !important;
 }
 
 
@@ -458,7 +458,7 @@
 .ui[class*="corner labeled"].icon.input:not([class*="left corner labeled"]) > input {
   padding-right: 3.25em !important;
 }
-.ui[class*="corner labeled"].icon.input:not([class*="left corner labeled"]) > .icon {
+.ui[class*="corner labeled"].icon.input:not([class*="left corner labeled"]) > i.icon {
   margin-right: 1.25em;
 }
 
@@ -471,13 +471,13 @@
 .ui[class*="left corner labeled"].icon.input > input {
   padding-left: 3.25em !important;
 }
-.ui[class*="left corner labeled"].icon.input > .icon {
+.ui[class*="left corner labeled"].icon.input > i.icon {
   margin-left: 1.25em;
 }
-.ui.icon.input > textarea ~ .icon {
+.ui.icon.input > textarea ~ i.icon {
   height: 3em;
 }
-:not(.field) > .ui.transparent.icon.input > textarea ~ .icon {
+:not(.field) > .ui.transparent.icon.input > textarea ~ i.icon {
   height: 1.3em;
 }
 
@@ -492,97 +492,97 @@
 }
 
 /* Labeled and action input states */
-.ui.form > .field.error > .ui.action.input > .ui.button,
-.ui.form > .field.error > .ui.labeled.input:not([class*="corner labeled"]) > .ui.label,
+.ui.form .field.error > .ui.action.input > .ui.button,
+.ui.form .field.error > .ui.labeled.input:not([class*="corner labeled"]) > .ui.label,
 .ui.action.input.error > .ui.button,
 .ui.labeled.input.error:not([class*="corner labeled"]) > .ui.label {
-  border-top: 1px solid #9F3A38;
-  border-bottom: 1px solid #9F3A38;
+  border-top: 1px solid #E0B4B4;
+  border-bottom: 1px solid #E0B4B4;
 }
-.ui.form > .field.error > .ui.left.action.input > .ui.button,
-.ui.form > .field.error > .ui.labeled.input:not(.right):not([class*="corner labeled"]) > .ui.label,
-.ui.left.action.input.error > .ui.button,
+.ui.form .field.error > .ui[class*="left action"].input > .ui.button,
+.ui.form .field.error > .ui.labeled.input:not(.right):not([class*="corner labeled"]) > .ui.label,
+.ui[class*="left action"].input.error > .ui.button,
 .ui.labeled.input.error:not(.right):not([class*="corner labeled"]) > .ui.label {
-  border-left: 1px solid #9F3A38;
+  border-left: 1px solid #E0B4B4;
 }
-.ui.form > .field.error > .ui.action.input:not(.left) > input + .ui.button,
-.ui.form > .field.error > .ui.right.labeled.input:not([class*="corner labeled"]) > input + .ui.label,
-.ui.action.input.error:not(.left) > input + .ui.button,
+.ui.form .field.error > .ui.action.input:not([class*="left action"]) > input + .ui.button,
+.ui.form .field.error > .ui.right.labeled.input:not([class*="corner labeled"]) > input + .ui.label,
+.ui.action.input.error:not([class*="left action"]) > input + .ui.button,
 .ui.right.labeled.input.error:not([class*="corner labeled"]) > input + .ui.label {
-  border-right: 1px solid #9F3A38;
+  border-right: 1px solid #E0B4B4;
 }
-.ui.form > .field.error > .ui.right.labeled.input:not([class*="corner labeled"]) > .ui.label:first-child,
+.ui.form .field.error > .ui.right.labeled.input:not([class*="corner labeled"]) > .ui.label:first-child,
 .ui.right.labeled.input.error:not([class*="corner labeled"]) > .ui.label:first-child {
-  border-left: 1px solid #9F3A38;
+  border-left: 1px solid #E0B4B4;
 }
-.ui.form > .field.info > .ui.action.input > .ui.button,
-.ui.form > .field.info > .ui.labeled.input:not([class*="corner labeled"]) > .ui.label,
+.ui.form .field.info > .ui.action.input > .ui.button,
+.ui.form .field.info > .ui.labeled.input:not([class*="corner labeled"]) > .ui.label,
 .ui.action.input.info > .ui.button,
 .ui.labeled.input.info:not([class*="corner labeled"]) > .ui.label {
-  border-top: 1px solid #276F86;
-  border-bottom: 1px solid #276F86;
+  border-top: 1px solid #A9D5DE;
+  border-bottom: 1px solid #A9D5DE;
 }
-.ui.form > .field.info > .ui.left.action.input > .ui.button,
-.ui.form > .field.info > .ui.labeled.input:not(.right):not([class*="corner labeled"]) > .ui.label,
-.ui.left.action.input.info > .ui.button,
+.ui.form .field.info > .ui[class*="left action"].input > .ui.button,
+.ui.form .field.info > .ui.labeled.input:not(.right):not([class*="corner labeled"]) > .ui.label,
+.ui[class*="left action"].input.info > .ui.button,
 .ui.labeled.input.info:not(.right):not([class*="corner labeled"]) > .ui.label {
-  border-left: 1px solid #276F86;
+  border-left: 1px solid #A9D5DE;
 }
-.ui.form > .field.info > .ui.action.input:not(.left) > input + .ui.button,
-.ui.form > .field.info > .ui.right.labeled.input:not([class*="corner labeled"]) > input + .ui.label,
-.ui.action.input.info:not(.left) > input + .ui.button,
+.ui.form .field.info > .ui.action.input:not([class*="left action"]) > input + .ui.button,
+.ui.form .field.info > .ui.right.labeled.input:not([class*="corner labeled"]) > input + .ui.label,
+.ui.action.input.info:not([class*="left action"]) > input + .ui.button,
 .ui.right.labeled.input.info:not([class*="corner labeled"]) > input + .ui.label {
-  border-right: 1px solid #276F86;
+  border-right: 1px solid #A9D5DE;
 }
-.ui.form > .field.info > .ui.right.labeled.input:not([class*="corner labeled"]) > .ui.label:first-child,
+.ui.form .field.info > .ui.right.labeled.input:not([class*="corner labeled"]) > .ui.label:first-child,
 .ui.right.labeled.input.info:not([class*="corner labeled"]) > .ui.label:first-child {
-  border-left: 1px solid #276F86;
+  border-left: 1px solid #A9D5DE;
 }
-.ui.form > .field.success > .ui.action.input > .ui.button,
-.ui.form > .field.success > .ui.labeled.input:not([class*="corner labeled"]) > .ui.label,
+.ui.form .field.success > .ui.action.input > .ui.button,
+.ui.form .field.success > .ui.labeled.input:not([class*="corner labeled"]) > .ui.label,
 .ui.action.input.success > .ui.button,
 .ui.labeled.input.success:not([class*="corner labeled"]) > .ui.label {
-  border-top: 1px solid #2C662D;
-  border-bottom: 1px solid #2C662D;
+  border-top: 1px solid #A3C293;
+  border-bottom: 1px solid #A3C293;
 }
-.ui.form > .field.success > .ui.left.action.input > .ui.button,
-.ui.form > .field.success > .ui.labeled.input:not(.right):not([class*="corner labeled"]) > .ui.label,
-.ui.left.action.input.success > .ui.button,
+.ui.form .field.success > .ui[class*="left action"].input > .ui.button,
+.ui.form .field.success > .ui.labeled.input:not(.right):not([class*="corner labeled"]) > .ui.label,
+.ui[class*="left action"].input.success > .ui.button,
 .ui.labeled.input.success:not(.right):not([class*="corner labeled"]) > .ui.label {
-  border-left: 1px solid #2C662D;
+  border-left: 1px solid #A3C293;
 }
-.ui.form > .field.success > .ui.action.input:not(.left) > input + .ui.button,
-.ui.form > .field.success > .ui.right.labeled.input:not([class*="corner labeled"]) > input + .ui.label,
-.ui.action.input.success:not(.left) > input + .ui.button,
+.ui.form .field.success > .ui.action.input:not([class*="left action"]) > input + .ui.button,
+.ui.form .field.success > .ui.right.labeled.input:not([class*="corner labeled"]) > input + .ui.label,
+.ui.action.input.success:not([class*="left action"]) > input + .ui.button,
 .ui.right.labeled.input.success:not([class*="corner labeled"]) > input + .ui.label {
-  border-right: 1px solid #2C662D;
+  border-right: 1px solid #A3C293;
 }
-.ui.form > .field.success > .ui.right.labeled.input:not([class*="corner labeled"]) > .ui.label:first-child,
+.ui.form .field.success > .ui.right.labeled.input:not([class*="corner labeled"]) > .ui.label:first-child,
 .ui.right.labeled.input.success:not([class*="corner labeled"]) > .ui.label:first-child {
-  border-left: 1px solid #2C662D;
+  border-left: 1px solid #A3C293;
 }
-.ui.form > .field.warning > .ui.action.input > .ui.button,
-.ui.form > .field.warning > .ui.labeled.input:not([class*="corner labeled"]) > .ui.label,
+.ui.form .field.warning > .ui.action.input > .ui.button,
+.ui.form .field.warning > .ui.labeled.input:not([class*="corner labeled"]) > .ui.label,
 .ui.action.input.warning > .ui.button,
 .ui.labeled.input.warning:not([class*="corner labeled"]) > .ui.label {
-  border-top: 1px solid #573A08;
-  border-bottom: 1px solid #573A08;
+  border-top: 1px solid #C9BA9B;
+  border-bottom: 1px solid #C9BA9B;
 }
-.ui.form > .field.warning > .ui.left.action.input > .ui.button,
-.ui.form > .field.warning > .ui.labeled.input:not(.right):not([class*="corner labeled"]) > .ui.label,
-.ui.left.action.input.warning > .ui.button,
+.ui.form .field.warning > .ui[class*="left action"].input > .ui.button,
+.ui.form .field.warning > .ui.labeled.input:not(.right):not([class*="corner labeled"]) > .ui.label,
+.ui[class*="left action"].input.warning > .ui.button,
 .ui.labeled.input.warning:not(.right):not([class*="corner labeled"]) > .ui.label {
-  border-left: 1px solid #573A08;
+  border-left: 1px solid #C9BA9B;
 }
-.ui.form > .field.warning > .ui.action.input:not(.left) > input + .ui.button,
-.ui.form > .field.warning > .ui.right.labeled.input:not([class*="corner labeled"]) > input + .ui.label,
-.ui.action.input.warning:not(.left) > input + .ui.button,
+.ui.form .field.warning > .ui.action.input:not([class*="left action"]) > input + .ui.button,
+.ui.form .field.warning > .ui.right.labeled.input:not([class*="corner labeled"]) > input + .ui.label,
+.ui.action.input.warning:not([class*="left action"]) > input + .ui.button,
 .ui.right.labeled.input.warning:not([class*="corner labeled"]) > input + .ui.label {
-  border-right: 1px solid #573A08;
+  border-right: 1px solid #C9BA9B;
 }
-.ui.form > .field.warning > .ui.right.labeled.input:not([class*="corner labeled"]) > .ui.label:first-child,
+.ui.form .field.warning > .ui.right.labeled.input:not([class*="corner labeled"]) > .ui.label:first-child,
 .ui.right.labeled.input.warning:not([class*="corner labeled"]) > .ui.label:first-child {
-  border-left: 1px solid #573A08;
+  border-left: 1px solid #C9BA9B;
 }
 
 /*--------------------

data/app/assets/stylesheets/semantic-ui/elements/_label.scss

@@ -154,6 +154,21 @@ a.ui.label {
   margin-top: 0;
   margin-bottom: 2rem !important;
 }
+.ui.segment:not(.basic) > .ui.top.attached.label {
+  margin-top: -1px;
+}
+.ui.segment:not(.basic) > .ui.bottom.attached.label {
+  margin-bottom: -1px;
+}
+.ui.segment:not(.basic) > .ui.attached.label:not(.right) {
+  margin-left: -1px;
+}
+.ui.segment:not(.basic) > .ui.right.attached.label {
+  margin-right: -1px;
+}
+.ui.segment:not(.basic) > .ui.attached.label:not(.left):not(.right) {
+  width: calc(100% + 2px);
+}
 
 
 /*******************************
@@ -161,7 +176,7 @@ a.ui.label {
 *******************************/
 
 .ui.image.label {
-  width: auto !important;
+  width: auto;
   margin-top: 0;
   margin-bottom: 0;
   max-width: 9999px;
@@ -173,6 +188,9 @@ a.ui.label {
   -webkit-box-shadow: none;
           box-shadow: none;
 }
+.ui.image.label.attached:not(.basic) {
+  padding: 0.5833em 0.833em 0.5833em 0.5em;
+}
 .ui.image.label img {
   display: inline-block;
   vertical-align: top;
@@ -186,6 +204,14 @@ a.ui.label {
   padding: 0.5833em 0.833em;
   border-radius: 0 0.28571429rem 0.28571429rem 0;
 }
+.ui.bottom.attached.image.label:not(.right) > img,
+.ui.top.right.attached.image.label > img {
+  border-top-left-radius: 0;
+}
+.ui.top.attached.image.label:not(.right) > img,
+.ui.bottom.right.attached.image.label > img {
+  border-bottom-left-radius: 0;
+}
 
 /*-------------------
          Tag
@@ -444,7 +470,7 @@ a.ui.label {
 }
 .ui[class*="top left attached"].label {
   width: auto;
-  margin-top: 0 !important;
+  margin-top: 0;
   border-radius: 0.21428571rem 0 0.28571429rem 0;
 }
 .ui[class*="top right attached"].label {
@@ -567,6 +593,16 @@ a.ui.active.label:hover:before {
   color: rgba(0, 0, 0, 0.87);
   -webkit-box-shadow: none;
           box-shadow: none;
+  padding-top: calc(0.5833em - 1px);
+  padding-bottom: calc(0.5833em - 1px);
+  padding-right: calc(0.833em - 1px);
+}
+.ui.basic.labels:not(.tag):not(.image):not(.ribbon) .label,
+.ui.basic.label:not(.tag):not(.image):not(.ribbon) {
+  padding-left: calc(0.833em - 1px);
+}
+.ui.basic.image.label {
+  padding-left: calc(0.5em - 1px);
 }
 
 /* Link */

data/app/assets/stylesheets/semantic-ui/elements/_list.scss

@@ -143,16 +143,16 @@ ol.ui.list ol li,
   color: rgba(0, 0, 0, 0.87);
 }
 .ui.list .list > .item > .image + .content,
-.ui.list .list > .item > .icon + .content,
+.ui.list .list > .item > i.icon + .content,
 .ui.list > .item > .image + .content,
-.ui.list > .item > .icon + .content {
+.ui.list > .item > i.icon + .content {
   display: table-cell;
   width: 100%;
   padding: 0 0 0 0.5em;
   vertical-align: top;
 }
-.ui.list .list > .item > .loading.icon + .content,
-.ui.list > .item > .loading.icon + .content {
+.ui.list .list > .item > i.loading.icon + .content,
+.ui.list > .item > i.loading.icon + .content {
   padding-left: calc(0.2857142857142857em + 0.5em);
 }
 .ui.list .list > .item > img.image + .content,
@@ -295,8 +295,8 @@ ol.ui.list ol li,
 }
 .ui.horizontal.list > .item > .image,
 .ui.horizontal.list .list > .item > .image,
-.ui.horizontal.list > .item > .icon,
-.ui.horizontal.list .list > .item > .icon,
+.ui.horizontal.list > .item > i.icon,
+.ui.horizontal.list .list > .item > i.icon,
 .ui.horizontal.list > .item > .content,
 .ui.horizontal.list .list > .item > .content {
   vertical-align: middle;
@@ -316,8 +316,8 @@ ol.ui.list ol li,
   padding: 0 0.25em 0 0;
 }
 .ui.horizontal.list > .item > .image + .content,
-.ui.horizontal.list > .item > .icon,
-.ui.horizontal.list > .item > .icon + .content {
+.ui.horizontal.list > .item > i.icon,
+.ui.horizontal.list > .item > i.icon + .content {
   float: none;
   display: inline-block;
   width: auto;
@@ -352,8 +352,8 @@ ol.ui.list ol li,
 
 .ui.list .list > a.item:hover > .icons,
 .ui.list > a.item:hover > .icons,
-.ui.list .list > a.item:hover > .icon,
-.ui.list > a.item:hover > .icon {
+.ui.list .list > a.item:hover > i.icon,
+.ui.list > a.item:hover > i.icon {
   color: rgba(0, 0, 0, 0.87);
 }
 
@@ -367,8 +367,8 @@ ol.ui.list ol li,
          Inverted
   --------------------*/
 
-.ui.inverted.list .list > a.item > .icon,
-.ui.inverted.list > a.item > .icon {
+.ui.inverted.list .list > a.item > i.icon,
+.ui.inverted.list > a.item > i.icon {
   color: rgba(255, 255, 255, 0.7);
 }
 .ui.inverted.list .list > .item .header,