fomantic-ui-sass 2.6.4 → 2.7.0

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

@@ -1,5 +1,5 @@
 /*!
- * # Semantic UI 2.6.4 - Icon
+ * # Semantic UI 2.7.0 - Icon
  * http://github.com/semantic-org/semantic-ui/
  *
  *
@@ -26,7 +26,7 @@
 i.icon {
   display: inline-block;
   opacity: 1;
-  margin: 0em 0.25rem 0em 0em;
+  margin: 0 0.25rem 0 0;
   width: 1.18em;
   height: 1em;
   font-family: 'Icons';
@@ -35,7 +35,6 @@ i.icon {
   text-decoration: inherit;
   text-align: center;
   speak: none;
-  font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   -webkit-font-smoothing: antialiased;
   -webkit-backface-visibility: hidden;
@@ -112,7 +111,7 @@ i.disabled.icon {
 
 i.fitted.icon {
   width: auto;
-  margin: 0em !important;
+  margin: 0 !important;
 }
 
 /*-------------------
@@ -138,9 +137,9 @@ i.link.icons:hover {
 i.circular.icon {
   border-radius: 500em !important;
   line-height: 1 !important;
-  padding: 0.5em 0em !important;
-  -webkit-box-shadow: 0em 0em 0em 0.1em rgba(0, 0, 0, 0.1) inset;
-          box-shadow: 0em 0em 0em 0.1em rgba(0, 0, 0, 0.1) inset;
+  padding: 0.5em 0 !important;
+  -webkit-box-shadow: 0 0 0 0.1em rgba(0, 0, 0, 0.1) inset;
+          box-shadow: 0 0 0 0.1em rgba(0, 0, 0, 0.1) inset;
   width: 2em !important;
   height: 2em !important;
 }
@@ -228,9 +227,9 @@ i.bordered.icon {
   vertical-align: baseline;
   width: 2em;
   height: 2em;
-  padding: 0.5em 0em !important;
-  -webkit-box-shadow: 0em 0em 0em 0.1em rgba(0, 0, 0, 0.1) inset;
-          box-shadow: 0em 0em 0em 0.1em rgba(0, 0, 0, 0.1) inset;
+  padding: 0.5em 0 !important;
+  -webkit-box-shadow: 0 0 0 0.1em rgba(0, 0, 0, 0.1) inset;
+          box-shadow: 0 0 0 0.1em rgba(0, 0, 0, 0.1) inset;
 }
 i.bordered.inverted.icon {
   border: none;
@@ -246,8 +245,8 @@ i.bordered.inverted.icon {
 /* Inverted Shapes */
 i.inverted.bordered.icon,
 i.inverted.circular.icon {
-  background-color: #1B1C1D !important;
-  color: #FFFFFF !important;
+  background-color: #1B1C1D;
+  color: #FFFFFF;
 }
 i.inverted.icon {
   color: #FFFFFF;
@@ -257,200 +256,170 @@ i.inverted.icon {
        Colors
 --------------------*/
 
-
-/* Primary */
 i.primary.icon {
-  color: #2185D0 !important;
+  color: #2185D0;
 }
 i.inverted.primary.icon {
-  color: #54C8FF !important;
+  color: #54C8FF;
 }
 i.inverted.bordered.primary.icon,
 i.inverted.circular.primary.icon {
-  background-color: #2185D0 !important;
-  color: #FFFFFF !important;
+  background-color: #2185D0;
+  color: #FFFFFF;
 }
-
-/* Secondary */
 i.secondary.icon {
-  color: #1B1C1D !important;
+  color: #1B1C1D;
 }
 i.inverted.secondary.icon {
-  color: #545454 !important;
+  color: #545454;
 }
 i.inverted.bordered.secondary.icon,
 i.inverted.circular.secondary.icon {
-  background-color: #1B1C1D !important;
-  color: #FFFFFF !important;
+  background-color: #1B1C1D;
+  color: #FFFFFF;
 }
-
-/* Red */
 i.red.icon {
-  color: #DB2828 !important;
+  color: #DB2828;
 }
 i.inverted.red.icon {
-  color: #FF695E !important;
+  color: #FF695E;
 }
 i.inverted.bordered.red.icon,
 i.inverted.circular.red.icon {
-  background-color: #DB2828 !important;
-  color: #FFFFFF !important;
+  background-color: #DB2828;
+  color: #FFFFFF;
 }
-
-/* Orange */
 i.orange.icon {
-  color: #F2711C !important;
+  color: #F2711C;
 }
 i.inverted.orange.icon {
-  color: #FF851B !important;
+  color: #FF851B;
 }
 i.inverted.bordered.orange.icon,
 i.inverted.circular.orange.icon {
-  background-color: #F2711C !important;
-  color: #FFFFFF !important;
+  background-color: #F2711C;
+  color: #FFFFFF;
 }
-
-/* Yellow */
 i.yellow.icon {
-  color: #FBBD08 !important;
+  color: #FBBD08;
 }
 i.inverted.yellow.icon {
-  color: #FFE21F !important;
+  color: #FFE21F;
 }
 i.inverted.bordered.yellow.icon,
 i.inverted.circular.yellow.icon {
-  background-color: #FBBD08 !important;
-  color: #FFFFFF !important;
+  background-color: #FBBD08;
+  color: #FFFFFF;
 }
-
-/* Olive */
 i.olive.icon {
-  color: #B5CC18 !important;
+  color: #B5CC18;
 }
 i.inverted.olive.icon {
-  color: #D9E778 !important;
+  color: #D9E778;
 }
 i.inverted.bordered.olive.icon,
 i.inverted.circular.olive.icon {
-  background-color: #B5CC18 !important;
-  color: #FFFFFF !important;
+  background-color: #B5CC18;
+  color: #FFFFFF;
 }
-
-/* Green */
 i.green.icon {
-  color: #21BA45 !important;
+  color: #21BA45;
 }
 i.inverted.green.icon {
-  color: #2ECC40 !important;
+  color: #2ECC40;
 }
 i.inverted.bordered.green.icon,
 i.inverted.circular.green.icon {
-  background-color: #21BA45 !important;
-  color: #FFFFFF !important;
+  background-color: #21BA45;
+  color: #FFFFFF;
 }
-
-/* Teal */
 i.teal.icon {
-  color: #00B5AD !important;
+  color: #00B5AD;
 }
 i.inverted.teal.icon {
-  color: #6DFFFF !important;
+  color: #6DFFFF;
 }
 i.inverted.bordered.teal.icon,
 i.inverted.circular.teal.icon {
-  background-color: #00B5AD !important;
-  color: #FFFFFF !important;
+  background-color: #00B5AD;
+  color: #FFFFFF;
 }
-
-/* Blue */
 i.blue.icon {
-  color: #2185D0 !important;
+  color: #2185D0;
 }
 i.inverted.blue.icon {
-  color: #54C8FF !important;
+  color: #54C8FF;
 }
 i.inverted.bordered.blue.icon,
 i.inverted.circular.blue.icon {
-  background-color: #2185D0 !important;
-  color: #FFFFFF !important;
+  background-color: #2185D0;
+  color: #FFFFFF;
 }
-
-/* Violet */
 i.violet.icon {
-  color: #6435C9 !important;
+  color: #6435C9;
 }
 i.inverted.violet.icon {
-  color: #A291FB !important;
+  color: #A291FB;
 }
 i.inverted.bordered.violet.icon,
 i.inverted.circular.violet.icon {
-  background-color: #6435C9 !important;
-  color: #FFFFFF !important;
+  background-color: #6435C9;
+  color: #FFFFFF;
 }
-
-/* Purple */
 i.purple.icon {
-  color: #A333C8 !important;
+  color: #A333C8;
 }
 i.inverted.purple.icon {
-  color: #DC73FF !important;
+  color: #DC73FF;
 }
 i.inverted.bordered.purple.icon,
 i.inverted.circular.purple.icon {
-  background-color: #A333C8 !important;
-  color: #FFFFFF !important;
+  background-color: #A333C8;
+  color: #FFFFFF;
 }
-
-/* Pink */
 i.pink.icon {
-  color: #E03997 !important;
+  color: #E03997;
 }
 i.inverted.pink.icon {
-  color: #FF8EDF !important;
+  color: #FF8EDF;
 }
 i.inverted.bordered.pink.icon,
 i.inverted.circular.pink.icon {
-  background-color: #E03997 !important;
-  color: #FFFFFF !important;
+  background-color: #E03997;
+  color: #FFFFFF;
 }
-
-/* Brown */
 i.brown.icon {
-  color: #A5673F !important;
+  color: #A5673F;
 }
 i.inverted.brown.icon {
-  color: #D67C1C !important;
+  color: #D67C1C;
 }
 i.inverted.bordered.brown.icon,
 i.inverted.circular.brown.icon {
-  background-color: #A5673F !important;
-  color: #FFFFFF !important;
+  background-color: #A5673F;
+  color: #FFFFFF;
 }
-
-/* Grey */
 i.grey.icon {
-  color: #767676 !important;
+  color: #767676;
 }
 i.inverted.grey.icon {
-  color: #DCDDDE !important;
+  color: #DCDDDE;
 }
 i.inverted.bordered.grey.icon,
 i.inverted.circular.grey.icon {
-  background-color: #767676 !important;
-  color: #FFFFFF !important;
+  background-color: #767676;
+  color: #FFFFFF;
 }
-
-/* Black */
 i.black.icon {
-  color: #1B1C1D !important;
+  color: #1B1C1D;
 }
 i.inverted.black.icon {
-  color: #545454 !important;
+  color: #545454;
 }
 i.inverted.bordered.black.icon,
 i.inverted.circular.black.icon {
-  background-color: #1B1C1D !important;
-  color: #FFFFFF !important;
+  background-color: #1B1C1D;
+  color: #FFFFFF;
 }
 
 /*-------------------
@@ -517,7 +486,6 @@ i.icons .icon {
   left: 50%;
   -webkit-transform: translateX(-50%) translateY(-50%);
           transform: translateX(-50%) translateY(-50%);
-  margin: 0em;
   margin: 0;
 }
 i.icons .icon:first-child {

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

@@ -1,5 +1,5 @@
 /*!
- * # Semantic UI 2.6.4 - Image
+ * # Semantic UI 2.7.0 - Image
  * http://github.com/semantic-org/semantic-ui/
  *
  *
@@ -178,10 +178,10 @@ img.ui.bordered.image {
 }
 .ui[class*="left spaced"].image {
   margin-left: 0.5em;
-  margin-right: 0em;
+  margin-right: 0;
 }
 .ui[class*="right spaced"].image {
-  margin-left: 0em;
+  margin-left: 0;
   margin-right: 0.5em;
 }
 
@@ -198,13 +198,13 @@ img.ui.bordered.image {
 .ui.right.floated.images,
 .ui.right.floated.image {
   float: right;
-  margin-right: 0em;
+  margin-right: 0;
   margin-bottom: 1em;
   margin-left: 1em;
 }
 .ui.floated.images:last-child,
 .ui.floated.image:last-child {
-  margin-bottom: 0em;
+  margin-bottom: 0;
 }
 .ui.centered.images,
 .ui.centered.image {
@@ -287,14 +287,14 @@ img.ui.bordered.image {
 *******************************/
 
 .ui.images {
-  font-size: 0em;
-  margin: 0em -0.25rem 0rem;
+  font-size: 0;
+  margin: 0 -0.25rem 0;
 }
 .ui.images .image,
 .ui.images > img,
 .ui.images > svg {
   display: inline-block;
-  margin: 0em 0.25rem 0.5rem;
+  margin: 0 0.25rem 0.5rem;
 }
 
 

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

@@ -1,5 +1,5 @@
 /*!
- * # Semantic UI 2.6.4 - Input
+ * # Semantic UI 2.7.0 - Input
  * http://github.com/semantic-org/semantic-ui/
  *
  *
@@ -28,7 +28,7 @@
   color: rgba(0, 0, 0, 0.87);
 }
 .ui.input > input {
-  margin: 0em;
+  margin: 0;
   max-width: 100%;
   -webkit-box-flex: 1;
       -ms-flex: 1 0 auto;
@@ -108,7 +108,7 @@
   content: '';
   top: 50%;
   left: 50%;
-  margin: -0.64285714em 0em 0em -0.64285714em;
+  margin: -0.64285714em 0 0 -0.64285714em;
   width: 1.28571429em;
   height: 1.28571429em;
   border-radius: 500rem;
@@ -119,19 +119,15 @@
   content: '';
   top: 50%;
   left: 50%;
-  margin: -0.64285714em 0em 0em -0.64285714em;
+  margin: -0.64285714em 0 0 -0.64285714em;
   width: 1.28571429em;
   height: 1.28571429em;
-  -webkit-animation: button-spin 0.6s linear;
-          animation: button-spin 0.6s linear;
-  -webkit-animation-iteration-count: infinite;
-          animation-iteration-count: infinite;
+  -webkit-animation: loader 0.6s infinite linear;
+          animation: loader 0.6s infinite linear;
+  border: 0.2em solid #767676;
   border-radius: 500rem;
-  border-color: #767676 transparent transparent;
-  border-style: solid;
-  border-width: 0.2em;
-  -webkit-box-shadow: 0px 0px 0px 1px transparent;
-          box-shadow: 0px 0px 0px 1px transparent;
+  -webkit-box-shadow: 0 0 0 1px transparent;
+          box-shadow: 0 0 0 1px transparent;
 }
 
 /*--------------------
@@ -206,10 +202,10 @@
 .ui.transparent.input > input {
   border-color: transparent !important;
   background-color: transparent !important;
-  padding: 0em !important;
+  padding: 0 !important;
   -webkit-box-shadow: none !important;
           box-shadow: none !important;
-  border-radius: 0px !important;
+  border-radius: 0 !important;
 }
 
 /* Transparent Icon */
@@ -217,12 +213,12 @@
   width: 1.1em;
 }
 .ui.transparent.icon.input > input {
-  padding-left: 0em !important;
+  padding-left: 0 !important;
   padding-right: 2em !important;
 }
 .ui.transparent[class*="left icon"].input > input {
   padding-left: 2em !important;
-  padding-right: 0em !important;
+  padding-right: 0 !important;
 }
 
 /* Transparent Inverted */
@@ -251,19 +247,20 @@
   position: absolute;
   line-height: 1;
   text-align: center;
-  top: 0px;
-  right: 0px;
-  margin: 0em;
+  top: 0;
+  right: 0;
+  margin: 0;
   height: 100%;
   width: 2.67142857em;
   opacity: 0.5;
-  border-radius: 0em 0.28571429rem 0.28571429rem 0em;
+  border-radius: 0 0.28571429rem 0.28571429rem 0;
   -webkit-transition: opacity 0.3s ease;
   transition: opacity 0.3s ease;
 }
 .ui.icon.input > i.icon:not(.link) {
   pointer-events: none;
 }
+.ui.icon.input > textarea,
 .ui.icon.input > input {
   padding-right: 2.67142857em !important;
 }
@@ -288,18 +285,20 @@
 .ui[class*="left icon"].input > i.icon {
   right: auto;
   left: 1px;
-  border-radius: 0.28571429rem 0em 0em 0.28571429rem;
+  border-radius: 0.28571429rem 0 0 0.28571429rem;
 }
 .ui[class*="left icon"].input > i.circular.icon {
   right: auto;
   left: 0.5em;
 }
+.ui[class*="left icon"].input > textarea,
 .ui[class*="left icon"].input > input {
   padding-left: 2.67142857em !important;
   padding-right: 1em !important;
 }
 
 /* Focus */
+.ui.icon.input > textarea:focus ~ i.icon,
 .ui.icon.input > input:focus ~ i.icon {
   opacity: 1;
 }
@@ -324,12 +323,12 @@
 
 /* Regular Label on Left */
 .ui.labeled.input:not([class*="corner labeled"]) .label:first-child {
-  border-top-right-radius: 0px;
-  border-bottom-right-radius: 0px;
+  border-top-right-radius: 0;
+  border-bottom-right-radius: 0;
 }
 .ui.labeled.input:not([class*="corner labeled"]) .label:first-child + input {
-  border-top-left-radius: 0px;
-  border-bottom-left-radius: 0px;
+  border-top-left-radius: 0;
+  border-bottom-left-radius: 0;
   border-left-color: transparent;
 }
 .ui.labeled.input:not([class*="corner labeled"]) .label:first-child + input:focus {
@@ -338,13 +337,13 @@
 
 /* Regular Label on Right */
 .ui[class*="right labeled"].input > input {
-  border-top-right-radius: 0px !important;
-  border-bottom-right-radius: 0px !important;
+  border-top-right-radius: 0 !important;
+  border-bottom-right-radius: 0 !important;
   border-right-color: transparent !important;
 }
 .ui[class*="right labeled"].input > input + .label {
-  border-top-left-radius: 0px;
-  border-bottom-left-radius: 0px;
+  border-top-left-radius: 0;
+  border-bottom-left-radius: 0;
 }
 .ui[class*="right labeled"].input > input:focus {
   border-right-color: #85B7D9 !important;
@@ -355,13 +354,15 @@
   top: 1px;
   right: 1px;
   font-size: 0.64285714em;
-  border-radius: 0em 0.28571429rem 0em 0em;
+  border-radius: 0 0.28571429rem 0 0;
 }
 
 /* Spacing with corner label */
+.ui[class*="corner labeled"]:not([class*="left corner labeled"]).labeled.input > textarea,
 .ui[class*="corner labeled"]:not([class*="left corner labeled"]).labeled.input > input {
   padding-right: 2.5em !important;
 }
+.ui[class*="corner labeled"].icon.input:not([class*="left corner labeled"]) > textarea,
 .ui[class*="corner labeled"].icon.input:not([class*="left corner labeled"]) > input {
   padding-right: 3.25em !important;
 }
@@ -370,15 +371,20 @@
 }
 
 /* Left Labeled */
+.ui[class*="left corner labeled"].labeled.input > textarea,
 .ui[class*="left corner labeled"].labeled.input > input {
   padding-left: 2.5em !important;
 }
+.ui[class*="left corner labeled"].icon.input > textarea,
 .ui[class*="left corner labeled"].icon.input > input {
   padding-left: 3.25em !important;
 }
 .ui[class*="left corner labeled"].icon.input > .icon {
   margin-left: 1.25em;
 }
+.ui.icon.input > textarea ~ .icon {
+  height: 3em;
+}
 
 /* Corner Label Position  */
 .ui.input > .ui.corner.label {
@@ -390,6 +396,21 @@
   left: 1px;
 }
 
+/* Labeled input error */
+.ui.labeled.input.error:not([class*="corner labeled"]) > .ui.label {
+  border-top: 1px solid #E0B4B4;
+  border-bottom: 1px solid #E0B4B4;
+}
+.ui.labeled.input.error:not(.right):not([class*="corner labeled"]) > .ui.label {
+  border-left: 1px solid #E0B4B4;
+}
+.ui.right.labeled.input.error:not([class*="corner labeled"]) > input + .ui.label {
+  border-right: 1px solid #E0B4B4;
+}
+.ui.right.labeled.input.error:not([class*="corner labeled"]) > .ui.label:first-child {
+  border-left: 1px solid #E0B4B4;
+}
+
 /*--------------------
         Action
 ---------------------*/
@@ -415,19 +436,19 @@
 
 /* Button on Right */
 .ui.action.input:not([class*="left action"]) > input {
-  border-top-right-radius: 0px !important;
-  border-bottom-right-radius: 0px !important;
+  border-top-right-radius: 0 !important;
+  border-bottom-right-radius: 0 !important;
   border-right-color: transparent !important;
 }
 .ui.action.input:not([class*="left action"]) > .dropdown:not(:first-child),
 .ui.action.input:not([class*="left action"]) > .button:not(:first-child),
 .ui.action.input:not([class*="left action"]) > .buttons:not(:first-child) > .button {
-  border-radius: 0px;
+  border-radius: 0;
 }
 .ui.action.input:not([class*="left action"]) > .dropdown:last-child,
 .ui.action.input:not([class*="left action"]) > .button:last-child,
 .ui.action.input:not([class*="left action"]) > .buttons:last-child > .button {
-  border-radius: 0px 0.28571429rem 0.28571429rem 0px;
+  border-radius: 0 0.28571429rem 0.28571429rem 0;
 }
 
 /* Input Focus */
@@ -437,19 +458,19 @@
 
 /* Button on Left */
 .ui[class*="left action"].input > input {
-  border-top-left-radius: 0px !important;
-  border-bottom-left-radius: 0px !important;
+  border-top-left-radius: 0 !important;
+  border-bottom-left-radius: 0 !important;
   border-left-color: transparent !important;
 }
 .ui[class*="left action"].input > .dropdown,
 .ui[class*="left action"].input > .button,
 .ui[class*="left action"].input > .buttons > .button {
-  border-radius: 0px;
+  border-radius: 0;
 }
 .ui[class*="left action"].input > .dropdown:first-child,
 .ui[class*="left action"].input > .button:first-child,
 .ui[class*="left action"].input > .buttons:first-child > .button {
-  border-radius: 0.28571429rem 0px 0px 0.28571429rem;
+  border-radius: 0.28571429rem 0 0 0.28571429rem;
 }
 
 /* Input Focus */
@@ -477,7 +498,7 @@
   display: flex;
 }
 .ui.fluid.input > input {
-  width: 0px !important;
+  width: 0 !important;
 }
 
 /*--------------------