Layout fixes

2026-04-18 22:33:50 +02:00 · 2026-01-14 16:32:10 +13:00
parent fc5afe9e69
commit b51b0a61e8
7 changed files with 58 additions and 52 deletions
--- a/package-lock.json
+++ b/package-lock.json
@@ -106,7 +106,6 @@
            "integrity": "sha512-e7jT4DxYvIDLk1ZHmU/m/mB19rex9sv0c2ftBtjSBv+kVM/902eh0fINUzD7UwLLNR+jU585GxUJ8/EBfAM5fw==",
            "dev": true,
            "license": "MIT",
-            "peer": true,
            "dependencies": {
                "@babel/code-frame": "^7.27.1",
                "@babel/generator": "^7.28.5",
@@ -1264,6 +1263,7 @@
            "dev": true,
            "license": "BSD-2-Clause",
            "optional": true,
+            "peer": true,
            "dependencies": {
                "cross-dirname": "^0.1.0",
                "debug": "^4.3.4",
@@ -1285,6 +1285,7 @@
            "dev": true,
            "license": "MIT",
            "optional": true,
+            "peer": true,
            "dependencies": {
                "graceful-fs": "^4.2.0",
                "jsonfile": "^6.0.1",
@@ -1301,6 +1302,7 @@
            "dev": true,
            "license": "MIT",
            "optional": true,
+            "peer": true,
            "dependencies": {
                "universalify": "^2.0.0"
            },
@@ -1315,6 +1317,7 @@
            "dev": true,
            "license": "MIT",
            "optional": true,
+            "peer": true,
            "engines": {
                "node": ">= 10.0.0"
            }
@@ -5300,7 +5303,6 @@
            "integrity": "sha512-0NgftHUcV4v34VhXm8QBSftKVXtbkBG3ViCjs6+eJ5a6y6Mi/jiFGPc1sC7QK+9BFhWrURE3EOggmWaSxL9OzQ==",
            "dev": true,
            "license": "MIT",
-            "peer": true,
            "dependencies": {
                "@types/lodash": "*"
            }
@@ -6045,7 +6047,6 @@
            "integrity": "sha512-NZyJarBfL7nWwIq+FDL6Zp/yHEhePMNnnJ0y3qfieCrmNvYct8uvtiV41UvlSe6apAfk0fY1FbWx+NwfmpvtTg==",
            "dev": true,
            "license": "MIT",
-            "peer": true,
            "bin": {
                "acorn": "bin/acorn"
            },
@@ -6079,7 +6080,6 @@
            "integrity": "sha512-j3fVLgvTo527anyYyJOGTYJbG+vnnQYvE0m5mmkc1TK+nxAppkCLMIL0aZ4dblVCNoGShhm+kzE4ZUykBoMg4g==",
            "dev": true,
            "license": "MIT",
-            "peer": true,
            "dependencies": {
                "fast-deep-equal": "^3.1.1",
                "fast-json-stable-stringify": "^2.0.0",
@@ -6844,7 +6844,6 @@
                }
            ],
            "license": "MIT",
-            "peer": true,
            "dependencies": {
                "baseline-browser-mapping": "^2.9.0",
                "caniuse-lite": "^1.0.30001759",
@@ -7793,7 +7792,8 @@
            "integrity": "sha512-+R08/oI0nl3vfPcqftZRpytksBXDzOUveBq/NBVx0sUp1axwzPQrKinNx5yd5sxPu8j1wIy8AfnVQ+5eFdha6Q==",
            "dev": true,
            "license": "MIT",
-            "optional": true
+            "optional": true,
+            "peer": true
        },
        "node_modules/cross-env": {
            "version": "10.1.0",
@@ -8094,7 +8094,6 @@
            "integrity": "sha512-ce4Ogns4VMeisIuCSK0C62umG0lFy012jd8LMZ6w/veHUeX4fqfDrGe+HTWALAEwK6JwKP+dhPvizhArSOsFbg==",
            "dev": true,
            "license": "MIT",
-            "peer": true,
            "dependencies": {
                "app-builder-lib": "26.4.0",
                "builder-util": "26.3.4",
@@ -8499,6 +8498,7 @@
            "dev": true,
            "hasInstallScript": true,
            "license": "MIT",
+            "peer": true,
            "dependencies": {
                "@electron/asar": "^3.2.1",
                "debug": "^4.1.1",
@@ -8519,6 +8519,7 @@
            "integrity": "sha512-YJDaCJZEnBmcbw13fvdAM9AwNOJwOzrE4pqMqBq5nFiEqXUqHwlK4B+3pUw6JNvfSPtX05xFHtYy/1ni01eGCw==",
            "dev": true,
            "license": "MIT",
+            "peer": true,
            "dependencies": {
                "graceful-fs": "^4.1.2",
                "jsonfile": "^4.0.0",
@@ -8676,8 +8677,7 @@
            "resolved": "https://registry.npmjs.org/embla-carousel/-/embla-carousel-8.6.0.tgz",
            "integrity": "sha512-SjWyZBHJPbqxHOzckOfo8lHisEaJWmwd23XppYFYVh10bU66/Pn5tkVkbkCMZVdbUE5eTCI2nD8OyIP4Z+uwkA==",
            "dev": true,
-            "license": "MIT",
-            "peer": true
+            "license": "MIT"
        },
        "node_modules/embla-carousel-reactive-utils": {
            "version": "8.6.0",
@@ -8723,6 +8723,17 @@
            "dev": true,
            "license": "MIT"
        },
+        "node_modules/encoding": {
+            "version": "0.1.13",
+            "resolved": "https://registry.npmjs.org/encoding/-/encoding-0.1.13.tgz",
+            "integrity": "sha512-ETBauow1T35Y/WZMkio9jiM0Z5xjHHmJ4XmjZOq1l/dXz3lr2sRn87nJy20RupqSh1F2m3HHPSp8ShIPQJrJ3A==",
+            "dev": true,
+            "license": "MIT",
+            "optional": true,
+            "dependencies": {
+                "iconv-lite": "^0.6.2"
+            }
+        },
        "node_modules/end-of-stream": {
            "version": "1.4.5",
            "resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-1.4.5.tgz",
@@ -8851,7 +8862,6 @@
            "dev": true,
            "hasInstallScript": true,
            "license": "MIT",
-            "peer": true,
            "bin": {
                "esbuild": "bin/esbuild"
            },
@@ -8931,7 +8941,6 @@
            "integrity": "sha512-LEyamqS7W5HB3ujJyvi0HQK/dtVINZvd5mAAp9eT5S/ujByGjiZLCzPcHVzuXbpJDJF/cxwHlfceVUDZ2lnSTw==",
            "dev": true,
            "license": "MIT",
-            "peer": true,
            "dependencies": {
                "@eslint-community/eslint-utils": "^4.8.0",
                "@eslint-community/regexpp": "^4.12.1",
@@ -8992,7 +9001,6 @@
            "integrity": "sha512-82GZUjRS0p/jganf6q1rEO25VSoHH0hKPCTrgillPjdI/3bgBhAE1QzHrHTizjpRvy6pGAvKjDJtk2pF9NDq8w==",
            "dev": true,
            "license": "MIT",
-            "peer": true,
            "bin": {
                "eslint-config-prettier": "bin/cli.js"
            },
@@ -13462,16 +13470,14 @@
            "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
            "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==",
            "dev": true,
-            "license": "MIT",
-            "peer": true
+            "license": "MIT"
        },
        "node_modules/lodash-es": {
            "version": "4.17.21",
            "resolved": "https://registry.npmjs.org/lodash-es/-/lodash-es-4.17.21.tgz",
            "integrity": "sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw==",
            "dev": true,
-            "license": "MIT",
-            "peer": true
+            "license": "MIT"
        },
        "node_modules/lodash-unified": {
            "version": "1.0.3",
@@ -14697,7 +14703,6 @@
            "integrity": "sha512-l7pqLUFTI/+ESXn6k3nu30ZIzW5E2WZF/LaHJEpoq6ElcLD+wduZoB2kBN19du6K/4FDpPMazY2wJr+IndBtQw==",
            "dev": true,
            "license": "MIT",
-            "peer": true,
            "dependencies": {
                "@vue/devtools-api": "^7.7.7"
            },
@@ -14868,6 +14873,7 @@
            "dev": true,
            "license": "MIT",
            "optional": true,
+            "peer": true,
            "dependencies": {
                "commander": "^9.4.0"
            },
@@ -14885,6 +14891,7 @@
            "dev": true,
            "license": "MIT",
            "optional": true,
+            "peer": true,
            "engines": {
                "node": "^12.20.0 || >=14"
            }
@@ -14905,7 +14912,6 @@
            "integrity": "sha512-v6UNi1+3hSlVvv8fSaoUbggEM5VErKmmpGA7Pl3HF8V6uKY7rvClBOJlH6yNwQtfTueNkGVpOv/mtWL9L4bgRA==",
            "dev": true,
            "license": "MIT",
-            "peer": true,
            "bin": {
                "prettier": "bin/prettier.cjs"
            },
@@ -15349,6 +15355,7 @@
            "deprecated": "Rimraf versions prior to v4 are no longer supported",
            "dev": true,
            "license": "ISC",
+            "peer": true,
            "dependencies": {
                "glob": "^7.1.3"
            },
@@ -15363,6 +15370,7 @@
            "deprecated": "Glob versions prior to v9 are no longer supported",
            "dev": true,
            "license": "ISC",
+            "peer": true,
            "dependencies": {
                "fs.realpath": "^1.0.0",
                "inflight": "^1.0.4",
@@ -15384,6 +15392,7 @@
            "integrity": "sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==",
            "dev": true,
            "license": "ISC",
+            "peer": true,
            "dependencies": {
                "brace-expansion": "^1.1.7"
            },
@@ -17221,6 +17230,7 @@
            "integrity": "sha512-yYrrsWnrXMcdsnu/7YMYAofM1ktpL5By7vZhf15CrXijWWrEYZks5AXBudalfSWJLlnen/QUJUB5aoB0kqZUGA==",
            "dev": true,
            "license": "MIT",
+            "peer": true,
            "dependencies": {
                "mkdirp": "^0.5.1",
                "rimraf": "~2.6.2"
@@ -17284,6 +17294,7 @@
            "integrity": "sha512-FP+p8RB8OWpF3YZBCrP5gtADmtXApB5AMLn+vdyA+PyxCjrCs00mjyUozssO33cwDeT3wNGdLxJ5M//YqtHAJw==",
            "dev": true,
            "license": "MIT",
+            "peer": true,
            "dependencies": {
                "minimist": "^1.2.6"
            },
@@ -17402,7 +17413,6 @@
            "integrity": "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==",
            "dev": true,
            "license": "MIT",
-            "peer": true,
            "engines": {
                "node": ">=12"
            },
@@ -17961,7 +17971,6 @@
            "integrity": "sha512-w+N7Hifpc3gRjZ63vYBXA56dvvRlNWRczTdmCBBa+CotUzAPf5b7YMdMR/8CQoeYE5LX3W4wj6RYTgonm1b9DA==",
            "dev": true,
            "license": "MIT",
-            "peer": true,
            "dependencies": {
                "esbuild": "^0.27.0",
                "fdir": "^6.5.0",
@@ -18055,7 +18064,6 @@
            "integrity": "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==",
            "dev": true,
            "license": "MIT",
-            "peer": true,
            "engines": {
                "node": ">=12"
            },
@@ -18069,7 +18077,6 @@
            "integrity": "sha512-SJ/NTccVyAoNUJmkM9KUqPcYlY+u8OVL1X5EW9RIs3ch5H2uERxyyIUI4MRxVCSOiEcupX9xNGde1tL9ZKpimA==",
            "dev": true,
            "license": "MIT",
-            "peer": true,
            "dependencies": {
                "@vue/compiler-dom": "3.5.26",
                "@vue/compiler-sfc": "3.5.26",
@@ -18690,7 +18697,6 @@
            "integrity": "sha512-gzUt/qt81nXsFGKIFcC3YnfEAx5NkunCfnDlvuBSSFS02bcXu4Lmea0AFIUwbLWxWPx3d9p8S5QoaujKcNQxcQ==",
            "dev": true,
            "license": "MIT",
-            "peer": true,
            "funding": {
                "url": "https://github.com/sponsors/colinhacks"
            }
--- a/src/components/dialogs/GroupDialog/GroupMemberModerationDialog.vue
+++ b/src/components/dialogs/GroupDialog/GroupMemberModerationDialog.vue
@@ -113,7 +113,6 @@
                            :placeholder="t('dialog.group.members.search')"
                            style="margin-top: 10px; margin-bottom: 10px"
                            @input="groupMembersSearch" />
-                        <br />
                        <Button size="sm" variant="outline" @click="selectAllGroupMembers">{{
                            t('dialog.group_member_moderation.select_all')
                        }}</Button>
@@ -150,7 +149,6 @@
                            size="sm"
                            :placeholder="t('dialog.group.members.search')"
                            style="margin-top: 10px; margin-bottom: 10px" />
-                        <br />
                        <Button size="sm" variant="outline" @click="selectAllGroupBans">{{
                            t('dialog.group_member_moderation.select_all')
                        }}</Button>
@@ -237,6 +235,7 @@
                                            !hasGroupPermission(groupMemberModeration.groupRef, 'group-invites-manage')
                                        )
                                    "
+                                    class="mr-2"
                                    @click="groupMembersAcceptInviteRequest"
                                    >{{ t('dialog.group_member_moderation.accept_join_requests') }}</Button
                                >
@@ -248,6 +247,7 @@
                                            !hasGroupPermission(groupMemberModeration.groupRef, 'group-invites-manage')
                                        )
                                    "
+                                    class="mr-2"
                                    @click="groupMembersRejectInviteRequest"
                                    >{{ t('dialog.group_member_moderation.reject_join_requests') }}</Button
                                >
@@ -284,7 +284,7 @@
                                    :total-items="groupBlockedModerationTotalItems" />
                                <br />
                                <Button
-                                    variant="secondary"
+                                    variant="outline"
                                    :disabled="
                                        Boolean(
                                            progressCurrent ||
@@ -362,13 +362,13 @@
            <InputGroupField
                v-model="selectUserId"
                size="sm"
-                style="margin-top: 5px; width: 340px"
+                style="margin-top: 5px"
                :placeholder="t('dialog.group_member_moderation.user_id_placeholder')"
                clearable />
            <Button
                size="sm"
                variant="outline"
-                style="margin-top: 5px; margin-left: 5px"
+                style="margin-top: 10px"
                :disabled="!selectUserId"
                @click="selectGroupMemberUserId"
                >{{ t('dialog.group_member_moderation.select_user') }}</Button
@@ -539,8 +539,8 @@
    import { useI18n } from 'vue-i18n';

    import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '../../ui/select';
-    import { debounce, formatDateFilter, hasGroupPermission, userImage, userImageFull } from '../../../shared/utils';
    import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger } from '../../ui/dropdown-menu';
+    import { debounce, hasGroupPermission, userImage, userImageFull } from '../../../shared/utils';
    import { useAppearanceSettingsStore, useGalleryStore, useGroupStore, useUserStore } from '../../../stores';
    import { groupDialogFilterOptions, groupDialogSortingOptions } from '../../../shared/constants';
    import { groupRequest, userRequest } from '../../../api';
--- a/src/views/Favorites/components/FavoritesAvatarLocalHistoryItem.vue
+++ b/src/views/Favorites/components/FavoritesAvatarLocalHistoryItem.vue
@@ -19,28 +19,28 @@
                            size="icon-sm"
                            variant="outline"
                            :disabled="currentUser.currentAvatar === favorite.id"
-                            class="favorites-search-card__action-btn rounded-full"
+                            class="favorites-search-card__action-btn rounded-full text-xs h-6 w-6"
                            @click.stop="selectAvatarWithConfirmation(favorite.id)">
-                            <Check
-                        /></Button>
+                            <i class="ri-check-line"></i
+                        ></Button>
                    </TooltipWrapper>
                </div>
                <div class="favorites-search-card__action">
-                    <TooltipWrapper side="bottom" :content="t('view.favorite.favorite_tooltip')">
+                    <TooltipWrapper side="bottom" :content="t('view.favorite.edit_favorite_tooltip')">
                        <Button
                            v-if="favoriteExists"
                            size="icon-sm"
                            variant="outline"
-                            class="favorites-search-card__action-btn rounded-full"
+                            class="favorites-search-card__action-btn rounded-full text-xs h-6 w-6"
                            @click.stop="showFavoriteDialog('avatar', favorite.id)">
-                            <Star />
+                            <i class="ri-star-line"></i>
                        </Button>
                        <Button
-                            else
+                            v-else
                            size="icon-sm"
-                            class="favorites-search-card__action-btn rounded-full"
+                            class="favorites-search-card__action-btn rounded-full text-xs h-6 w-6"
                            @click.stop="showFavoriteDialog('avatar', favorite.id)">
-                            <Star />
+                            <i class="ri-star-line"></i>
                        </Button>
                    </TooltipWrapper>
                </div>
--- a/src/views/Favorites/components/FavoritesWorldItem.vue
+++ b/src/views/Favorites/components/FavoritesWorldItem.vue
@@ -83,7 +83,7 @@
                                    variant="destructive"
                                    class="favorites-search-card__action-btn rounded-full text-xs h-6 w-6"
                                    @click.stop="handleDeleteFavorite"
-                                    ><i class="ri-star-line"></i
+                                    ><i class="ri-delete-bin-line"></i
                                ></Button>
                            </TooltipWrapper>
                            <TooltipWrapper v-else side="top" :content="t('view.favorite.edit_favorite_tooltip')">
@@ -92,7 +92,7 @@
                                    variant="outline"
                                    class="favorites-search-card__action-btn rounded-full text-xs h-6 w-6"
                                    @click.stop="showFavoriteDialog('world', favorite.id)"
-                                    ><i class="ri-delete-bin-line"></i
+                                    ><i class="ri-star-line"></i
                                ></Button>
                            </TooltipWrapper>
                        </div>
--- a/src/views/FriendList/FriendList.vue
+++ b/src/views/FriendList/FriendList.vue
@@ -12,8 +12,8 @@
                :on-page-size-change="handlePageSizeChange"
                :on-row-click="handleRowClick">
                <template #toolbar>
-                    <div style="display: flex; align-items: center; justify-content: space-between">
-                        <div style="flex: none; margin-right: 10px; display: flex; align-items: center">
+                    <div class="flex items-center justify-between">
+                        <div class="flex flex-none mr-2 items-center">
                            <TooltipWrapper side="bottom" :content="t('view.friend_list.favorites_only_tooltip')">
                                <Switch
                                    v-model="friendsListSearchFilterVIP"
@@ -23,7 +23,7 @@
                                multiple
                                :model-value="Array.isArray(friendsListSearchFilters) ? friendsListSearchFilters : []"
                                @update:modelValue="handleFriendListFilterChange">
-                                <SelectTrigger style="margin: 0 10px; width: 150px">
+                                <SelectTrigger class="mx-2 w-[150px]">
                                    <SelectValue :placeholder="t('view.friend_list.filter_placeholder')" />
                                </SelectTrigger>
                                <SelectContent>
@@ -49,24 +49,24 @@
                                v-model="friendsListSearch"
                                :placeholder="t('view.friend_list.search_placeholder')"
                                clearable
-                                style="width: 250px"
+                                class="w-[250px]"
                                @change="friendsListSearchChange" />
                        </div>
                        <div class="flex items-center">
-                            <div v-if="friendsListBulkUnfriendMode" class="inline-block mr-10">
+                            <div v-if="friendsListBulkUnfriendMode" class="inline-block mr-2">
                                <Button variant="outline" @click="showBulkUnfriendSelectionConfirm">
                                    {{ t('view.friend_list.bulk_unfriend_selection') }}
                                </Button>
                                <!-- el-button(size="small" @click="showBulkUnfriendAllConfirm" style="margin-right:5px") Bulk Unfriend All-->
                            </div>
-                            <div class="flex items-center mr-3">
+                            <div class="flex items-center mr-2">
                                <span class="name mr-2 text-xs">{{ t('view.friend_list.bulk_unfriend') }}</span>
                                <Switch
                                    v-model="friendsListBulkUnfriendMode"
                                    @update:modelValue="toggleFriendsListBulkUnfriendMode" />
                            </div>
                            <div class="flex items-center">
-                                <Button variant="outline" @click="openChartsTab">
+                                <Button variant="outline" class="mr-2" @click="openChartsTab">
                                    {{ t('view.friend_list.load_mutual_friends') }}
                                </Button>

--- a/src/views/Settings/components/WristOverlaySettings.vue
+++ b/src/views/Settings/components/WristOverlaySettings.vue
@@ -12,12 +12,12 @@
        </div>
        <div class="options-container-item">
            <span>{{ t('view.settings.wrist_overlay.steamvr_wrist_overlay.description') }}</span>
-            <br />
-            <br />
+        </div>
+        <div class="options-container-item">
            <span>{{ t('view.settings.wrist_overlay.steamvr_wrist_overlay.grip') }}</span>
-            <br />
+        </div>
+        <div class="options-container-item">
            <span>{{ t('view.settings.wrist_overlay.steamvr_wrist_overlay.menu') }}</span>
-            <br />
        </div>
        <simple-switch
            :label="t('view.settings.wrist_overlay.steamvr_wrist_overlay.steamvr_overlay')"
--- a/src/views/Settings/dialogs/registryBackupColumns.jsx
+++ b/src/views/Settings/dialogs/registryBackupColumns.jsx
@@ -45,7 +45,7 @@ export const createColumns = ({ onRestore, onSaveToFile, onDelete }) => [
        id: 'action',
        header: () => t('dialog.registry_backup.action'),
        enableSorting: false,
-        size: 90,
+        size: 120,
        meta: {
            tdClass: 'text-right'
        },