MrUnknownDE/VRCX
1
0
Fork 0
mirror of https://github.com/MrUnknownDE/VRCX.git synced 2026-05-05 14:26:06 +02:00
Code Issues Packages Projects Releases Wiki Activity

UI Refresh

Browse Source
This commit is contained in:
pa
2026-01-02 22:24:28 +09:00
committed by Natsumi
parent b02d287190
commit 00745b54f1
120 changed files with 3931 additions and 2015 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/views/Sidebar/Sidebar.vue
+13 -11
View File
@@ -8,7 +8,7 @@
remote
:remote-method="quickSearchRemoteMethod"
popper-class="x-quick-search"
style="flex: 1; padding: 10px"
style="flex: 1; padding: 10px; padding-left: 0"
@change="quickSearchChange">
<el-option v-for="item in quickSearchItems" :key="item.value" :value="item.value" :label="item.label">
<div class="x-friend-item">
@@ -41,7 +41,7 @@
</el-option>
</el-select>
<div>
<NativeTooltip placement="bottom" :content="t('side_panel.refresh_tooltip')">
<el-tooltip placement="bottom" :content="t('side_panel.refresh_tooltip')">
<el-button
type="default"
:loading="isRefreshFriendsLoading"
@@ -50,16 +50,14 @@
circle
style="margin-right: 10px"
@click="refreshFriendsList"></el-button>
</NativeTooltip>
</el-tooltip>
</div>
</div>
<el-tabs class="zero-margin-tabs" stretch style="height: calc(100% - 60px); margin-top: 5px">
<el-tabs class="zero-margin-tabs" stretch style="height: calc(100% - 70px); margin-top: 5px">
<el-tab-pane>
<template #label>
<span>{{ t('side_panel.friends') }}</span>
<span style="color: #909399; font-size: 12px; margin-left: 10px">
({{ onlineFriendCount }}/{{ friends.size }})
</span>
<span class="sidebar-tab-count"> ({{ onlineFriendCount }}/{{ friends.size }}) </span>
</template>
<el-backtop target=".zero-margin-tabs .el-tabs__content" :bottom="20" :right="20"></el-backtop>
<FriendsSidebar @confirm-delete-friend="confirmDeleteFriend" />
@@ -67,9 +65,7 @@
<el-tab-pane lazy>
<template #label>
<span>{{ t('side_panel.groups') }}</span>
<span style="color: #909399; font-size: 12px; margin-left: 10px">
({{ groupInstances.length }})
</span>
<span class="sidebar-tab-count"> ({{ groupInstances.length }}) </span>
</template>
<GroupsSidebar :group-instances="groupInstances" :group-order="inGameGroupOrder" />
</el-tab-pane>
@@ -97,11 +93,17 @@
</script>
<style scoped>
.sidebar-tab-count {
color: var(--el-text-color-secondary);
font-size: 12px;
margin-left: 10px;
}
.group-calendar-button {
position: fixed;
bottom: 20px;
right: 20px;
box-shadow: 0 0 6px rgba(0, 0, 0, 0.12);
box-shadow: var(--el-box-shadow-lighter);
border: none;
z-index: 5;
width: 40px;
src/views/Sidebar/components/FriendItem.vue
+6 -6
View File
@@ -6,7 +6,7 @@
:class="isFriendActiveOrOffline ? undefined : userStatusClass(friend.ref, friend.pendingOffline)">
<img :src="userImage(friend.ref, true)" loading="lazy" />
</div>
<div class="detail">
<div class="detail h-9 flex flex-col justify-between">
<span v-if="!hideNicknames && friend.$nickName" class="name" :style="{ color: friend.ref.$userColour }">
{{ friend.ref.displayName }} ({{ friend.$nickName }})
</span>
@@ -16,9 +16,9 @@
<span v-if="isFriendActiveOrOffline" class="extra">{{ friend.ref.statusDescription }}</span>
<template v-else>
<span v-if="friend.pendingOffline" class="extra">
<div v-if="friend.pendingOffline" class="extra">
<el-icon><WarningFilled /></el-icon> {{ t('side_panel.pending_offline') }}
</span>
</div>
<template v-else-if="isGroupByInstance">
<el-icon v-if="isFriendTraveling" class="is-loading" style="margin-right: 3px"
><Loading
@@ -87,7 +87,7 @@
const travelingProp = computed(() => props.friend.ref?.travelingToLocation || '');
</script>
<style scoped>
<style>
.skeleton {
height: 40px;
width: 100%;
@@ -104,11 +104,11 @@
justify-content: center;
}
}
:deep(.el-skeleton__circle) {
.el-skeleton__circle {
height: 40px;
width: 40px;
}
:deep(.el-skeleton__text) {
.el-skeleton__text {
&:first-child {
height: 14px;
margin-bottom: 6px;