phone input responsive fix (#12)

Reviewed-on: #12
Co-authored-by: YaroslavBerkuta <yaroslavberkuta@gmail.com>
Co-committed-by: YaroslavBerkuta <yaroslavberkuta@gmail.com>

src/scss/main.scss

@@ -593,3 +593,9 @@ input[type="number"] {
 .highlight {
   color: #000 !important;
 }
+
+@media (min-width: 768px) {
+  .col-md-3 {
+    padding-right: 8px;
+  }
+}

src/shared/components/fields/input-mask-field.component.tsx

@@ -51,6 +51,7 @@ export const InputMaskField: FC<IProps> = ({
           containerStyle={{
             flexDirection: "row-reverse",
             display: "flex",
+            width: "auto",
           }}
           country={"ua"}
           enableSearch={false}
@@ -60,7 +61,11 @@ export const InputMaskField: FC<IProps> = ({
             border: "none",
             background: "transparent",
           }}
-          inputStyle={{ background: "transparent", paddingLeft: 0 }}
+          inputStyle={{
+            background: "transparent",
+            paddingLeft: 0,
+            width: "100%",
+          }}
           onChange={(value: string) => {
             onChange(value);
           }}