_input.scss in semantic-ui-sass-2.2.0.0

- old
+ new

@@ -1,11 +1,10 @@
 /*!
- * # Semantic UI 2.1.7 - Input
+ * # Semantic UI 2.2.0 - Input
  * http://github.com/semantic-org/semantic-ui/
  *
  *
- * Copyright 2015 Contributors
  * Released under the MIT license
  * http://opensource.org/licenses/MIT
  *
  */
 
@@ -40,33 +39,33 @@
   -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
   text-align: left;
   line-height: 1.2142em;
   font-family: 'Lato', 'Helvetica Neue', Arial, Helvetica, sans-serif;
   padding: 0.67861429em 1em;
-  background: #ffffff;
+  background: #FFFFFF;
   border: 1px solid rgba(34, 36, 38, 0.15);
   color: rgba(0, 0, 0, 0.87);
   border-radius: 0.28571429rem;
   -webkit-transition: box-shadow 0.1s ease, border-color 0.1s ease;
-          transition: box-shadow 0.1s ease, border-color 0.1s ease;
+  transition: box-shadow 0.1s ease, border-color 0.1s ease;
   box-shadow: none;
 }
 
 /*--------------------
       Placeholder
 ---------------------*/
 
 
 /* browsers require these rules separate */
 .ui.input input::-webkit-input-placeholder {
-  color: rgba(0, 0, 0, 0.4);
+  color: rgba(191, 191, 191, 0.87);
 }
 .ui.input input::-moz-placeholder {
-  color: rgba(0, 0, 0, 0.4);
+  color: rgba(191, 191, 191, 0.87);
 }
-.ui.input input::-ms-input-placeholder {
-  color: rgba(0, 0, 0, 0.4);
+.ui.input input:-ms-input-placeholder {
+  color: rgba(191, 191, 191, 0.87);
 }
 
 
 /*******************************
             States
@@ -79,22 +78,23 @@
 
 .ui.disabled.input,
 .ui.input input[disabled] {
   opacity: 0.45;
 }
-.ui.disabled.input input {
+.ui.disabled.input input,
+.ui.input input[disabled] {
   pointer-events: none;
 }
 
 /*--------------------
         Active
 ---------------------*/
 
 .ui.input input:active,
 .ui.input.down input {
   border-color: rgba(0, 0, 0, 0.3);
-  background: #fafafa;
+  background: #FAFAFA;
   color: rgba(0, 0, 0, 0.87);
   box-shadow: none;
 }
 
 /*--------------------
@@ -135,59 +135,59 @@
         Focus
 ---------------------*/
 
 .ui.input.focus input,
 .ui.input input:focus {
-  border-color: #85b7d9;
-  background: #ffffff;
+  border-color: #85B7D9;
+  background: #FFFFFF;
   color: rgba(0, 0, 0, 0.8);
   box-shadow: none;
 }
 .ui.input.focus input::-webkit-input-placeholder,
 .ui.input input:focus::-webkit-input-placeholder {
-  color: rgba(0, 0, 0, 0.87);
+  color: rgba(115, 115, 115, 0.87);
 }
 .ui.input.focus input::-moz-placeholder,
 .ui.input input:focus::-moz-placeholder {
-  color: rgba(0, 0, 0, 0.87);
+  color: rgba(115, 115, 115, 0.87);
 }
-.ui.input.focus input::-ms-input-placeholder,
-.ui.input input:focus::-ms-input-placeholder {
-  color: rgba(0, 0, 0, 0.87);
+.ui.input.focus input:-ms-input-placeholder,
+.ui.input input:focus:-ms-input-placeholder {
+  color: rgba(115, 115, 115, 0.87);
 }
 
 /*--------------------
         Error
 ---------------------*/
 
 .ui.input.error input {
-  background-color: #fff6f6;
-  border-color: #e0b4b4;
-  color: #9f3a38;
+  background-color: #FFF6F6;
+  border-color: #E0B4B4;
+  color: #9F3A38;
   box-shadow: none;
 }
 
 /* Error Placeholder */
 .ui.input.error input::-webkit-input-placeholder {
   color: #e7bdbc;
 }
 .ui.input.error input::-moz-placeholder {
   color: #e7bdbc;
 }
-.ui.input.error input::-ms-input-placeholder {
-  color: #e7bdbc;
+.ui.input.error input:-ms-input-placeholder {
+  color: #e7bdbc !important;
 }
 
 /* Focused Error Placeholder */
 .ui.input.error input:focus::-webkit-input-placeholder {
   color: #da9796;
 }
 .ui.input.error input:focus::-moz-placeholder {
   color: #da9796;
 }
-.ui.input.error input:focus::-ms-input-placeholder {
-  color: #da9796;
+.ui.input.error input:focus:-ms-input-placeholder {
+  color: #da9796 !important;
 }
 
 
 /*******************************
            Variations
@@ -218,22 +218,22 @@
   padding-right: 0em !important;
 }
 
 /* Transparent Inverted */
 .ui.transparent.inverted.input {
-  color: #ffffff;
+  color: #FFFFFF;
 }
 .ui.transparent.inverted.input input {
   color: inherit;
 }
 .ui.transparent.inverted.input input::-webkit-input-placeholder {
   color: rgba(255, 255, 255, 0.5);
 }
 .ui.transparent.inverted.input input::-moz-placeholder {
   color: rgba(255, 255, 255, 0.5);
 }
-.ui.transparent.inverted.input input::-ms-input-placeholder {
+.ui.transparent.inverted.input input:-ms-input-placeholder {
   color: rgba(255, 255, 255, 0.5);
 }
 
 /*--------------------
          Icon
@@ -250,11 +250,11 @@
   height: 100%;
   width: 2.67142857em;
   opacity: 0.5;
   border-radius: 0em 0.28571429rem 0.28571429rem 0em;
   -webkit-transition: opacity 0.3s ease;
-          transition: opacity 0.3s ease;
+  transition: opacity 0.3s ease;
 }
 .ui.icon.input > i.icon:not(.link) {
   pointer-events: none;
 }
 .ui.icon.input input {
@@ -325,11 +325,11 @@
   border-top-left-radius: 0px;
   border-bottom-left-radius: 0px;
   border-left-color: transparent;
 }
 .ui.labeled.input:not([class*="corner labeled"]) .label:first-child + input:focus {
-  border-left-color: #85b7d9;
+  border-left-color: #85B7D9;
 }
 
 /* Regular Label on Right */
 .ui[class*="right labeled"].input input {
   border-top-right-radius: 0px !important;
@@ -339,11 +339,11 @@
 .ui[class*="right labeled"].input input + .label {
   border-top-left-radius: 0px;
   border-bottom-left-radius: 0px;
 }
 .ui[class*="right labeled"].input input:focus {
-  border-right-color: #85b7d9 !important;
+  border-right-color: #85B7D9 !important;
 }
 
 /* Corner Label */
 .ui.labeled.input .corner.label {
   top: 1px;
@@ -414,24 +414,24 @@
 .ui.action.input:not([class*="left action"]) > input {
   border-top-right-radius: 0px !important;
   border-bottom-right-radius: 0px !important;
   border-right-color: transparent !important;
 }
-.ui.action.input:not([class*="left action"]) > .dropdown,
-.ui.action.input:not([class*="left action"]) > .button,
-.ui.action.input:not([class*="left action"]) > .buttons > .button {
+.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;
 }
 .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;
 }
 
 /* Input Focus */
 .ui.action.input:not([class*="left action"]) input:focus {
-  border-right-color: #85b7d9 !important;
+  border-right-color: #85B7D9 !important;
 }
 
 /* Button on Left */
 .ui[class*="left action"].input > input {
   border-top-left-radius: 0px !important;
@@ -449,11 +449,11 @@
   border-radius: 0.28571429rem 0px 0px 0.28571429rem;
 }
 
 /* Input Focus */
 .ui[class*="left action"].input > input:focus {
-  border-left-color: #85b7d9 !important;
+  border-left-color: #85B7D9 !important;
 }
 
 /*--------------------
        Inverted
 ---------------------*/
@@ -481,10 +481,10 @@
 /*--------------------
         Size
 ---------------------*/
 
 .ui.mini.input {
-  font-size: 0.71428571em;
+  font-size: 0.78571429em;
 }
 .ui.small.input {
   font-size: 0.92857143em;
 }
 .ui.input {