_input.scss in semantic-ui-sass-1.11.4.0

- old
+ new

@@ -1,18 +1,17 @@
- /*
- * # Semantic UI - 1.8.1
- * https://github.com/Semantic-Org/Semantic-UI
- * http://www.semantic-ui.com/
+/*!
+ * # Semantic UI 1.11.4 - Input
+ * http://github.com/semantic-org/semantic-ui/
  *
+ *
  * Copyright 2014 Contributors
  * Released under the MIT license
  * http://opensource.org/licenses/MIT
  *
  */
 
 
-
 /*******************************
            Standard
 *******************************/
 
 
@@ -258,35 +257,35 @@
 ---------------------*/
 
 
 /* Adjacent Label */
 .ui.labeled.input {
-  display: table;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
 }
-.ui.labeled.input > input {
-  display: table-cell;
-  vertical-align: top;
-}
 .ui.labeled.input > .label {
-  display: table-cell !important;
-  vertical-align: middle;
-  white-space: nowrap;
+  -webkit-box-flex: 1;
+  -webkit-flex: 1 0 auto;
+      -ms-flex: 1 0 auto;
+          flex: 1 0 auto;
+  margin: 0;
   font-size: 1em;
 }
-.ui.labeled.input > .label > .icon {
-  display: inline;
-  vertical-align: top;
+.ui.labeled.input > .label:not(.corner) {
+  padding-top: 0.78571em;
+  padding-bottom: 0.78571em;
 }
 
 /* Fluid Labeled */
 .ui.fluid.labeled.input {
-  display: table;
-  width: 100%;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
 }
-.ui.fluid.labeled.input > .label {
-  width: 0.01%;
-}
 
 /* Label on Left */
 .ui.labeled.input:not([class*="corner labeled"]):not([class*="right labeled"]) > input {
   border-left: none;
   border-top-left-radius: 0px;
@@ -318,16 +317,10 @@
 .ui.labeled.input input {
   padding-right: 2.5em !important;
 }
 
 /* Spacing with corner label */
-.ui[class*="corner labeled"].input {
-  display: inline-block;
-}
-.ui[class*="corner labeled"].input > input {
-  display: block;
-}
 .ui[class*="corner labeled"].icon.input:not(.left) > input {
   padding-right: 3.25em !important;
 }
 .ui[class*="corner labeled"].icon.input:not(.left) > .icon {
   margin-right: 1.25em;
@@ -336,43 +329,34 @@
 /*--------------------
         Action
 ---------------------*/
 
 .ui.action.input {
-  display: table;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
 }
-.ui.action.input > input {
-  display: table-cell;
-  vertical-align: top;
-}
 .ui.action.input > .button,
 .ui.action.input > .buttons {
-  display: table-cell !important;
-  vertical-align: middle;
-  white-space: nowrap;
-  margin: 0;
+  -webkit-box-flex: 1;
+  -webkit-flex: 1 0 auto;
+      -ms-flex: 1 0 auto;
+          flex: 1 0 auto;
 }
 .ui.action.input > .button,
 .ui.action.input > .buttons > .button {
-  vertical-align: middle;
-  white-space: nowrap;
-  margin: 0;
   padding-top: 0.78571em;
   padding-bottom: 0.78571em;
+  margin: 0;
 }
-.ui.action.input > .button > .icon,
-.ui.action.input > .buttons > .button > .icon {
-  display: inline;
-  vertical-align: top;
-}
 
 /* Fluid */
 .ui.fluid.action.input {
-  display: table;
-  width: 100%;
-}
-.ui.fluid.action.input > .button {
-  width: 0.01%;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
 }
 
 /* Button on Right */
 .ui.action.input:not([class*="left action"]) > input {
   border-right: none;