chore(ui): improve ui consistency

packages/hoppscotch-app/components/collections/ImportExport.vue

@@ -78,22 +78,7 @@
       </span>
     </template>
     <template #body>
-      <div v-if="mode == 'import_export'" class="flex flex-col space-y-2">
-        <SmartItem
-          v-tippy="{ theme: 'tooltip' }"
-          :title="$t('action.replace_current')"
-          svg="file"
-          :label="$t('action.replace_json')"
-          @click.native="openDialogChooseFileToReplaceWith"
-        />
-        <input
-          ref="inputChooseFileToReplaceWith"
-          class="input"
-          type="file"
-          style="display: none"
-          accept="application/json"
-          @change="replaceWithJSON"
-        />
+      <div v-if="mode == 'import_export'" class="flex flex-col space-y-2 px-2">
         <SmartItem
           v-tippy="{ theme: 'tooltip' }"
           :title="$t('action.preserve_current')"
@@ -117,6 +102,22 @@
           :label="$t('import.from_my_collections')"
           @click.native="mode = 'import_from_my_collections'"
         />
+        <SmartItem
+          v-tippy="{ theme: 'tooltip' }"
+          :title="$t('action.replace_current')"
+          svg="file"
+          :label="$t('action.replace_json')"
+          @click.native="openDialogChooseFileToReplaceWith"
+        />
+        <input
+          ref="inputChooseFileToReplaceWith"
+          class="input"
+          type="file"
+          style="display: none"
+          accept="application/json"
+          @change="replaceWithJSON"
+        />
+        <hr />
         <SmartItem
           v-tippy="{ theme: 'tooltip' }"
           :title="$t('action.download_file')"