@syncfusion/ej2-inputs 21.2.8 → 22.1.34

package/styles/input/material.css

@@ -3156,8 +3156,8 @@ textarea.e-input.e-bigger.e-small,
 .e-input-group.e-control-wrapper .e-clear-icon.e-bigger,
 .e-bigger .e-input-group .e-clear-icon,
 .e-bigger .e-input-group.e-control-wrapper .e-clear-icon {
-  min-height: 20px;
   min-width: 20px;
+  min-height: 20px;
   padding-bottom: 5px;
   padding-right: 8px;
   padding-top: 6px;
@@ -3173,6 +3173,19 @@ textarea.e-input.e-bigger.e-small,
   padding-top: 6px;
 }
 
+.e-input-group.e-small .e-clear-icon,
+.e-input-group .e-clear-icon.e-small,
+.e-small.e-bigger .e-input-group .e-clear-icon,
+.e-input-group.e-control-wrapper.e-small .e-clear-icon,
+.e-input-group.e-control-wrapper .e-clear-icon.e-small,
+.e-small.e-bigger .e-input-group.e-control-wrapper .e-clear-icon {
+  min-height: 20px;
+  min-width: 20px;
+  padding-bottom: 5px;
+  padding-right: 8px;
+  padding-top: 6px;
+}
+
 .e-input-group.e-small.e-bigger .e-clear-icon,
 .e-input-group.e-small .e-clear-icon.e-bigger,
 .e-bigger .e-input-group.e-small .e-clear-icon,
@@ -3447,7 +3460,7 @@ textarea.e-input.e-bigger.e-small,
 .e-small .e-float-input.e-control-wrapper.e-input-group input,
 .e-float-input.e-control-wrapper.e-input-group.e-small input,
 .e-small .e-float-input.e-control-wrapper.e-input-group input {
-  min-height: 18px;
+  min-height: 16px;
 }
 
 .e-input-group.e-bigger.e-small:not(.e-float-input) .e-input,
@@ -3469,7 +3482,7 @@ textarea.e-input.e-bigger.e-small,
 .e-float-input.e-control-wrapper.e-input-group.e-bigger.e-small input,
 .e-bigger .e-float-input.e-control-wrapper.e-input-group.e-small input,
 .e-small .e-float-input.e-control-wrapper.e-input-group.e-bigger input {
-  min-height: 22px;
+  min-height: 28px;
 }
 
 .e-input-group input.e-input,
@@ -4381,6 +4394,12 @@ textarea.e-outline.e-input,
   margin: 9px 12px 9px 0;
 }
 
+.e-outline.e-input-group.e-prepend .e-input-group-icon,
+.e-outline.e-input-group.e-prepend.e-control-wrapper .e-input-group-icon {
+  font-size: 16px;
+  margin: 9px 0 9px 12px;
+}
+
 .e-outline.e-float-input.e-input-focus:not(.e-input-group):not(.e-float-icon-left):not(.e-success):not(.e-warning):not(.e-error) input,
 .e-outline.e-float-input.e-input-focus:not(.e-input-group):not(.e-float-icon-left).e-success:not(.e-warning):not(.e-error) input,
 .e-outline.e-float-input.e-input-focus:not(.e-input-group):not(.e-float-icon-left):not(.e-success).e-warning:not(.e-error) input,
@@ -9177,76 +9196,85 @@ textarea.e-outline,
   outline: none;
 }
 
-.e-input-group.e-prepend input.e-input,
-.e-float-input.e-input-group.e-prepend input,
-.e-input-group.e-control-wrapper.e-prepend input.e-input,
-.e-float-input.e-input-group.e-control-wrapper.e-prepend input,
-.e-float-input.e-prepend input,
-.e-float-input.e-control-wrapper.e-prepend input {
+.e-input-group.e-control-container.e-control-wrapper.e-float-input.e-prepend.e-append:not(.e-outline) .e-input-in-wrap,
+.e-input-group.e-control-container.e-control-wrapper.e-float-input.e-prepend:not(.e-outline) .e-input-in-wrap {
+  border-bottom: 1px solid;
+  border-bottom-color: rgba(0, 0, 0, 0.42);
+}
+
+.e-error.e-input-group.e-control-container.e-control-wrapper.e-float-input.e-prepend.e-append .e-input-in-wrap,
+.e-error.e-input-group.e-control-container.e-control-wrapper.e-float-input.e-prepend .e-input-in-wrap {
   border-bottom: 1px solid;
+  border-bottom-color: #f44336;
+}
+
+.e-success.e-input-group.e-control-container.e-control-wrapper.e-float-input.e-prepend.e-append .e-input-in-wrap,
+.e-success.e-input-group.e-control-container.e-control-wrapper.e-float-input.e-prepend .e-input-in-wrap {
+  border-bottom: 1px solid;
+  border-bottom-color: #22b24b;
 }
 
-.e-input-group.e-prepend:not(.e-float-icon-left),
-.e-input-group.e-prepend.e-success:not(.e-float-icon-left),
-.e-input-group.e-prepend.e-warning:not(.e-float-icon-left),
-.e-input-group.e-prepend.e-error:not(.e-float-icon-left),
-.e-input-group.e-control-wrapper.e-prepend:not(.e-float-icon-left),
-.e-input-group.e-control-wrapper.e-prepend.e-success:not(.e-float-icon-left),
-.e-input-group.e-control-wrapper.e-prepend.e-warning:not(.e-float-icon-left),
-.e-input-group.e-control-wrapper.e-prepend.e-error:not(.e-float-icon-left) {
+.e-input-group:not(.e-outline).e-prepend:not(.e-float-icon-left),
+.e-input-group:not(.e-outline).e-prepend.e-success:not(.e-float-icon-left),
+.e-input-group:not(.e-outline).e-prepend.e-warning:not(.e-float-icon-left),
+.e-input-group:not(.e-outline).e-prepend.e-error:not(.e-float-icon-left),
+.e-input-group:not(.e-outline).e-control-wrapper.e-prepend:not(.e-float-icon-left),
+.e-input-group:not(.e-outline).e-control-wrapper.e-prepend.e-success:not(.e-float-icon-left),
+.e-input-group:not(.e-outline).e-control-wrapper.e-prepend.e-warning:not(.e-float-icon-left),
+.e-input-group:not(.e-outline).e-control-wrapper.e-prepend.e-error:not(.e-float-icon-left) {
   border-bottom: transparent;
 }
 
-.e-input-group.e-prepend.e-input-focus:not(.e-float-icon-left):not(.e-success):not(.e-warning):not(.e-error),
-.e-input-group.e-control-wrapper.e-prepend.e-input-focus:not(.e-float-icon-left):not(.e-success):not(.e-warning):not(.e-error),
-.e-float-input.e-input-group.e-prepend.e-input-focus:not(.e-float-icon-left):not(.e-success):not(.e-warning):not(.e-error),
-.e-float-input.e-input-group.e-prepend.e-input-focus:not(.e-float-icon-left).e-success:not(.e-warning):not(.e-error),
-.e-float-input.e-input-group.e-prepend.e-input-focus:not(.e-float-icon-left):not(.e-success).e-warning:not(.e-error),
-.e-float-input.e-input-group.e-prepend.e-input-focus:not(.e-float-icon-left):not(.e-success):not(.e-warning).e-error,
-.e-float-input.e-control-wrapper.e-input-group.e-prepend.e-input-focus:not(.e-float-icon-left):not(.e-success):not(.e-warning):not(.e-error),
-.e-float-input.e-control-wrapper.e-input-group.e-prepend.e-input-focus:not(.e-float-icon-left).e-success:not(.e-warning):not(.e-error),
-.e-float-input.e-control-wrapper.e-input-group.e-prepend.e-input-focus:not(.e-float-icon-left):not(.e-success).e-warning:not(.e-error),
-.e-float-input.e-control-wrapper.e-input-group.e-prepend.e-input-focus:not(.e-float-icon-left):not(.e-success):not(.e-warning).e-error,
-.e-float-input.e-control-wrapper.e-prepend.e-input-focus:not(.e-input-group):not(.e-float-icon-left):not(.e-disabled):not(.e-success):not(.e-warning):not(.e-error) input,
-.e-float-input.e-control-wrapper.e-prepend.e-input-focus:not(.e-input-group):not(.e-float-icon-left):not(.e-disabled).e-success:not(.e-warning):not(.e-error) input,
-.e-float-input.e-control-wrapper.e-prepend.e-input-focus:not(.e-input-group):not(.e-float-icon-left):not(.e-disabled):not(.e-success).e-warning:not(.e-error) input,
-.e-float-input.e-control-wrapper.e-prepend.e-input-focus:not(.e-input-group):not(.e-float-icon-left):not(.e-disabled):not(.e-success):not(.e-warning).e-error input,
-.e-float-input.e-control-wrapper.e-prepend.e-input-focus:not(.e-input-group):not(.e-float-icon-left):not(.e-disabled):not(.e-success):not(.e-warning):not(.e-error) textarea,
-.e-float-input.e-control-wrapper.e-prepend.e-input-focus:not(.e-input-group):not(.e-float-icon-left):not(.e-disabled).e-success:not(.e-warning):not(.e-error) textarea,
-.e-float-input.e-control-wrapper.e-prepend.e-input-focus:not(.e-input-group):not(.e-float-icon-left):not(.e-disabled):not(.e-success).e-warning:not(.e-error) textarea,
-.e-float-input.e-control-wrapper.e-prepend.e-input-focus:not(.e-input-group):not(.e-float-icon-left):not(.e-disabled):not(.e-success):not(.e-warning).e-error textarea,
-.e-float-input.e-prepend.e-input-focus:not(.e-input-group):not(.e-float-icon-left):not(.e-disabled):not(.e-success):not(.e-warning):not(.e-error) input,
-.e-float-input.e-prepend.e-input-focus:not(.e-input-group):not(.e-float-icon-left):not(.e-disabled).e-success:not(.e-warning):not(.e-error) input,
-.e-float-input.e-prepend.e-input-focus:not(.e-input-group):not(.e-float-icon-left):not(.e-disabled):not(.e-success).e-warning:not(.e-error) input,
-.e-float-input.e-prepend.e-input-focus:not(.e-input-group):not(.e-float-icon-left):not(.e-disabled):not(.e-success):not(.e-warning).e-error input,
-.e-float-input.e-prepend.e-input-focus:not(.e-input-group):not(.e-float-icon-left):not(.e-disabled):not(.e-success):not(.e-warning):not(.e-error) textarea,
-.e-float-input.e-prepend.e-input-focus:not(.e-input-group):not(.e-float-icon-left):not(.e-disabled).e-success:not(.e-warning):not(.e-error) textarea,
-.e-float-input.e-prepend.e-input-focus:not(.e-input-group):not(.e-float-icon-left):not(.e-disabled):not(.e-success).e-warning:not(.e-error) textarea,
-.e-float-input.e-prepend.e-input-focus:not(.e-input-group):not(.e-float-icon-left):not(.e-disabled):not(.e-success):not(.e-warning).e-error textarea,
-.e-input-group.e-prepend.e-input-focus:not(.e-float-icon-left).e-success:not(.e-warning):not(.e-error),
-.e-input-group.e-prepend.e-input-focus:not(.e-float-icon-left).e-warning:not(.e-success):not(.e-error),
-.e-input-group.e-control-wrapper.e-prepend.e-input-focus:not(.e-float-icon-left).e-success:not(.e-warning):not(.e-error),
-.e-input-group.e-control-wrapper.e-prepend.e-input-focus:not(.e-float-icon-left).e-warning:not(.e-success):not(.e-error),
-.e-input-group.e-prepend.e-input-focus:not(.e-float-icon-left).e-error:not(.e-success):not(.e-warning),
-.e-input-group.e-float-icon-left.e-prepend.e-input-focus:not(.e-success):not(.e-warning):not(.e-error) .e-input-in-wrap,
-.e-input-group.e-float-icon-left.e-prepend.e-input-focus.e-success:not(.e-warning):not(.e-error) .e-input-in-wrap,
-.e-input-group.e-float-icon-left.e-prepend.e-input-focus.e-warning:not(.e-success):not(.e-error) .e-input-in-wrap,
-.e-input-group.e-float-icon-left.e-prepend.e-input-focus.e-error:not(.e-success):not(.e-warning) .e-input-in-wrap {
+.e-input-group:not(.e-outline).e-prepend.e-input-focus:not(.e-float-icon-left):not(.e-success):not(.e-warning):not(.e-error),
+.e-input-group:not(.e-outline).e-control-wrapper.e-prepend.e-input-focus:not(.e-float-icon-left):not(.e-success):not(.e-warning):not(.e-error),
+.e-float-input:not(.e-outline).e-input-group.e-prepend.e-input-focus:not(.e-float-icon-left):not(.e-success):not(.e-warning):not(.e-error),
+.e-float-input:not(.e-outline).e-input-group.e-prepend.e-input-focus:not(.e-float-icon-left).e-success:not(.e-warning):not(.e-error),
+.e-float-input:not(.e-outline).e-input-group.e-prepend.e-input-focus:not(.e-float-icon-left):not(.e-success).e-warning:not(.e-error),
+.e-float-input:not(.e-outline).e-input-group.e-prepend.e-input-focus:not(.e-float-icon-left):not(.e-success):not(.e-warning).e-error,
+.e-float-input:not(.e-outline).e-control-wrapper.e-input-group.e-prepend.e-input-focus:not(.e-float-icon-left):not(.e-success):not(.e-warning):not(.e-error),
+.e-float-input:not(.e-outline).e-control-wrapper.e-input-group.e-prepend.e-input-focus:not(.e-float-icon-left).e-success:not(.e-warning):not(.e-error),
+.e-float-input:not(.e-outline).e-control-wrapper.e-input-group.e-prepend.e-input-focus:not(.e-float-icon-left):not(.e-success).e-warning:not(.e-error),
+.e-float-input:not(.e-outline).e-control-wrapper.e-input-group.e-prepend.e-input-focus:not(.e-float-icon-left):not(.e-success):not(.e-warning).e-error,
+.e-float-input:not(.e-outline).e-control-wrapper.e-prepend.e-input-focus:not(.e-input-group):not(.e-float-icon-left):not(.e-disabled):not(.e-success):not(.e-warning):not(.e-error) input,
+.e-float-input:not(.e-outline).e-control-wrapper.e-prepend.e-input-focus:not(.e-input-group):not(.e-float-icon-left):not(.e-disabled).e-success:not(.e-warning):not(.e-error) input,
+.e-float-input:not(.e-outline).e-control-wrapper.e-prepend.e-input-focus:not(.e-input-group):not(.e-float-icon-left):not(.e-disabled):not(.e-success).e-warning:not(.e-error) input,
+.e-float-input:not(.e-outline).e-control-wrapper.e-prepend.e-input-focus:not(.e-input-group):not(.e-float-icon-left):not(.e-disabled):not(.e-success):not(.e-warning).e-error input,
+.e-float-input:not(.e-outline).e-control-wrapper.e-prepend.e-input-focus:not(.e-input-group):not(.e-float-icon-left):not(.e-disabled):not(.e-success):not(.e-warning):not(.e-error) textarea,
+.e-float-input:not(.e-outline).e-control-wrapper.e-prepend.e-input-focus:not(.e-input-group):not(.e-float-icon-left):not(.e-disabled).e-success:not(.e-warning):not(.e-error) textarea,
+.e-float-input:not(.e-outline).e-control-wrapper.e-prepend.e-input-focus:not(.e-input-group):not(.e-float-icon-left):not(.e-disabled):not(.e-success).e-warning:not(.e-error) textarea,
+.e-float-input:not(.e-outline).e-control-wrapper.e-prepend.e-input-focus:not(.e-input-group):not(.e-float-icon-left):not(.e-disabled):not(.e-success):not(.e-warning).e-error textarea,
+.e-float-input:not(.e-outline).e-prepend.e-input-focus:not(.e-input-group):not(.e-float-icon-left):not(.e-disabled):not(.e-success):not(.e-warning):not(.e-error) input,
+.e-float-input:not(.e-outline).e-prepend.e-input-focus:not(.e-input-group):not(.e-float-icon-left):not(.e-disabled).e-success:not(.e-warning):not(.e-error) input,
+.e-float-input:not(.e-outline).e-prepend.e-input-focus:not(.e-input-group):not(.e-float-icon-left):not(.e-disabled):not(.e-success).e-warning:not(.e-error) input,
+.e-float-input:not(.e-outline).e-prepend.e-input-focus:not(.e-input-group):not(.e-float-icon-left):not(.e-disabled):not(.e-success):not(.e-warning).e-error input,
+.e-float-input:not(.e-outline).e-prepend.e-input-focus:not(.e-input-group):not(.e-float-icon-left):not(.e-disabled):not(.e-success):not(.e-warning):not(.e-error) textarea,
+.e-float-input:not(.e-outline).e-prepend.e-input-focus:not(.e-input-group):not(.e-float-icon-left):not(.e-disabled).e-success:not(.e-warning):not(.e-error) textarea,
+.e-float-input:not(.e-outline).e-prepend.e-input-focus:not(.e-input-group):not(.e-float-icon-left):not(.e-disabled):not(.e-success).e-warning:not(.e-error) textarea,
+.e-float-input:not(.e-outline).e-prepend.e-input-focus:not(.e-input-group):not(.e-float-icon-left):not(.e-disabled):not(.e-success):not(.e-warning).e-error textarea,
+.e-input-group:not(.e-outline).e-prepend.e-input-focus:not(.e-float-icon-left).e-success:not(.e-warning):not(.e-error),
+.e-input-group:not(.e-outline).e-prepend.e-input-focus:not(.e-float-icon-left).e-warning:not(.e-success):not(.e-error),
+.e-input-group:not(.e-outline).e-control-wrapper.e-prepend.e-input-focus:not(.e-float-icon-left).e-success:not(.e-warning):not(.e-error),
+.e-input-group:not(.e-outline).e-control-wrapper.e-prepend.e-input-focus:not(.e-float-icon-left).e-warning:not(.e-success):not(.e-error),
+.e-input-group:not(.e-outline).e-prepend.e-input-focus:not(.e-float-icon-left).e-error:not(.e-success):not(.e-warning),
+.e-input-group:not(.e-outline).e-float-icon-left.e-prepend.e-input-focus:not(.e-success):not(.e-warning):not(.e-error) .e-input-in-wrap,
+.e-input-group:not(.e-outline).e-float-icon-left.e-prepend.e-input-focus.e-success:not(.e-warning):not(.e-error) .e-input-in-wrap,
+.e-input-group:not(.e-outline).e-float-icon-left.e-prepend.e-input-focus.e-warning:not(.e-success):not(.e-error) .e-input-in-wrap,
+.e-input-group:not(.e-outline).e-float-icon-left.e-prepend.e-input-focus.e-error:not(.e-success):not(.e-warning) .e-input-in-wrap {
   border-bottom: transparent;
 }
 
-.e-input-group.e-prepend:hover:not(.e-disabled):not(.e-float-icon-left),
-.e-input-group.e-control-wrapper.e-prepend:hover:not(.e-disabled):not(.e-float-icon-left),
-.e-float-input.e-prepend:hover:not(.e-disabled):not(.e-float-icon-left),
-.e-float-input.e-prepend:hover:not(.e-input-group):not(.e-disabled) input:not([disabled]),
-.e-float-input.e-prepend:hover:not(.e-input-group):not(.e-disabled) textarea:not([disabled]),
-.e-float-input.e-prepend:hover:not(.e-input-group):not(.e-disabled) input:not([disabled]),
-.e-float-input.e-prepend:hover:not(.e-input-group):not(.e-disabled) textarea:not([disabled]),
-.e-float-input.e-control-wrapper.e-prepend:hover:not(.e-disabled):not(.e-float-icon-left),
-.e-float-input.e-control-wrapper.e-prepend:hover:not(.e-input-group):not(.e-disabled) input:not([disabled]),
-.e-float-input.e-control-wrapper.e-prepend:hover:not(.e-input-group):not(.e-disabled) textarea:not([disabled]),
-.e-float-input.e-control-wrapper.e-prepend:hover:not(.e-input-group):not(.e-disabled) input:not([disabled]),
-.e-float-input.e-control-wrapper.e-prepend:hover:not(.e-input-group):not(.e-disabled) textarea:not([disabled]) {
+.e-input-group:not(.e-outline).e-prepend:hover:not(.e-disabled):not(.e-float-icon-left),
+.e-input-group:not(.e-outline).e-control-wrapper.e-prepend:hover:not(.e-disabled):not(.e-float-icon-left),
+.e-float-input:not(.e-outline).e-prepend:hover:not(.e-disabled):not(.e-float-icon-left),
+.e-float-input:not(.e-outline).e-prepend:hover:not(.e-input-group):not(.e-disabled) input:not([disabled]),
+.e-float-input:not(.e-outline).e-prepend:hover:not(.e-input-group):not(.e-disabled) textarea:not([disabled]),
+.e-float-input:not(.e-outline).e-prepend:hover:not(.e-input-group):not(.e-disabled) input:not([disabled]),
+.e-float-input:not(.e-outline).e-prepend:hover:not(.e-input-group):not(.e-disabled) textarea:not([disabled]),
+.e-float-input:not(.e-outline).e-control-wrapper.e-prepend:hover:not(.e-disabled):not(.e-float-icon-left),
+.e-float-input:not(.e-outline).e-control-wrapper.e-prepend:hover:not(.e-input-group):not(.e-disabled) input:not([disabled]),
+.e-float-input:not(.e-outline).e-control-wrapper.e-prepend:hover:not(.e-input-group):not(.e-disabled) textarea:not([disabled]),
+.e-float-input:not(.e-outline).e-control-wrapper.e-prepend:hover:not(.e-input-group):not(.e-disabled) input:not([disabled]),
+.e-float-input:not(.e-outline).e-control-wrapper.e-prepend:hover:not(.e-input-group):not(.e-disabled) textarea:not([disabled]) {
   border-bottom: transparent;
 }