MrUnknownDE/VRCX
1
0
Fork 0
mirror of https://github.com/MrUnknownDE/VRCX.git synced 2026-04-18 22:33:50 +02:00
Code Issues Packages Projects Releases Wiki Activity

refactor css

Browse Source
This commit is contained in:
pa
2026-03-08 21:54:29 +09:00
parent 8c21ecd9f0
commit 47807db8cb
18 changed files with 150 additions and 221 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
src/components/InstanceActionBar.vue
View File

@@ -380,12 +380,3 @@
immediate: true
});
</script>
<style scoped>
.inline-block {
display: inline-block;
}
.ml-5 {
margin-left: 5px;
}
</style>

8
src/components/Location.vue
View File

@@ -1,6 +1,6 @@
<template>
<div class="cursor-pointer">
<div v-if="!text" class="transparent">-</div>
<div v-if="!text" class="text-transparent">-</div>
<div v-show="text" class="flex items-center">
<div v-if="region" :class="['flags', 'mr-1.5', 'shrink-0', region]"></div>
<TooltipWrapper :content="tooltipContent" :disabled="tooltipDisabled" :delay-duration="300" side="top">
@@ -293,9 +293,3 @@
showGroupDialog(L.groupId);
}
</script>
<style scoped>
.transparent {
color: transparent;
}
</style>

6
src/components/LocationWorld.vue
View File

@@ -129,9 +129,3 @@
groupStore.showGroupDialog(L.groupId);
}
</script>
<style scoped>
.inline-block {
display: inline-block;
}
</style>

2
src/components/__tests__/Location.test.js
View File

@@ -177,7 +177,7 @@ describe('Location.vue', () => {
test('shows dash placeholder when location is empty', () => {
const wrapper = mountLocation({ location: '' });
const placeholder = wrapper.find('.transparent');
const placeholder = wrapper.find('.text-transparent');
expect(placeholder.exists()).toBe(true);
});
});

108
src/components/dialogs/AvatarDialog/SetAvatarStylesDialog.vue
View File

@@ -1,9 +1,11 @@
<template>
<Dialog
:open="setAvatarStylesDialog.visible"
@update:open="(open) => {
if (!open) closeSetAvatarStylesDialog();
}">
@update:open="
(open) => {
if (!open) closeSetAvatarStylesDialog();
}
">
<DialogContent class="x-dialog sm:max-w-100">
<DialogHeader>
<DialogTitle>{{ t('dialog.set_avatar_styles.header') }}</DialogTitle>
@@ -11,61 +13,61 @@
<template v-if="setAvatarStylesDialog.visible">
<div>
<span>{{ t('dialog.set_avatar_styles.primary_style') }}</span>
<span>{{ t('dialog.set_avatar_styles.primary_style') }}</span>
<br />
<Select
:model-value="setAvatarStylesDialog.primaryStyle"
@update:modelValue="(v) => updateDialog({ primaryStyle: v === SELECT_CLEAR_VALUE ? '' : v })">
<SelectTrigger size="sm" style="display: inline-flex">
<SelectValue :placeholder="t('dialog.set_avatar_styles.select_style')" />
</SelectTrigger>
<SelectContent>
<SelectItem :value="SELECT_CLEAR_VALUE">{{ t('dialog.gallery_select.none') }}</SelectItem>
<SelectItem
v-for="(style, index) in setAvatarStylesDialog.availableAvatarStyles"
:key="index"
:value="style">
{{ style }}
</SelectItem>
</SelectContent>
</Select>
</div>
<br />
<Select
:model-value="setAvatarStylesDialog.primaryStyle"
@update:modelValue="(v) => updateDialog({ primaryStyle: v === SELECT_CLEAR_VALUE ? '' : v })">
<SelectTrigger size="sm" style="display: inline-flex">
<SelectValue :placeholder="t('dialog.set_avatar_styles.select_style')" />
</SelectTrigger>
<SelectContent>
<SelectItem :value="SELECT_CLEAR_VALUE">{{ t('dialog.gallery_select.none') }}</SelectItem>
<SelectItem
v-for="(style, index) in setAvatarStylesDialog.availableAvatarStyles"
:key="index"
:value="style">
{{ style }}
</SelectItem>
</SelectContent>
</Select>
</div>
<br />
<div>
<span>{{ t('dialog.set_avatar_styles.secondary_style') }}</span>
<br />
<Select
:model-value="setAvatarStylesDialog.secondaryStyle"
@update:modelValue="(v) => updateDialog({ secondaryStyle: v === SELECT_CLEAR_VALUE ? '' : v })">
<SelectTrigger size="sm" style="display: inline-flex">
<SelectValue :placeholder="t('dialog.set_avatar_styles.select_style')" />
</SelectTrigger>
<SelectContent>
<SelectItem :value="SELECT_CLEAR_VALUE">{{ t('dialog.gallery_select.none') }}</SelectItem>
<SelectItem
v-for="(style, index) in setAvatarStylesDialog.availableAvatarStyles"
:key="index"
:value="style">
{{ style }}
</SelectItem>
</SelectContent>
</Select>
</div>
<div>
<span>{{ t('dialog.set_avatar_styles.secondary_style') }}</span>
<br />
<Select
:model-value="setAvatarStylesDialog.secondaryStyle"
@update:modelValue="(v) => updateDialog({ secondaryStyle: v === SELECT_CLEAR_VALUE ? '' : v })">
<SelectTrigger size="sm" style="display: inline-flex">
<SelectValue :placeholder="t('dialog.set_avatar_styles.select_style')" />
</SelectTrigger>
<SelectContent>
<SelectItem :value="SELECT_CLEAR_VALUE">{{ t('dialog.gallery_select.none') }}</SelectItem>
<SelectItem
v-for="(style, index) in setAvatarStylesDialog.availableAvatarStyles"
:key="index"
:value="style">
{{ style }}
</SelectItem>
</SelectContent>
</Select>
</div>
<br />
<div style="font-size: 12px">{{ t('dialog.set_world_tags.author_tags') }}</div>
<div style="font-size: 12px">{{ t('dialog.set_world_tags.author_tags') }}</div>
<InputGroupTextareaField
:model-value="setAvatarStylesDialog.authorTags"
:autosize="{ minRows: 2, maxRows: 5 }"
:rows="2"
placeholder=""
style="margin-top: 10px"
input-class="resize-none"
@update:modelValue="(v) => updateDialog({ authorTags: v })" />
<InputGroupTextareaField
:model-value="setAvatarStylesDialog.authorTags"
:autosize="{ minRows: 2, maxRows: 5 }"
:rows="2"
placeholder=""
style="margin-top: 10px"
input-class="resize-none"
@update:modelValue="(v) => updateDialog({ authorTags: v })" />
</template>
<DialogFooter>
@@ -199,5 +201,3 @@
});
}
</script>
<style scoped></style>

8
src/components/dialogs/AvatarDialog/SetAvatarTagsDialog.vue
View File

@@ -72,7 +72,7 @@
v-for="avatar in setAvatarTagsDialog.ownAvatars"
:key="avatar.id"
:class="[
'item-width',
'w-[335px]',
'box-border flex items-center p-1.5 text-[13px] cursor-pointer hover:rounded-[25px_5px_5px_25px]'
]"
@click="showAvatarDialog(avatar.id)">
@@ -343,9 +343,3 @@
}
}
</script>
<style scoped>
.item-width {
width: 335px;
}
</style>

20
src/components/dialogs/GroupDialog/GroupDialog.vue
View File

@@ -536,7 +536,7 @@
}}</span>
<template v-if="upcomingCalenderEvents.length > 0">
<br />
<div class="grid-view events-row">
<div class="grid-view flex flex-wrap gap-4 overflow-y-auto max-h-[360px] py-2.5">
<GroupCalendarEventCard
v-for="value in upcomingCalenderEvents"
:key="value.id"
@@ -557,7 +557,7 @@
}}</span>
<template v-if="pastCalenderEvents.length > 0">
<br />
<div class="grid-view events-row">
<div class="grid-view flex flex-wrap gap-4 overflow-y-auto max-h-[360px] py-2.5">
<GroupCalendarEventCard
v-for="value in pastCalenderEvents"
:key="value.id"
@@ -2035,19 +2035,3 @@
}
}
</script>
<style scoped>
.time-group-container {
display: flex;
flex-direction: column;
gap: 8px;
overflow: visible;
}
.events-row {
display: flex;
flex-wrap: wrap;
gap: 16px;
overflow-y: auto;
max-height: 360px;
padding: 9px 0;
}
</style>