@3t-transform/threeteeui 0.1.5 → 0.1.6

package/dist/collection/components/molecules/tttx-form/tttx-form.css

@@ -45,7 +45,6 @@
 
 .icon-right {
   margin-top: 5px;
-  margin-right: 4px;
 }
 
 .icon-left {
@@ -61,8 +60,10 @@
   padding-right: 4px;
 }
 
-.focused {
-  border-color: #1479c6;
+.input-icon {
+  position: absolute;
+  margin-top: 9px;
+  margin-left: 4px;
 }
 
 .errormsg {
@@ -104,6 +105,20 @@ label.inputBlock {
   line-height: 21px;
 }
 
+label.inputInline {
+  display: flex;
+  white-space: nowrap;
+  align-items: center;
+}
+label.inputInline .input-container {
+  margin: 0 4px;
+  width: 100%;
+  display: flex;
+  align-items: center;
+  gap: 4px;
+  position: relative;
+}
+
 label {
   font-weight: 500;
   font-size: 16px;
@@ -129,10 +144,20 @@ input[type=date] {
   line-height: 37px;
 }
 
+/* Android device date alignment fix */
+@media (max-width: 600px) {
+  input[type=date] {
+    padding-top: 6px;
+  }
+}
 input.invalid:invalid, input.standalone.invalid {
   border: 1px solid #dc0000;
 }
 
+.input-icon ~ input {
+  padding: 0 32px;
+}
+
 input ~ .errorBubble {
   min-height: 27px;
   position: relative;
@@ -172,6 +197,10 @@ input:focus {
   border-color: #1479c6;
 }
 
+input:focus-visible {
+  outline: none;
+}
+
 .button {
   font-family: Roboto, serif;
   box-sizing: border-box;