diff --git a/src/renderer/components/distraction-settings/distraction-settings.css b/src/renderer/components/distraction-settings/distraction-settings.css
new file mode 100644
index 000000000000..d6cefc07134a
--- /dev/null
+++ b/src/renderer/components/distraction-settings/distraction-settings.css
@@ -0,0 +1,5 @@
+@media only screen and (max-width: 800px) {
+  br.hide-on-mobile {
+    display: none;
+  }
+}
diff --git a/src/renderer/components/distraction-settings/distraction-settings.vue b/src/renderer/components/distraction-settings/distraction-settings.vue
index b800757296d3..2603f3022eaa 100644
--- a/src/renderer/components/distraction-settings/distraction-settings.vue
+++ b/src/renderer/components/distraction-settings/distraction-settings.vue
@@ -104,7 +104,7 @@
         />
       </div>
     </div>
-    <br>
+    <br class="hide-on-mobile">
     <ft-flex-box>
       <ft-input-tags
         :label="$t('Settings.Distraction Free Settings.Hide Channels')"
@@ -119,3 +119,4 @@
 </template>
 
 <script src="./distraction-settings.js" />
+<style src="./distraction-settings.css" />
diff --git a/src/renderer/components/ft-input-tags/ft-input-tags.css b/src/renderer/components/ft-input-tags/ft-input-tags.css
index bcce0109030f..d5878a42a620 100644
--- a/src/renderer/components/ft-input-tags/ft-input-tags.css
+++ b/src/renderer/components/ft-input-tags/ft-input-tags.css
@@ -48,3 +48,8 @@
   margin-top: 10px;
 }
 
+@media only screen and (max-width: 576px) {
+  .ft-input-tags-component {
+    width: 100%;
+  }
+}
diff --git a/src/renderer/components/ft-input/ft-input.css b/src/renderer/components/ft-input/ft-input.css
index b503317de3d8..c9b1df41e779 100644
--- a/src/renderer/components/ft-input/ft-input.css
+++ b/src/renderer/components/ft-input/ft-input.css
@@ -114,11 +114,15 @@
   color: #EEEEEE;
 }
 
+.inputWrapper {
+  position: relative;
+}
+
 .inputAction {
   position: absolute;
   margin: 0 3px;
   padding: 10px;
-  top: 5px;
+  top: -8px;
   right: 0;
   border-radius: 100%;
   color: var(--primary-text-color);
@@ -132,20 +136,11 @@
   cursor: pointer;
 }
 
-.inputAction.withLabel {
-  /* If showLabel defined, re-centralize the input button*/
-  top: 34px;
-}
-
 
 .search ::-webkit-calendar-picker-indicator {
   display: none;
 }
 
-.search .inputAction {
-  top: 12px;
-}
-
 .forceTextColor .inputAction {
   color: #EEEEEE;
 }
diff --git a/src/renderer/components/ft-input/ft-input.vue b/src/renderer/components/ft-input/ft-input.vue
index d1408416c8f8..5ced9eea7ab8 100644
--- a/src/renderer/components/ft-input/ft-input.vue
+++ b/src/renderer/components/ft-input/ft-input.vue
@@ -38,32 +38,33 @@
       @keydown.space.prevent="handleClearTextClick"
       @keydown.enter.prevent="handleClearTextClick"
     />
-    <input
-      :id="id"
-      ref="input"
-      v-model="inputData"
-      :list="idDataList"
-      class="ft-input"
-      :type="inputType"
-      :placeholder="placeholder"
-      :disabled="disabled"
-      :spellcheck="spellcheck"
-      @input="e => handleInput(e.target.value)"
-      @focus="handleFocus"
-      @blur="handleInputBlur"
-      @keydown="handleKeyDown"
-    >
-    <font-awesome-icon
-      v-if="showActionButton"
-      :icon="actionButtonIconName"
-      class="inputAction"
-      :class="{
-        enabled: inputDataPresent,
-        withLabel: showLabel
-      }"
-      @click="handleClick"
-    />
-
+    <span class="inputWrapper">
+      <input
+        :id="id"
+        ref="input"
+        v-model="inputData"
+        :list="idDataList"
+        class="ft-input"
+        :type="inputType"
+        :placeholder="placeholder"
+        :disabled="disabled"
+        :spellcheck="spellcheck"
+        @input="e => handleInput(e.target.value)"
+        @focus="handleFocus"
+        @blur="handleInputBlur"
+        @keydown="handleKeyDown"
+      >
+      <font-awesome-icon
+        v-if="showActionButton"
+        :icon="actionButtonIconName"
+        class="inputAction"
+        :class="{
+          enabled: inputDataPresent,
+          withLabel: showLabel
+        }"
+        @click="handleClick"
+      />
+    </span>
     <div class="options">
       <ul
         v-if="inputData !== '' && visibleDataList.length > 0 && searchState.showOptions"