small screen fix

src/components/base/BaseInput.vue

@@ -1,5 +1,5 @@
 <template lang="pug">
-  base-input-container.gap-y-2(:important="important", :label="label", :style="{width: width + 'px', ...sizeVariable}")
+  base-input-container.gap-y-2(:important="important", :label="label", :style="{width: widthInternal, ...sizeVariable}")
     q-input.input(
       v-model="value",
       :name="name",
@@ -24,7 +24,7 @@
       :shadow-text="shadowText",
       :autofocus="autofocus",
       hide-bottom-space
-      :error="error"
+      :error="error",
       @focus="e => $emit('focus', e)"
     )
       template(v-slot:prepend, v-if="iconLeft")
@@ -69,7 +69,7 @@ export default {
     shadowText: String,
     mask: String,
     debounce: [String, Number],
-    width: Number,
+    width: [String, Number],
     rule: Array,
     lazyRule: [Boolean, String],
     itemAligned: Boolean,
@@ -153,6 +153,10 @@ export default {
         "--py": "8px 0",
       };
     },
+    widthInternal() {
+      if (typeof this.width === "number") return this.width + "px";
+      return this.width;
+    },
   },
 };
 </script>