refactor: make auto import more explicit

components/help/HelpPreview.vue

@@ -30,7 +30,7 @@ const emit = defineEmits<{
     </p>
     {{ $t('help.desc_para3') }}
     <p flex="~ gap-2 wrap" mxa>
-      <template v-for="team of teams" :key="team.github">
+      <template v-for="team of elkTeamMembers" :key="team.github">
         <NuxtLink :href="`https://github.com/sponsors/${team.github}`" target="_blank" external rounded-full transition duration-300 border="~ transparent" hover="scale-105 border-primary">
           <img :src="`/avatars/${team.github}-100x100.png`" :alt="team.display" rounded-full w-15 h-15 height="60" width="60">
         </NuxtLink>

components/publish/PublishAttachment.vue

@@ -34,7 +34,7 @@ const toggleApply = () => {
         text-white px2 py2 rounded-full cursor-pointer
         @click="$emit('remove')"
       >
-        <div i-ri:close-line text-3 :class="[isHydrated && isSmallScreen ? 'text-6' : 'text-3']" />
+        <div i-ri:close-line text-3 text-6 md:text-3 />
       </div>
     </div>
     <div absolute right-2 bottom-2>

components/publish/PublishWidget.vue

@@ -147,7 +147,7 @@ defineExpose({
       >
         <ContentMentionGroup v-if="draft.mentions?.length && shouldExpanded" replying>
           <button v-for="m, i of draft.mentions" :key="m" text-primary hover:color-red @click="draft.mentions?.splice(i, 1)">
-            {{ acctToShortHandle(m) }}
+            {{ accountToShortHandle(m) }}
           </button>
         </ContentMentionGroup>
 

components/user/UserSwitcher.vue

@@ -51,7 +51,7 @@ const clickUser = (user: UserLogin) => {
         :text="$t('user.sign_out_account', [getFullHandle(currentUser.account)])"
         icon="i-ri:logout-box-line rtl-flip"
         w-full
-        @click="signout"
+        @click="signOut"
       />
     </div>
   </div>