Add autocomplete styles for forms

src/definitions/collections/form.less

@@ -263,7 +263,14 @@
             States
 *******************************/
 
+/*--------------------
+      Autofilled
+---------------------*/
 
+.ui.form input:-webkit-autofill {
+  box-shadow: 0px 0px 0px 100px @inputAutoFillBackground inset;
+  border-color: @inputAutoFillBorder;
+}
 /*--------------------
       Placeholder
 ---------------------*/
@@ -310,6 +317,7 @@
   color: @inputErrorPlaceholderFocusColor;
 }
 
+
 /*--------------------
         Focus
 ---------------------*/
@@ -340,6 +348,13 @@
   -webkit-appearance: none;
 }
 
+/* Autofill Focus */
+.ui.form input:-webkit-autofill:focus {
+  box-shadow: 0px 0px 0px 100px @inputAutoFillFocusBackground inset !important;
+  border-color: @inputAutoFillFocusBorder !important;
+}
+
+
 /*--------------------
         Success
 ---------------------*/

src/themes/default/collections/form.variables

@@ -39,7 +39,6 @@
 @inputTransition:
   background-color 0.2s ease,
   color 0.2s ease,
-  box-shadow 0.2s ease,
   border-color 0.2s ease
 ;
 @inputBoxShadow: 0em 0em 0em 0em transparent inset;
@@ -87,7 +86,7 @@
 /* Input Focus */
 @inputFocusBackground: @inputBackground;
 @inputFocusBorderColor: @selectedBorderColor;
-@inputFocusColor: rgba(0, 0, 0, 0.85);
+@inputFocusColor: @selectedTextColor;
 @inputFocusBoxShadow: @inputFocusPointerSize 0em 0em 0em @selectedBorderColor inset;
 @inputFocusBorderRadius: @inputBorderRadius;
 
@@ -106,6 +105,15 @@
 @formErrorBorder: @negativeBorderColor;
 @formErrorBackground: @negativeBackgroundColor;
 
+/* AutoFill */
+@inputAutoFillBackground: #FFFFF0;
+@inputAutoFillBorder: #E5DFA1;
+
+/* Focused AutoFill */
+@inputAutoFillFocusBackground: @inputAutoFillBackground;
+@inputAutoFillFocusBorder: #DDCC27;
+
+
 /* Input Error */
 @inputErrorBorderRadius: @inputBorderRadius;
 @inputErrorBoxShadow: none;