From 82bd985142ac68ef404acc63c9fe3f400dfb9062 Mon Sep 17 00:00:00 2001
From: pa <maplenagisa@gmail.com>
Date: Mon, 12 Jan 2026 21:08:18 +0900
Subject: [PATCH] fix styles

---
 .../AvatarDialog/SetAvatarStylesDialog.vue    |   2 +-
 .../AvatarDialog/SetAvatarTagsDialog.vue      |   2 +-
 src/components/dialogs/CustomNavDialog.vue    |   2 +-
 .../GroupMemberModerationDialog.vue           | 146 ++++++++++--------
 .../GroupDialog/GroupPostEditDialog.vue       |  22 +--
 .../dialogs/UserDialog/BioDialog.vue          |   9 +-
 .../UserDialog/EditNoteAndMemoDialog.vue      |  10 +-
 .../WorldDialog/SetWorldTagsDialog.vue        |   4 +-
 .../WorldDialog/WorldAllowedDomainsDialog.vue |   3 +-
 .../input-group/InputGroupTextareaField.vue   |   2 +-
 src/views/PlayerList/PlayerList.vue           |   5 +-
 src/views/Search/Search.vue                   |   2 +-
 .../Settings/components/Tabs/PicturesTab.vue  |  23 +--
 src/views/Tools/Gallery.vue                   |   6 +-
 14 files changed, 129 insertions(+), 109 deletions(-)

diff --git a/src/components/dialogs/AvatarDialog/SetAvatarStylesDialog.vue b/src/components/dialogs/AvatarDialog/SetAvatarStylesDialog.vue
index 87836905..6f4f17fc 100644
--- a/src/components/dialogs/AvatarDialog/SetAvatarStylesDialog.vue
+++ b/src/components/dialogs/AvatarDialog/SetAvatarStylesDialog.vue
@@ -67,7 +67,7 @@
         </template>
 
         <template #footer>
-            <Button variant="secondary" @click="closeSetAvatarStylesDialog">{{
+            <Button variant="secondary" class="mr-2" @click="closeSetAvatarStylesDialog">{{
                 t('dialog.set_avatar_styles.cancel')
             }}</Button>
             <Button @click="saveSetAvatarStylesDialog">
diff --git a/src/components/dialogs/AvatarDialog/SetAvatarTagsDialog.vue b/src/components/dialogs/AvatarDialog/SetAvatarTagsDialog.vue
index aef265b0..262a787b 100644
--- a/src/components/dialogs/AvatarDialog/SetAvatarTagsDialog.vue
+++ b/src/components/dialogs/AvatarDialog/SetAvatarTagsDialog.vue
@@ -90,7 +90,7 @@
             </div>
         </template>
         <template #footer>
-            <Button variant="secondary" @click="closeSetAvatarTagsDialog">{{
+            <Button variant="secondary" class="mr-2" @click="closeSetAvatarTagsDialog">{{
                 t('dialog.set_avatar_tags.cancel')
             }}</Button>
             <Button @click="saveSetAvatarTagsDialog">{{ t('dialog.set_avatar_tags.save') }}</Button>
diff --git a/src/components/dialogs/CustomNavDialog.vue b/src/components/dialogs/CustomNavDialog.vue
index 159239a9..b2ef6df2 100644
--- a/src/components/dialogs/CustomNavDialog.vue
+++ b/src/components/dialogs/CustomNavDialog.vue
@@ -199,7 +199,7 @@
                     {{ t('nav_menu.custom_nav.delete_folder') }}
                 </Button>
                 <div class="folder-editor__footer-spacer"></div>
-                <Button variant="secondary" @click="closeFolderEditor">
+                <Button variant="secondary" class="mr-2" @click="closeFolderEditor">
                     {{ t('nav_menu.custom_nav.cancel') }}
                 </Button>
                 <Button :disabled="folderEditorSaveDisabled" @click="handleFolderEditorSave">
diff --git a/src/components/dialogs/GroupDialog/GroupMemberModerationDialog.vue b/src/components/dialogs/GroupDialog/GroupMemberModerationDialog.vue
index 77284a34..6074dca5 100644
--- a/src/components/dialogs/GroupDialog/GroupMemberModerationDialog.vue
+++ b/src/components/dialogs/GroupDialog/GroupMemberModerationDialog.vue
@@ -790,73 +790,85 @@
             <br />
             <span class="name">{{ t('dialog.group_member_moderation.actions') }}</span>
             <br />
-            <Button
-                variant="outline"
-                :disabled="
-                    Boolean(
-                        !selectedRoles.length ||
-                        progressCurrent ||
-                        !hasGroupPermission(groupMemberModeration.groupRef, 'group-roles-assign')
-                    )
-                "
-                @click="groupMembersAddRoles"
-                >{{ t('dialog.group_member_moderation.add_roles') }}</Button
-            >
-            <Button
-                variant="secondary"
-                :disabled="
-                    Boolean(
-                        !selectedRoles.length ||
-                        progressCurrent ||
-                        !hasGroupPermission(groupMemberModeration.groupRef, 'group-roles-assign')
-                    )
-                "
-                @click="groupMembersRemoveRoles"
-                >{{ t('dialog.group_member_moderation.remove_roles') }}</Button
-            >
-            <Button
-                variant="outline"
-                :disabled="
-                    Boolean(
-                        progressCurrent || !hasGroupPermission(groupMemberModeration.groupRef, 'group-members-manage')
-                    )
-                "
-                @click="groupMembersSaveNote"
-                >{{ t('dialog.group_member_moderation.save_note') }}</Button
-            >
-            <Button
-                variant="outline"
-                :disabled="
-                    Boolean(
-                        progressCurrent || !hasGroupPermission(groupMemberModeration.groupRef, 'group-members-remove')
-                    )
-                "
-                @click="groupMembersKick"
-                >{{ t('dialog.group_member_moderation.kick') }}</Button
-            >
-            <Button
-                variant="outline"
-                :disabled="
-                    Boolean(progressCurrent || !hasGroupPermission(groupMemberModeration.groupRef, 'group-bans-manage'))
-                "
-                @click="groupMembersBan"
-                >{{ t('dialog.group_member_moderation.ban') }}</Button
-            >
-            <Button
-                variant="outline"
-                :disabled="
-                    Boolean(progressCurrent || !hasGroupPermission(groupMemberModeration.groupRef, 'group-bans-manage'))
-                "
-                @click="groupMembersUnban"
-                >{{ t('dialog.group_member_moderation.unban') }}</Button
-            >
-            <span v-if="progressCurrent" style="margin-top: 10px">
-                <el-icon class="is-loading" style="margin-left: 5px; margin-right: 5px"><Loading /></el-icon>
-                {{ t('dialog.group_member_moderation.progress') }} {{ progressCurrent }}/{{ progressTotal }}
-            </span>
-            <Button variant="secondary" v-if="progressCurrent" style="margin-left: 5px" @click="progressTotal = 0">{{
-                t('dialog.group_member_moderation.cancel')
-            }}</Button>
+            <div class="flex gap-2">
+                <Button
+                    variant="outline"
+                    :disabled="
+                        Boolean(
+                            !selectedRoles.length ||
+                            progressCurrent ||
+                            !hasGroupPermission(groupMemberModeration.groupRef, 'group-roles-assign')
+                        )
+                    "
+                    @click="groupMembersAddRoles"
+                    >{{ t('dialog.group_member_moderation.add_roles') }}</Button
+                >
+                <Button
+                    variant="secondary"
+                    :disabled="
+                        Boolean(
+                            !selectedRoles.length ||
+                            progressCurrent ||
+                            !hasGroupPermission(groupMemberModeration.groupRef, 'group-roles-assign')
+                        )
+                    "
+                    @click="groupMembersRemoveRoles"
+                    >{{ t('dialog.group_member_moderation.remove_roles') }}</Button
+                >
+                <Button
+                    variant="outline"
+                    :disabled="
+                        Boolean(
+                            progressCurrent ||
+                            !hasGroupPermission(groupMemberModeration.groupRef, 'group-members-manage')
+                        )
+                    "
+                    @click="groupMembersSaveNote"
+                    >{{ t('dialog.group_member_moderation.save_note') }}</Button
+                >
+                <Button
+                    variant="outline"
+                    :disabled="
+                        Boolean(
+                            progressCurrent ||
+                            !hasGroupPermission(groupMemberModeration.groupRef, 'group-members-remove')
+                        )
+                    "
+                    @click="groupMembersKick"
+                    >{{ t('dialog.group_member_moderation.kick') }}</Button
+                >
+                <Button
+                    variant="outline"
+                    :disabled="
+                        Boolean(
+                            progressCurrent || !hasGroupPermission(groupMemberModeration.groupRef, 'group-bans-manage')
+                        )
+                    "
+                    @click="groupMembersBan"
+                    >{{ t('dialog.group_member_moderation.ban') }}</Button
+                >
+                <Button
+                    variant="outline"
+                    :disabled="
+                        Boolean(
+                            progressCurrent || !hasGroupPermission(groupMemberModeration.groupRef, 'group-bans-manage')
+                        )
+                    "
+                    @click="groupMembersUnban"
+                    >{{ t('dialog.group_member_moderation.unban') }}</Button
+                >
+                <span v-if="progressCurrent" style="margin-top: 10px">
+                    <el-icon class="is-loading" style="margin-left: 5px; margin-right: 5px"><Loading /></el-icon>
+                    {{ t('dialog.group_member_moderation.progress') }} {{ progressCurrent }}/{{ progressTotal }}
+                </span>
+                <Button
+                    variant="secondary"
+                    v-if="progressCurrent"
+                    style="margin-left: 5px"
+                    @click="progressTotal = 0"
+                    >{{ t('dialog.group_member_moderation.cancel') }}</Button
+                >
+            </div>
         </div>
         <group-member-moderation-export-dialog
             v-model:isGroupLogsExportDialogVisible="isGroupLogsExportDialogVisible"
diff --git a/src/components/dialogs/GroupDialog/GroupPostEditDialog.vue b/src/components/dialogs/GroupDialog/GroupPostEditDialog.vue
index 198d9573..e05da586 100644
--- a/src/components/dialogs/GroupDialog/GroupPostEditDialog.vue
+++ b/src/components/dialogs/GroupDialog/GroupPostEditDialog.vue
@@ -89,15 +89,17 @@
             </el-form>
         </div>
         <template #footer>
-            <Button variant="secondary" @click="groupPostEditDialog.visible = false">
-                {{ t('dialog.group_post_edit.cancel') }}
-            </Button>
-            <Button v-if="groupPostEditDialog.postId" @click="editGroupPost">
-                {{ t('dialog.group_post_edit.edit_post') }}
-            </Button>
-            <Button v-else @click="createGroupPost">
-                {{ t('dialog.group_post_edit.create_post') }}
-            </Button>
+            <div class="flex gap-2">
+                <Button variant="secondary" @click="groupPostEditDialog.visible = false">
+                    {{ t('dialog.group_post_edit.cancel') }}
+                </Button>
+                <Button v-if="groupPostEditDialog.postId" @click="editGroupPost">
+                    {{ t('dialog.group_post_edit.edit_post') }}
+                </Button>
+                <Button v-else @click="createGroupPost">
+                    {{ t('dialog.group_post_edit.create_post') }}
+                </Button>
+            </div>
         </template>
         <GallerySelectDialog
             :gallery-select-dialog="gallerySelectDialog"
@@ -107,9 +109,9 @@
 </template>
 
 <script setup>
+    import { InputGroupField, InputGroupTextareaField } from '@/components/ui/input-group';
     import { computed, ref } from 'vue';
     import { Button } from '@/components/ui/button';
-    import { InputGroupField, InputGroupTextareaField } from '@/components/ui/input-group';
     import { Checkbox } from '@/components/ui/checkbox';
     import { toast } from 'vue-sonner';
     import { useI18n } from 'vue-i18n';
diff --git a/src/components/dialogs/UserDialog/BioDialog.vue b/src/components/dialogs/UserDialog/BioDialog.vue
index 82a03adb..f7f5154a 100644
--- a/src/components/dialogs/UserDialog/BioDialog.vue
+++ b/src/components/dialogs/UserDialog/BioDialog.vue
@@ -18,7 +18,7 @@
                 v-for="(link, index) in bioDialog.bioLinks"
                 :key="index"
                 v-model="bioDialog.bioLinks[index]"
-                maxlength="64"
+                :maxlength="64"
                 show-count
                 size="sm"
                 style="margin-top: 5px">
@@ -26,7 +26,9 @@
                     <img :src="getFaviconUrl(link)" style="width: 16px; height: 16px; vertical-align: middle" />
                 </template>
                 <template #actions>
-                    <Button variant="outline" @click="bioDialog.bioLinks.splice(index, 1)" />
+                    <Button variant="ghost" size="icon-sm" @click="bioDialog.bioLinks.splice(index, 1)"
+                        ><Trash2 class="size-4"
+                    /></Button>
                 </template>
             </InputGroupAction>
 
@@ -49,8 +51,9 @@
 </template>
 
 <script setup>
-    import { Button } from '@/components/ui/button';
     import { InputGroupAction, InputGroupTextareaField } from '@/components/ui/input-group';
+    import { Button } from '@/components/ui/button';
+    import { Trash2 } from 'lucide-vue-next';
     import { toast } from 'vue-sonner';
     import { useI18n } from 'vue-i18n';
 
diff --git a/src/components/dialogs/UserDialog/EditNoteAndMemoDialog.vue b/src/components/dialogs/UserDialog/EditNoteAndMemoDialog.vue
index 3e29e2bf..9f966ca8 100644
--- a/src/components/dialogs/UserDialog/EditNoteAndMemoDialog.vue
+++ b/src/components/dialogs/UserDialog/EditNoteAndMemoDialog.vue
@@ -9,7 +9,7 @@
         append-to-body
         @close="cancel">
         <template v-if="!hideUserNotes || (hideUserNotes && hideUserMemos)">
-            <span class="name">{{ t('dialog.user.info.note') }}</span>
+            <span class="name my-2">{{ t('dialog.user.info.note') }}</span>
             <br />
             <InputGroupTextareaField
                 v-model="note"
@@ -18,22 +18,22 @@
                 :rows="6"
                 :placeholder="t('dialog.user.info.note_placeholder')"
                 input-class="extra resize-none"
+                class="my-2"
                 show-count />
         </template>
         <template v-if="!hideUserMemos || (hideUserNotes && hideUserMemos)">
             <span class="name">{{ t('dialog.user.info.memo') }}</span>
-            <br />
             <InputGroupTextareaField
                 v-model="memo"
-                class="extra"
+                class="extra mt-2"
                 :rows="6"
                 :placeholder="t('dialog.user.info.memo_placeholder')"
                 input-class="resize-none min-h-0" />
         </template>
         <template #footer>
             <div class="dialog-footer">
-                <Button variant="secondary" @click="cancel">Cancel</Button>
-                <Button @click="saveChanges"> Confirm </Button>
+                <Button variant="secondary" @click="cancel" class="mr-2">Cancel</Button>
+                <Button @click="saveChanges">Confirm</Button>
             </div>
         </template>
     </el-dialog>
diff --git a/src/components/dialogs/WorldDialog/SetWorldTagsDialog.vue b/src/components/dialogs/WorldDialog/SetWorldTagsDialog.vue
index 59069f11..a70cd975 100644
--- a/src/components/dialogs/WorldDialog/SetWorldTagsDialog.vue
+++ b/src/components/dialogs/WorldDialog/SetWorldTagsDialog.vue
@@ -89,7 +89,7 @@
             <span>{{ t('dialog.new_instance.content_third_person') }}</span>
         </label>
         <template #footer>
-            <div style="display: flex">
+            <div class="flex gap-2">
                 <Button variant="secondary" @click="isVisible = false">
                     {{ t('dialog.set_world_tags.cancel') }}
                 </Button>
@@ -104,8 +104,8 @@
 <script setup>
     import { computed, ref, watch } from 'vue';
     import { Button } from '@/components/ui/button';
-    import { InputGroupTextareaField } from '@/components/ui/input-group';
     import { Checkbox } from '@/components/ui/checkbox';
+    import { InputGroupTextareaField } from '@/components/ui/input-group';
     import { toast } from 'vue-sonner';
     import { useI18n } from 'vue-i18n';
 
diff --git a/src/components/dialogs/WorldDialog/WorldAllowedDomainsDialog.vue b/src/components/dialogs/WorldDialog/WorldAllowedDomainsDialog.vue
index 6df7cad5..6469ccff 100644
--- a/src/components/dialogs/WorldDialog/WorldAllowedDomainsDialog.vue
+++ b/src/components/dialogs/WorldDialog/WorldAllowedDomainsDialog.vue
@@ -13,7 +13,7 @@
                 size="sm"
                 style="margin-top: 5px">
                 <template #actions>
-                    <Button variant="outline" @click="urlList.splice(index, 1)"></Button>
+                    <Button variant="ghost" @click="urlList.splice(index, 1)"><Trash2 /></Button>
                 </template>
             </InputGroupAction>
             <Button size="sm" variant="outline" style="margin-top: 5px" @click="urlList.push('')">
@@ -32,6 +32,7 @@
     import { computed, ref, watch } from 'vue';
     import { Button } from '@/components/ui/button';
     import { InputGroupAction } from '@/components/ui/input-group';
+    import { Trash2 } from 'lucide-vue-next';
     import { toast } from 'vue-sonner';
     import { useI18n } from 'vue-i18n';
 
diff --git a/src/components/ui/input-group/InputGroupTextareaField.vue b/src/components/ui/input-group/InputGroupTextareaField.vue
index cad27e49..5797fed6 100644
--- a/src/components/ui/input-group/InputGroupTextareaField.vue
+++ b/src/components/ui/input-group/InputGroupTextareaField.vue
@@ -68,7 +68,7 @@
         const lineHeight = parseFloat(computedStyle.lineHeight) || 16;
         const paddingTop = parseFloat(computedStyle.paddingTop) || 0;
         const paddingBottom = parseFloat(computedStyle.paddingBottom) || 0;
-        const minRows = autosizeConfig.value.minRows ?? Number(attrs.rows) || 1;
+        const minRows = autosizeConfig.value.minRows ?? (Number(attrs.rows) || 1);
         const maxRows = autosizeConfig.value.maxRows ?? Number.POSITIVE_INFINITY;
         const minHeight = lineHeight * minRows + paddingTop + paddingBottom;
         const maxHeight = lineHeight * maxRows + paddingTop + paddingBottom;
diff --git a/src/views/PlayerList/PlayerList.vue b/src/views/PlayerList/PlayerList.vue
index 6e6d5706..4a521351 100644
--- a/src/views/PlayerList/PlayerList.vue
+++ b/src/views/PlayerList/PlayerList.vue
@@ -275,7 +275,10 @@
         })
     );
 
-    const playerListDisplayData = computed(() => currentInstanceUsersData.value ?? []);
+    const playerListDisplayData = computed(() => {
+        const data = currentInstanceUsersData.value;
+        return Array.isArray(data) ? data.slice() : [];
+    });
 
     const { table: playerListTable } = useVrcxVueTable({
         persistKey: 'playerList',
diff --git a/src/views/Search/Search.vue b/src/views/Search/Search.vue
index 7a684761..0cda4950 100644
--- a/src/views/Search/Search.vue
+++ b/src/views/Search/Search.vue
@@ -9,7 +9,7 @@
                 @input="updateSearchText"
                 @keyup.enter="search" />
             <TooltipWrapper side="bottom" :content="t('view.search.clear_results_tooltip')">
-                <Button class="rounded-full mr-2" size="icon-sm" variant="ghost" @click="handleClearSearch"
+                <Button class="rounded-full ml-2" size="icon" variant="ghost" @click="handleClearSearch"
                     ><Trash2
                 /></Button>
             </TooltipWrapper>
diff --git a/src/views/Settings/components/Tabs/PicturesTab.vue b/src/views/Settings/components/Tabs/PicturesTab.vue
index 140fcc2f..43c1d67f 100644
--- a/src/views/Settings/components/Tabs/PicturesTab.vue
+++ b/src/views/Settings/components/Tabs/PicturesTab.vue
@@ -23,7 +23,7 @@
             :value="screenshotHelperCopyToClipboard"
             @change="setScreenshotHelperCopyToClipboard()"
             :long-label="true" />
-        <Button size="sm" variant="outline" @click="askDeleteAllScreenshotMetadata()">{{
+        <Button size="sm" variant="outline" class="mt-2" @click="askDeleteAllScreenshotMetadata()">{{
             t('view.settings.advanced.advanced.delete_all_screenshot_metadata.button')
         }}</Button>
     </div>
@@ -46,15 +46,18 @@
                 t('view.settings.advanced.advanced.user_generated_content.description')
             }}</span>
         </div>
-        <Button size="sm" variant="outline" @click="openUGCFolder()">{{
-            t('view.settings.advanced.advanced.user_generated_content.folder')
-        }}</Button>
-        <Button size="sm" variant="outline" @click="openUGCFolderSelector()">{{
-            t('view.settings.advanced.advanced.user_generated_content.set_folder')
-        }}</Button>
-        <Button size="sm" variant="outline" @click="resetUGCFolder()" v-if="ugcFolderPath">{{
-            t('view.settings.advanced.advanced.user_generated_content.reset_override')
-        }}</Button>
+        <div class="flex gap-2 mt-2">
+            <Button size="sm" variant="outline" @click="openUGCFolder()">{{
+                t('view.settings.advanced.advanced.user_generated_content.folder')
+            }}</Button>
+            <Button size="sm" variant="outline" @click="openUGCFolderSelector()">{{
+                t('view.settings.advanced.advanced.user_generated_content.set_folder')
+            }}</Button>
+            <Button size="sm" variant="outline" @click="resetUGCFolder()" v-if="ugcFolderPath">{{
+                t('view.settings.advanced.advanced.user_generated_content.reset_override')
+            }}</Button>
+        </div>
+
         <br />
         <br />
         <br />
diff --git a/src/views/Tools/Gallery.vue b/src/views/Tools/Gallery.vue
index 71158bf6..53332c15 100644
--- a/src/views/Tools/Gallery.vue
+++ b/src/views/Tools/Gallery.vue
@@ -554,10 +554,10 @@
     import { computed, onBeforeUnmount, onMounted, ref } from 'vue';
     import { Maximize2, Trash2 } from 'lucide-vue-next';
     import { Button } from '@/components/ui/button';
-    import { InputGroupTextareaField } from '@/components/ui/input-group';
     import { ButtonGroup } from '@/components/ui/button-group';
     import { Checkbox } from '@/components/ui/checkbox';
     import { ElMessageBox } from 'element-plus';
+    import { InputGroupTextareaField } from '@/components/ui/input-group';
     import { VirtualCombobox } from '@/components/ui/virtual-combobox';
     import { storeToRefs } from 'pinia';
     import { toast } from 'vue-sonner';
@@ -1159,8 +1159,4 @@
     .gallery-meta--small {
         font-size: 11px;
     }
-
-    .gallery-page__back {
-        padding-left: 0;
-    }
 </style>