fix: extraneous spaces in locale-group

src/common/ui/locale-group.vue

@@ -1,16 +1,15 @@
-<template>
-  <span>
-    {{parts[0]}}
-    <slot></slot>
-    {{parts[1]}}
-  </span>
-</template>
+<!-- Using a single line to avoid extraneous spaces exposed by white-space:pre -->
+<template><span v-if="span">{{parts[0]}}<slot/>{{parts[1]}}</span
+><template v-else>{{parts[0]}}<slot/>{{parts[1]}}</template></template>
 
 <script setup>
 import { computed } from 'vue';
 import { i18n } from '@/common';
 
 const SEP = '\x02';
-const props = defineProps(['i18nKey']);
+const props = defineProps({
+  i18nKey: String,
+  span: Boolean,
+});
 const parts = computed(() => i18n(props.i18nKey, [SEP]).split(SEP));
 </script>

src/common/ui/settings-popup.vue

@@ -171,8 +171,6 @@ onMounted(() => {
   display: flex;
   flex-wrap: wrap;
   align-items: center;
-  > span:first-child {
-    white-space: pre-wrap;
-  }
+  white-space: pre-wrap;
 }
 </style>

src/options/views/tab-installed.vue

@@ -62,7 +62,7 @@
         </template>
         <div v-else class="ml-2" v-text="i18n('headerRecycleBin')" />
         <div class="flex-auto"></div>
-        <LocaleGroup i18n-key="labelFilterSort" class="ml-1">
+        <locale-group i18n-key="sortOrder" class="ml-1" span>
           <select :value="filters.sort" @change="handleOrderChange" class="h-100">
             <option
               v-for="(option, name) in filterOptions.sort"
@@ -71,7 +71,7 @@
               :value="name">
             </option>
           </select>
-        </LocaleGroup>
+        </locale-group>
         <Dropdown align="right" class="filter-sort">
           <Tooltip :content="i18n('labelSettings')" placement="bottom">
             <a class="btn-ghost" tabindex="0">

src/options/views/tab-settings/index.vue

@@ -72,8 +72,8 @@
             </tooltip>
           </label>
         </div>
-        <div>
-          <locale-group i18n-key="labelExposeStatus" class="flex flex-col">
+        <div class="flex flex-col">
+          <locale-group i18n-key="labelExposeStatus">
             <setting-check v-for="([key, host]) in expose" :key="host"
                            :name="`expose.${key}`" class="ml-2 mr-1c valign-tb">
               <span v-text="host" />