form.less in less-rails-semantic_ui-2.2.1.0

- old
+ new

@@ -11,11 +11,10 @@
 /*!
  * # Semantic UI - Form
  * http://github.com/semantic-org/semantic-ui/
  *
  *
- * Copyright 2015 Contributors
  * Released under the MIT license
  * http://opensource.org/licenses/MIT
  *
  */
 
@@ -26,11 +25,10 @@
 @type    : 'collection';
 @element : 'form';
 
 @import (multiple) 'semantic_ui/theme.config';
 
-
 /*******************************
             Elements
 *******************************/
 
 /*--------------------
@@ -64,11 +62,11 @@
   margin-bottom: 0em;
 }
 
 .ui.form .fields .field {
   clear: both;
-  margin: @fieldMargin;
+  margin: 0em;
 }
 
 
 /*--------------------
         Labels
@@ -330,43 +328,43 @@
 
 /* browsers require these rules separate */
 .ui.form ::-webkit-input-placeholder {
   color: @inputPlaceholderColor;
 }
-.ui.form ::-ms-input-placeholder {
+.ui.form :-ms-input-placeholder {
   color: @inputPlaceholderColor;
 }
 .ui.form ::-moz-placeholder {
   color: @inputPlaceholderColor;
 }
 
 .ui.form :focus::-webkit-input-placeholder {
   color: @inputPlaceholderFocusColor;
 }
-.ui.form :focus::-ms-input-placeholder {
+.ui.form :focus:-ms-input-placeholder {
   color: @inputPlaceholderFocusColor;
 }
 .ui.form :focus::-moz-placeholder {
   color: @inputPlaceholderFocusColor;
 }
 
 /* Error Placeholder */
 .ui.form .error ::-webkit-input-placeholder {
   color: @inputErrorPlaceholderColor;
 }
-.ui.form .error ::-ms-input-placeholder {
-  color: @inputErrorPlaceholderColor;
+.ui.form .error :-ms-input-placeholder {
+  color: @inputErrorPlaceholderColor !important;
 }
 .ui.form .error ::-moz-placeholder {
   color: @inputErrorPlaceholderColor;
 }
 
 .ui.form .error :focus::-webkit-input-placeholder {
   color: @inputErrorPlaceholderFocusColor;
 }
-.ui.form .error :focus::-ms-input-placeholder {
-  color: @inputErrorPlaceholderFocusColor;
+.ui.form .error :focus:-ms-input-placeholder {
+  color: @inputErrorPlaceholderFocusColor !important;
 }
 .ui.form .error :focus::-moz-placeholder {
   color: @inputErrorPlaceholderFocusColor;
 }
 
@@ -408,10 +406,13 @@
 
 /* On Form */
 .ui.form.success .success.message:not(:empty) {
   display: block;
 }
+.ui.form.success .compact.success.message:not(:empty) {
+  display: inline-block;
+}
 .ui.form.success .icon.success.message:not(:empty) {
   display: flex;
 }
 
 /*--------------------
@@ -420,10 +421,13 @@
 
 /* On Form */
 .ui.form.warning .warning.message:not(:empty) {
   display: block;
 }
+.ui.form.warning .compact.warning.message:not(:empty) {
+  display: inline-block;
+}
 .ui.form.warning .icon.warning.message:not(:empty) {
   display: flex;
 }
 
 /*--------------------
@@ -432,10 +436,13 @@
 
 /* On Form */
 .ui.form.error .error.message:not(:empty) {
   display: block;
 }
+.ui.form.error .compact.error.message:not(:empty) {
+  display: inline-block;
+}
 .ui.form.error .icon.error.message:not(:empty) {
   display: flex;
 }
 
 /* On Field(s) */
@@ -699,11 +706,16 @@
 .ui.inverted.form label,
 .ui.form .inverted.segment label,
 .ui.form .inverted.segment .ui.checkbox label,
 .ui.form .inverted.segment .ui.checkbox .box,
 .ui.inverted.form .ui.checkbox label,
-.ui.inverted.form .ui.checkbox .box {
+.ui.inverted.form .ui.checkbox .box,
+.ui.inverted.form .inline.fields > label,
+.ui.inverted.form .inline.fields .field > label,
+.ui.inverted.form .inline.fields .field > p,
+.ui.inverted.form .inline.field > label,
+.ui.inverted.form .inline.field > p {
   color: @invertedLabelColor;
 }
 
 /* Inverted Field */
 .ui.inverted.form input:not([type]),
@@ -758,10 +770,11 @@
 
 /* Split fields */
 .ui.form .fields {
   display: flex;
   flex-direction: row;
+  margin: @fieldsMargin;
 }
 .ui.form .fields > .field {
   flex: 0 1 auto;
   padding-left: (@gutterWidth / 2);
   padding-right: (@gutterWidth / 2);
@@ -812,10 +825,13 @@
 /* Swap to full width on mobile */
 @media only screen and (max-width : @largestMobileScreen) {
   .ui.form .fields {
     flex-wrap: wrap;
   }
+
+  .ui[class*="equal width"].form .fields > .field,
+  .ui.form [class*="equal width"].fields > .field,
   .ui.form .two.fields > .fields,
   .ui.form .two.fields > .field,
   .ui.form .three.fields > .fields,
   .ui.form .three.fields > .field,
   .ui.form .four.fields > .fields,
@@ -831,36 +847,21 @@
   .ui.form .nine.fields > .fields,
   .ui.form .nine.fields > .field,
   .ui.form .ten.fields > .fields,
   .ui.form .ten.fields > .field {
     width: @oneColumn !important;
-    margin: @fieldMargin;
-    padding-left: 0%;
-    padding-right: 0%;
+    margin: 0em 0em @rowDistance;
   }
 }
 
-.ui.form .fields .field:first-child {
-  padding-left: 0%;
-}
-.ui.form .fields .field:last-child {
-  padding-right: 0%;
-}
 
-
 /* Sizing Combinations */
 .ui.form .fields .wide.field {
   width: @oneWide;
   padding-left: (@gutterWidth / 2);
   padding-right: (@gutterWidth / 2);
 }
-.ui.form .fields .wide.field:first-child {
-  padding-left: 0%;
-}
-.ui.form .fields .wide.field:last-child {
-  padding-right: 0%;
-}
 
 .ui.form .one.wide.field {
   width: @oneWide !important;
 }
 .ui.form .two.wide.field {
@@ -933,14 +934,14 @@
   .ui.form .fields > .thirteen.wide.field,
   .ui.form .fields > .fourteen.wide.field,
   .ui.form .fields > .fifteen.wide.field,
   .ui.form .fields > .sixteen.wide.field {
     width: @oneColumn !important;
-    margin: @fieldMargin;
-    padding-left: 0%;
-    padding-right: 0%;
   }
+  .ui.form .fields {
+    margin-bottom: 0em;
+  }
 }
 
 /*--------------------
      Equal Width
 ---------------------*/
@@ -1024,26 +1025,31 @@
 
 /*--------------------
         Sizes
 ---------------------*/
 
-/* Standard */
+.ui.mini.form {
+  font-size: @mini;
+}
+.ui.tiny.form {
+  font-size: @tiny;
+}
 .ui.small.form {
   font-size: @small;
 }
-
-/* Medium */
 .ui.form {
   font-size: @medium;
 }
-
-/* Large */
 .ui.large.form {
   font-size: @large;
 }
-
-/* Huge */
+.ui.big.form {
+  font-size: @big;
+}
 .ui.huge.form {
   font-size: @huge;
+}
+.ui.massive.form {
+  font-size: @massive;
 }
 
 .loadUIOverrides();