MrUnknownDE/VRCX
1
0
Fork 0
mirror of https://github.com/MrUnknownDE/VRCX.git synced 2026-04-25 17:53:48 +02:00
Code Issues Packages Projects Releases Wiki Activity

use tailwind class

Browse Source
This commit is contained in:
pa
2026-03-08 22:46:26 +09:00
parent be2f07f24e
commit 9b564303a4
85 changed files with 1167 additions and 642 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/views/Settings/components/SimpleSwitch.vue
View File

@@ -25,6 +25,10 @@
const emit = defineEmits(['change']);
/**
*
* @param event
*/
function change(event) {
emit('change', event);
}
@@ -45,7 +49,7 @@
align-items: center;
}
.simple-switch > .switch {
margin-left: 10px;
margin-left: 8px;
}
.simple-switch .tooltip {
margin-left: 3px;

32
src/views/Settings/components/Tabs/AdvancedTab.vue
View File

@@ -76,7 +76,7 @@
</div>
<div class="options-container">
<span class="header">{{ t('view.profile.game_info.header') }}</span>
<div class="px-2.5 overflow-y-auto overflow-x-hidden" style="margin-top: 10px">
<div class="px-2.5 overflow-y-auto overflow-x-hidden mt-2">
<div class="box-border flex items-center p-1.5 text-[13px] cursor-pointer">
<div class="flex-1 overflow-hidden" @click="getVisits">
<span class="block truncate font-medium leading-[18px]">{{
@@ -107,7 +107,7 @@
<div class="options-container">
<span class="header">{{ t('view.settings.advanced.advanced.app_launcher.header') }}</span>
<br />
<Button size="sm" variant="outline" style="margin-top: 5px" @click="openShortcutFolder()">{{
<Button class="mt-1.5" size="sm" variant="outline" @click="openShortcutFolder()">{{
t('view.settings.advanced.advanced.app_launcher.folder')
}}</Button>
<simple-switch
@@ -152,7 +152,7 @@
@change="changeTranslationAPI('VRCX_translationAPI')" />
<div class="options-container-item">
<Button size="sm" variant="outline" @click="showTranslationApiDialog">
<Languages class="h-4 w-4" style="margin-right: 5px" />
<Languages class="h-4 w-4" style="margin-right: 6px" />
{{ t('view.settings.advanced.advanced.translation_api.translation_api_key') }}
</Button>
</div>
@@ -505,18 +505,30 @@
const isLinux = computed(() => LINUX);
/**
*
*/
function openShortcutFolder() {
AppApi.OpenShortcutFolder();
}
/**
*
*/
function showYouTubeApiDialog() {
isYouTubeApiDialogVisible.value = true;
}
/**
*
*/
function showTranslationApiDialog() {
isTranslationApiDialogVisible.value = true;
}
/**
*
*/
function refreshCacheSize() {
cacheSize.cachedUsers = cachedUsers.size;
cacheSize.cachedWorlds = cachedWorlds.size;
@@ -526,6 +538,10 @@
cacheSize.cachedInstances = cachedInstances.size;
}
/**
*
* @param configKey
*/
async function changeYouTubeApi(configKey = '') {
if (configKey === 'VRCX_youtubeAPI') {
advancedSettingsStore.setYouTubeApi();
@@ -538,17 +554,27 @@
updateOpenVR();
}
/**
*
* @param configKey
*/
async function changeTranslationAPI(configKey = '') {
if (configKey === 'VRCX_translationAPI') {
advancedSettingsStore.setTranslationApi();
}
}
/**
*
*/
async function refreshConfigTreeData() {
await authRequest.getConfig();
configTreeData.value = cachedConfig.value;
}
/**
*
*/
function getVisits() {
miscRequest.getVisits().then((args) => {
visits.value = args.json;

28
src/views/Settings/components/Tabs/AppearanceTab.vue
View File

@@ -1,6 +1,6 @@
<template>
<div>
<div class="options-container" style="margin-top: 0">
<div class="options-container mt-0">
<span class="header">{{ t('view.settings.appearance.appearance.header') }}</span>
<div class="options-container-item">
<span class="name">{{ t('view.settings.appearance.appearance.language') }}</span>
@@ -23,8 +23,8 @@
{{ t('view.settings.appearance.appearance.font_family') }}
<TooltipWrapper
class="ml-1.5"
side="top"
style="margin-left: 5px"
:content="t('view.settings.appearance.appearance.font_family_tooltip')">
<Info />
</TooltipWrapper>
@@ -443,6 +443,10 @@
initGetZoomLevel();
/**
*
* @param value
*/
function handleSortFavoritesRadio(value) {
const nextValue = value === 'true';
if (nextValue !== sortFavorites.value) {
@@ -450,6 +454,10 @@
}
}
/**
*
* @param value
*/
function handleInstanceUsersSortAlphabeticalRadio(value) {
const nextValue = value === 'true';
if (nextValue !== instanceUsersSortAlphabetical.value) {
@@ -457,6 +465,10 @@
}
}
/**
*
* @param value
*/
function handleDtHour12Radio(value) {
const nextValue = value === 'true';
if (nextValue !== dtHour12.value) {
@@ -502,6 +514,9 @@
}
});
/**
*
*/
function addTablePageSizeFromInput() {
const raw = String(tablePageSizesSearchTerm.value ?? '').trim();
if (!raw) {
@@ -515,6 +530,9 @@
tablePageSizesSearchTerm.value = '';
}
/**
*
*/
async function initGetZoomLevel() {
const handleWheel = (event) => {
if (event.ctrlKey) {
@@ -528,10 +546,16 @@
getZoomLevel();
}
/**
*
*/
async function getZoomLevel() {
zoomLevel.value = ((await AppApi.GetZoom()) + 10) * 10;
}
/**
*
*/
function setZoomLevel() {
AppApi.SetZoom(zoomLevel.value / 10 - 10);
}

2
src/views/Settings/components/Tabs/DiscordPresenceTab.vue
View File

@@ -1,5 +1,5 @@
<template>
<div class="options-container" style="margin-top: 0">
<div class="options-container mt-0">
<span class="header">{{ t('view.settings.discord_presence.discord_presence.header') }}</span>
<div class="options-container-item">
<span>{{ t('view.settings.discord_presence.discord_presence.description') }}</span>

13
src/views/Settings/components/Tabs/GeneralTab.vue
View File

@@ -1,8 +1,8 @@
<template>
<div>
<div class="options-container" style="margin-top: 0">
<div class="options-container mt-0">
<span class="header">{{ t('view.settings.general.general.header') }}</span>
<div class="px-2.5 overflow-y-auto overflow-x-hidden" style="margin-top: 10px">
<div class="px-2.5 overflow-y-auto overflow-x-hidden mt-2">
<div class="box-border flex items-center p-1.5 text-[13px] cursor-default">
<div class="flex-1 overflow-hidden">
<span class="block truncate font-medium leading-[18px]">{{
@@ -57,12 +57,12 @@
<div v-if="!noUpdater" class="text-sm mt-2 flex flex-col align-baseline">
<span class="name">{{ t('view.settings.general.vrcx_updater.update_action') }}</span>
<ToggleGroup
class="mt-1.5"
type="single"
required
variant="outline"
size="sm"
:model-value="autoUpdateVRCX"
style="margin-top: 5px"
@update:model-value="setAutoUpdateVRCX">
<ToggleGroupItem value="Off">{{
t('view.settings.general.vrcx_updater.auto_update_off')
@@ -124,7 +124,7 @@
<span class="header inline-flex items-center"
>{{ t('view.settings.general.favorites.header') }}
<TooltipWrapper side="top" :content="t('view.settings.general.favorites.header_tooltip')">
<Info style="width: 12px; height: 12px; margin-left: 4px; vertical-align: middle; cursor: help" />
<Info class="ml-1" style="width: 12px; height: 12px; vertical-align: middle; cursor: help" />
</TooltipWrapper>
</span>
<br />
@@ -132,7 +132,7 @@
:model-value="localFavoriteFriendsGroups"
multiple
@update:modelValue="setLocalFavoriteFriendsGroups">
<SelectTrigger style="margin-top: 8px">
<SelectTrigger class="mt-2">
<SelectValue :placeholder="t('view.settings.general.favorites.group_placeholder')" />
</SelectTrigger>
<SelectContent>
@@ -253,6 +253,9 @@
() => import('../../dialogs/OpenSourceSoftwareNoticeDialog.vue')
);
/**
*
*/
function openOSSDialog() {
ossDialog.value = true;
}

22
src/views/Settings/components/Tabs/NotificationsTab.vue
View File

@@ -1,6 +1,6 @@
<template>
<div>
<div class="options-container" style="margin-top: 0">
<div class="options-container mt-0">
<span class="header">{{ t('view.settings.notifications.notifications.header') }}</span>
<div class="options-container-item">
<Button size="sm" variant="outline" @click="showNotyFeedFiltersDialog">{{
@@ -23,6 +23,7 @@
}}</span>
<br />
<ToggleGroup
class="mt-1.5"
type="single"
required
variant="outline"
@@ -34,7 +35,6 @@
!ovrtHudNotifications &&
!ovrtWristNotifications
"
style="margin-top: 5px"
@update:model-value="
setOverlayToast($event);
saveOpenVROption();
@@ -82,7 +82,7 @@
</div>
</template>
<div class="options-container-item">
<span class="name" style="vertical-align: top; padding-top: 10px">{{
<span class="name" style="vertical-align: top; padding-top: 8px">{{
t('view.settings.notifications.notifications.steamvr_notifications.notification_opacity')
}}</span>
<div style="flex: 0 0 300px; width: 300px; max-width: 100%; padding-top: 16px">
@@ -120,9 +120,7 @@
</template>
<template v-else>
<simple-switch
:label="
t('view.settings.notifications.notifications.steamvr_notifications.wayvr_notifications')
"
:label="t('view.settings.notifications.notifications.steamvr_notifications.wayvr_notifications')"
:value="xsNotifications"
@change="
setXsNotifications();
@@ -169,7 +167,7 @@
variant="outline"
size="sm"
:model-value="desktopToast"
style="margin-top: 5px"
style="margin-top: 6px"
@update:model-value="setDesktopToast(String($event))">
<ToggleGroupItem value="Never">{{
t('view.settings.notifications.notifications.conditions.never')
@@ -214,7 +212,7 @@
variant="outline"
size="sm"
:model-value="notificationTTS"
style="margin-top: 5px"
style="margin-top: 6px"
@update:model-value="saveNotificationTTS">
<ToggleGroupItem value="Never">{{
t('view.settings.notifications.notifications.conditions.never')
@@ -260,7 +258,7 @@
:label="t('view.settings.notifications.notifications.text_to_speech.tts_test_placeholder')"
:value="isTestTTSVisible"
@change="isTestTTSVisible = !isTestTTSVisible" />
<div v-if="isTestTTSVisible" style="margin-top: 5px">
<div v-if="isTestTTSVisible" style="margin-top: 6px">
<InputGroupTextareaField
v-model="notificationTTSTest"
:placeholder="t('view.settings.notifications.notifications.text_to_speech.tts_test_placeholder')"
@@ -372,10 +370,16 @@
}
});
/**
*
*/
function showNotyFeedFiltersDialog() {
feedFiltersDialogMode.value = 'noty';
}
/**
*
*/
function showNotificationPositionDialog() {
isNotificationPositionDialogVisible.value = true;
}

8
src/views/Settings/components/Tabs/PicturesTab.vue
View File

@@ -1,6 +1,6 @@
<template>
<!--//- Pictures | Screenshot Helper-->
<div class="options-container" style="margin-top: 0">
<div class="options-container mt-0">
<span class="header">{{ t('view.settings.advanced.advanced.screenshot_helper.header') }}</span>
<div class="options-container-item">
<span class="name">{{ t('view.settings.advanced.advanced.screenshot_helper.description') }}</span>
@@ -41,7 +41,7 @@
<div class="options-container">
<span class="header">{{ t('view.settings.advanced.advanced.user_generated_content.header') }}</span>
<br />
<div class="options-container-item" style="margin-bottom: 5px">
<div class="options-container-item mb-1.5">
<span class="name" style="min-width: 300px">{{
t('view.settings.advanced.advanced.user_generated_content.description')
}}</span>
@@ -61,7 +61,7 @@
<br />
<br />
<br />
<span class="sub-header" style="margin-right: 5px">{{
<span class="sub-header mr-1.5">{{
t('view.settings.advanced.advanced.save_instance_prints_to_file.header')
}}</span>
<TooltipWrapper
@@ -87,7 +87,7 @@
@change="setSaveInstanceStickers()"
:long-label="true" />
<br />
<span class="sub-header" style="margin-right: 5px"
<span class="sub-header mr-1.5"
>{{ t('view.settings.advanced.advanced.save_instance_emoji_to_file.header') }}
</span>
<TooltipWrapper

16
src/views/Settings/components/WristOverlaySettings.vue
View File

@@ -1,5 +1,5 @@
<template>
<div class="options-container" style="margin-top: 0">
<div class="options-container mt-0">
<span class="header">{{ t('view.settings.wrist_overlay.steamvr_wrist_overlay.header') }}</span>
<div class="options-container-item">
<Button
@@ -46,8 +46,7 @@
<RadioGroup
:model-value="openVRAlways ? 'true' : 'false'"
:disabled="!openVR"
class="gap-2 flex"
style="margin-top: 8px"
class="gap-2 flex mt-2"
@update:modelValue="handleOpenVRAlwaysRadio">
<div class="flex items-center space-x-2">
<RadioGroupItem id="openVRAlways-false" value="false" />
@@ -64,8 +63,7 @@
<RadioGroup
:model-value="overlaybutton ? 'true' : 'false'"
:disabled="!openVR || !overlayWrist"
class="gap-2 flex"
style="margin-top: 8px"
class="gap-2 flex mt-2"
@update:modelValue="handleOverlayButtonRadio">
<div class="flex items-center space-x-2">
<RadioGroupItem id="overlaybutton-false" value="false" />
@@ -206,6 +204,10 @@
const { saveOpenVROption } = useVrStore();
/**
*
* @param value
*/
function handleOpenVRAlwaysRadio(value) {
const nextValue = value === 'true';
if (nextValue !== openVRAlways.value) {
@@ -214,6 +216,10 @@
}
}
/**
*
* @param value
*/
function handleOverlayButtonRadio(value) {
const nextValue = value === 'true';
if (nextValue !== overlaybutton.value) {