tg app fix

src/components/settings/CategoryCreateUpdate.vue

@@ -111,22 +111,35 @@ onMounted(async () => {
 
     <div class="flex flex-col w-full  ">
       <div class=" flex-col " v-tooltip.focus.bottom="'Only emoji supported'">
-        <input class="!flex !justify-items-center !justify-center font-extralight text-9xl w-full focus:outline-0"
+        <input
-               placeholder="Icon" v-model="categoryIcon" @input="handleInput" @paste="handlePaste"
+            class="
-               @compositionend="handleCompositionEnd" inputmode="text"
+    block w-full
-               autocomplete="off"
+    text-9xl font-extralight
-               spellcheck="false"/>
+    text-center placeholder:text-center   /* центрируем текст и плейсхолдер */
-        <label class="!justify-items-center !justify-center !font-extralight text-gray-600 text-center">Category
+    p-0 m-0 border-0 bg-transparent
+    focus:outline-none appearance-none    /* убрать системные артефакты iOS/TG */
+    leading-none
+  "
+            placeholder="Icon"
+            v-model="categoryIcon"
+            @input="handleInput"
+            @paste="handlePaste"
+            @compositionend="handleCompositionEnd"
+            inputmode="text"
+            autocomplete="off"
+            spellcheck="false"
+        />
+        <label class=" !justify-center !font-extralight text-gray-600 text-center">Category
           icon</label>
       </div>
 
-      <div class="w-full !justify-items-center !items-center !justify-center">
+      <div class="w-full !items-center !justify-center">
         <SelectButton
             v-model="categoryType"
             :options="options"
             optionLabel="label"
             optionValue="value"
-            class="!w-full !justify-items-center !items-center !justify-center "
+            class="!w-full  !items-center !justify-center "
         />
       </div>