improve(ui): tuning

html/src/app.js

@@ -7923,6 +7923,10 @@ speechSynthesis.getVoices();
         'VRCX_notificationTTSNickName',
         false
     );
+
+    // It's not necessary to store it in configRepo because it's rarely used.
+    $app.data.isTestTTSVisible = false;
+    
     $app.data.notificationTTSVoice = await configRepository.getString(
         'VRCX_notificationTTSVoice',
         '0'

html/src/mixins/dialogs/feedFilters.pug

@@ -246,7 +246,7 @@ mixin feedFilters()
                         el-radio-button(label="On") {{ $t('dialog.shared_feed_filters.on') }}
         template(#footer)
             el-button(type="small" @click="resetSharedFeedFilters") {{ $t('dialog.shared_feed_filters.reset') }}
-            el-button(size="small" style="margin-left:10px" @click="notyFeedFiltersDialog.visible = false") {{ $t('dialog.shared_feed_filters.close') }}
+            el-button(size="small" type="primary" style="margin-left:10px" @click="notyFeedFiltersDialog.visible = false") {{ $t('dialog.shared_feed_filters.close') }}
 
     //- dialog: wrist feed filters
     el-dialog.x-dialog(:before-close="beforeDialogClose" @mousedown.native="dialogMouseDown" @mouseup.native="dialogMouseUp" ref="wristFeedFiltersDialog" :visible.sync="wristFeedFiltersDialog.visible" :title="$t('dialog.shared_feed_filters.wrist')" width="550px")

html/src/mixins/tabs/favorites.pug

@@ -1,11 +1,11 @@
 mixin favoritesTab()            
     .x-container(v-show="$refs.menu && $refs.menu.activeIndex === 'favorite'")
-        div(style="font-size:13px;position:absolute;right:0;z-index:1;margin-right:15px")
+        div(style="font-size:13px;position:absolute;display:flex;right:0;z-index:1;margin-right:15px")
             div(v-if="editFavoritesMode" style="display:inline-block;margin-right:10px")
                 el-button(size="small" @click="clearBulkFavoriteSelection ") {{ $t('view.favorite.clear') }}
                 el-button(size="small" @click="bulkCopyFavoriteSelection") {{ $t('view.favorite.copy') }}
                 el-button(size="small" @click="showBulkUnfavoriteSelectionConfirm") {{ $t('view.favorite.bulk_unfavorite') }}
-            div(style="display:inline-block;margin-right:10px")
+            div(style="display:flex;align-items: center;margin-right:10px")
                 span.name {{ $t('view.favorite.edit_mode') }}
                 el-switch(v-model="editFavoritesMode" style="margin-left:5px")
             el-tooltip(placement="bottom" :content="$t('view.favorite.refresh_tooltip')" :disabled="hideTooltips")
@@ -92,7 +92,7 @@ mixin favoritesTab()
                         template(slot="title")
                             div(style="display:flex;align-items:center;")
                                 span(v-text="group.displayName ? group.displayName : group.name" style="font-weight:bold;font-size:14px;margin-left:10px")
-                                el-tag(style="margin-left:5px" size="mini" :type="userFavoriteWorldsStatusForFavTab(group.visibility)" effect="plain") {{ group.visibility.charAt(0).toUpperCase() + group.visibility.slice(1) }}
+                                el-tag(style="margin:1px 0 0 5px" size="mini" :type="userFavoriteWorldsStatusForFavTab(group.visibility)" effect="plain") {{ group.visibility.charAt(0).toUpperCase() + group.visibility.slice(1) }}
                                 span(style="color:#909399;font-size:12px;margin-left:10px") {{ group.count }}/{{ group.capacity }}
                                 el-tooltip(placement="top" :content="$t('view.favorite.visibility_tooltip')" :disabled="hideTooltips")
                                     el-dropdown(trigger="click" @click.native.stop size="mini" style="margin-left:10px")

html/src/mixins/tabs/feed.pug

@@ -3,7 +3,7 @@ mixin feedTab()
         data-tables(v-bind="feedTable" v-loading="feedTable.loading")
             template(#tool)
                 div(style="margin:0 0 10px;display:flex;align-items:center")
-                    div(style="flex:none;margin-right:10px")
+                    div(style="flex:none;margin-right:10px;display:flex;align-items:center;")
                         el-tooltip(placement="bottom" :content="$t('view.feed.favorites_only_tooltip')" :disabled="hideTooltips")
                             el-switch(v-model="feedTable.vip" @change="feedTableLookup" active-color="#13ce66")
                     el-select(v-model="feedTable.filter" @change="feedTableLookup" multiple clearable style="flex:1;height:40px;" :placeholder="$t('view.feed.filter_placeholder')")

html/src/mixins/tabs/friendsList.pug

@@ -18,7 +18,7 @@ mixin friendsListTab()
                     el-tooltip(placement="top" :content="$t('view.friend_list.load_tooltip')" :disabled="hideTooltips")
                         el-button(@click="friendsListLoadUsers" size="mini" icon="el-icon-refresh-left" circle style="margin-left:5px")
             div(style="margin:10px 0 0 10px;display:flex;align-items:center")
-                div(style="flex:none;margin-right:10px")
+                div(style="flex:none;margin-right:10px;display:flex;align-items:center;")
                     el-tooltip(placement="bottom" :content="$t('view.friend_list.favorites_only_tooltip')" :disabled="hideTooltips")
                         el-switch(v-model="friendsListSearchFilterVIP" @change="friendsListSearchChange" active-color="#13ce66")
                 el-input(v-model="friendsListSearch" :placeholder="$t('view.friend_list.search_placeholder')" @change="friendsListSearchChange" clearable style="flex:1")

html/src/mixins/tabs/gameLog.pug

@@ -3,7 +3,7 @@ mixin gameLogTab()
         data-tables(v-bind="gameLogTable" v-loading="gameLogTable.loading")
             template(#tool)
                 div(style="margin:0 0 10px;display:flex;align-items:center")
-                    div(style="flex:none;margin-right:10px")
+                    div(style="flex:none;margin-right:10px;display:flex;align-items:center;")
                         el-tooltip(placement="bottom" :content="$t('view.feed.favorites_only_tooltip')" :disabled="hideTooltips")
                             el-switch(v-model="gameLogTable.vip" @change="gameLogTableLookup" active-color="#13ce66")
                     el-select(v-model="gameLogTable.filter" @change="gameLogTableLookup" multiple clearable style="flex:1" :placeholder="$t('view.game_log.filter_placeholder')")

html/src/mixins/tabs/profile.pug

@@ -21,13 +21,13 @@ mixin profileTab()
                     .detail
                         span.name {{ $t('view.profile.profile.v_bucks') }}
                         span.extra {{ API.currentUser.$vbucks ?? $t('view.profile.profile.refresh') }}
-            div
+            div(style="margin-top:10px")
-                el-button(size="small" icon="el-icon-switch-button" @click="logout()" style="margin-left:0;margin-right:5px;margin-top:10px") {{ $t('view.profile.profile.logout') }}
+                el-button(size="small" type="danger" plain icon="el-icon-switch-button" @click="logout()" style="margin-right:5px;background:#fef0f0 !important;border-color:#fbc4c4 !important;") {{ $t('view.profile.profile.logout') }}
-                el-button(size="small" icon="el-icon-picture-outline" @click="showGalleryDialog()" style="margin-left:0;margin-right:5px;margin-top:10px") {{ $t('view.profile.profile.manage_gallery_icon') }}
+                el-button(size="small" icon="el-icon-picture-outline" @click="showGalleryDialog()" style="margin-right:5px") {{ $t('view.profile.profile.manage_gallery_icon') }}
-                el-button(size="small" icon="el-icon-printer" @click="showExportFriendsListDialog()" style="margin-left:0;margin-right:5px;margin-top:10px") {{ $t('view.profile.profile.export_friend_list') }}
+                el-button(size="small" icon="el-icon-printer" @click="showExportFriendsListDialog()" style="margin-right:5px") {{ $t('view.profile.profile.export_friend_list') }}
-                el-button(size="small" icon="el-icon-user" @click="showExportAvatarsListDialog()" style="margin-left:0;margin-right:5px;margin-top:10px") {{ $t('view.profile.profile.export_own_avatars') }}
+                el-button(size="small" icon="el-icon-user" @click="showExportAvatarsListDialog()" style="margin-right:5px") {{ $t('view.profile.profile.export_own_avatars') }}
-                el-button(size="small" icon="el-icon-chat-dot-round" @click="showDiscordNamesDialog()" style="margin-left:0;margin-right:5px;margin-top:10px") {{ $t('view.profile.profile.discord_names') }}
+                el-button(size="small" icon="el-icon-chat-dot-round" @click="showDiscordNamesDialog()" style="margin-right:5px") {{ $t('view.profile.profile.discord_names') }}
-                el-button(size="small" icon="el-icon-document-copy" @click="showNoteExportDialog()" style="margin-left:0;margin-right:5px;margin-top:10px") {{ $t('view.profile.profile.export_notes') }}
+                el-button(size="small" icon="el-icon-document-copy" @click="showNoteExportDialog()" style="margin-right:5px") {{ $t('view.profile.profile.export_notes') }}
         div.options-container
             span.header {{ $t('view.profile.game_info.header') }}
             .x-friend-list(style="margin-top:10px")

html/src/mixins/tabs/settings.pug

@@ -394,8 +394,11 @@ mixin settingsTab()
                         span.name {{ $t('view.settings.notifications.notifications.text_to_speech.use_memo_nicknames') }}
                         el-switch(v-model="notificationTTSNickName" @change="saveOpenVROption" :disabled="notificationTTS === 'Never'")
                     div.options-container-item
-                        el-input(type="textarea" v-model="notificationTTSTest" :placeholder="$t('view.settings.notifications.notifications.text_to_speech.tts_test_placeholder')" :rows="1" style="width:175px;display:inline-block")
+                        span.name {{ $t('view.settings.notifications.notifications.text_to_speech.tts_test_placeholder') }}
-                        el-button(size="small" icon="el-icon-video-play" @click="testNotificationTTS") {{ $t('view.settings.notifications.notifications.text_to_speech.play') }}
+                        el-switch(v-model="isTestTTSVisible")
+                        div(v-if="isTestTTSVisible" style="margin-top:5px")
+                            el-input(type="textarea" v-model="notificationTTSTest" :placeholder="$t('view.settings.notifications.notifications.text_to_speech.tts_test_placeholder')" :rows="1" style="width:175px;display:inline-block")
+                            el-button(size="small" icon="el-icon-video-play" @click="testNotificationTTS" style="margin-top:5px") {{ $t('view.settings.notifications.notifications.text_to_speech.play') }}
             //- Wrist Overlay Tab
             el-tab-pane(:label="$t('view.settings.category.wrist_overlay')")
                 //- Wrist Overlay | SteamVR Wrist Overlay