MrUnknownDE/VRCX
1
0
Fork 0
mirror of https://github.com/MrUnknownDE/VRCX.git synced 2026-04-28 19:23:47 +02:00
Code Issues Packages Projects Releases Wiki Activity

fix icon alignment

Browse Source
This commit is contained in:
pa
2026-01-15 16:36:46 +09:00
committed by Natsumi
parent 3b47d3a0eb
commit 5ba081a9db
31 changed files with 102 additions and 136 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/views/Charts/components/InstanceActivity.vue
View File

@@ -12,10 +12,6 @@
<div>{{ t('view.charts.instance_activity.tips.online_time') }}</div>
<div>{{ t('view.charts.instance_activity.tips.click_Y_axis') }}</div>
<div>{{ t('view.charts.instance_activity.tips.click_instance_name') }}</div>
<div>
<AlertTriangle />
<i>{{ t('view.charts.instance_activity.tips.accuracy_notice') }}</i>
</div>
</div>
</HoverCardContent>
</HoverCard>

4
src/views/FriendsLocations/components/FriendsLocationsCard.vue
View File

@@ -11,7 +11,7 @@
</div>
<div class="friend-card__body">
<div class="friend-card__signature" :title="friend.ref?.statusDescription">
<Pencil v-if="friend.ref?.statusDescription" class="h-3.5 w-3.5 mr-0.5" style="opacity: 0.7" />
<Pencil v-if="friend.ref?.statusDescription" class="h-3.5 w-3.5 mr-1" style="opacity: 0.7" />
{{ friend.ref?.statusDescription || '&nbsp;' }}
</div>
<div v-if="displayInstanceInfo" @click.stop class="friend-card__world" :title="friend.worldName">
@@ -184,6 +184,8 @@
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
display: flex;
align-items: center;
}
.friend-card__world {

2
src/views/GameLog/columns.jsx
View File

@@ -114,7 +114,7 @@ export const createColumns = ({ getCreatedAt, onDelete, onDeletePrompt }) => {
<span>
{original.displayName ? (
<span
class="x-link table-user pr-2.5"
class="x-link table-user mr-1"
onClick={() => lookupUser(original)}
>
{original.displayName}

2
src/views/Login/Login.vue
View File

@@ -1,5 +1,5 @@
<template>
<div style="float: left; margin: 5px; z-index: 3000">
<div style="float: left; margin: 5px">
<TooltipWrapper v-if="!noUpdater" side="top" :content="t('view.login.updater')">
<Button class="rounded-full mr-2 text-xs" size="icon-sm" variant="ghost" @click="showVRCXUpdateDialog"
><CircleArrowDown

11
src/views/Sidebar/Sidebar.vue
View File

@@ -163,15 +163,4 @@
font-size: 12px;
margin-left: 10px;
}
.group-calendar-button {
position: fixed;
bottom: 20px;
right: 20px;
box-shadow: var(--el-box-shadow-lighter);
border: none;
z-index: 5;
width: 40px;
height: 40px;
}
</style>

28
src/views/Sidebar/components/FriendsSidebar.vue
View File

@@ -1,13 +1,13 @@
<template>
<div class="x-friend-list" style="padding: 10px 5px">
<div
class="x-friend-group x-link"
class="x-friend-group x-link flex items-center"
style="padding: 0 0 5px"
@click="
isFriendsGroupMe = !isFriendsGroupMe;
saveFriendsGroupStates();
">
<ArrowRight class="rotation-transition" :class="{ 'is-rotated': isFriendsGroupMe }" />
<ChevronDown class="rotation-transition" :class="{ 'is-rotated': isFriendsGroupMe }" />
<span style="margin-left: 5px">{{ t('side_panel.me') }}</span>
</div>
<div v-show="isFriendsGroupMe">
@@ -38,12 +38,12 @@
</div>
<div
v-show="vipFriendsDisplayNumber"
class="x-friend-group x-link"
class="x-friend-group x-link flex items-center"
@click="
isVIPFriends = !isVIPFriends;
saveFriendsGroupStates();
">
<ArrowRight class="rotation-transition" :class="{ 'is-rotated': isVIPFriends }" />
<ChevronDown class="rotation-transition" :class="{ 'is-rotated': isVIPFriends }" />
<span style="margin-left: 5px">
{{ t('side_panel.favorite') }} &horbar;
{{ vipFriendsDisplayNumber }}
@@ -78,8 +78,8 @@
</div>
<template v-if="isSidebarGroupByInstance && friendsInSameInstance.length">
<div class="x-friend-group x-link" @click="toggleSwitchGroupByInstanceCollapsed">
<ArrowRight
<div class="x-friend-group x-link flex items-center" @click="toggleSwitchGroupByInstanceCollapsed">
<ChevronDown
class="rotation-transition"
:class="{ 'is-rotated': !isSidebarGroupByInstanceCollapsed }" />
<span style="margin-left: 5px"
@@ -111,12 +111,12 @@
</template>
<div
v-show="onlineFriendsByGroupStatus.length"
class="x-friend-group x-link"
class="x-friend-group x-link flex items-center"
@click="
isOnlineFriends = !isOnlineFriends;
saveFriendsGroupStates();
">
<ArrowRight class="rotation-transition" :class="{ 'is-rotated': isOnlineFriends }" />
<ChevronDown class="rotation-transition" :class="{ 'is-rotated': isOnlineFriends }" />
<span style="margin-left: 5px"
>{{ t('side_panel.online') }} &horbar; {{ onlineFriendsByGroupStatus.length }}</span
>
@@ -130,12 +130,12 @@
</div>
<div
v-show="activeFriends.length"
class="x-friend-group x-link"
class="x-friend-group x-link flex items-center"
@click="
isActiveFriends = !isActiveFriends;
saveFriendsGroupStates();
">
<ArrowRight class="rotation-transition" :class="{ 'is-rotated': isActiveFriends }" />
<ChevronDown class="rotation-transition" :class="{ 'is-rotated': isActiveFriends }" />
<span style="margin-left: 5px">{{ t('side_panel.active') }} &horbar; {{ activeFriends.length }}</span>
</div>
<div v-if="isActiveFriends">
@@ -147,12 +147,12 @@
</div>
<div
v-show="offlineFriends.length"
class="x-friend-group x-link"
class="x-friend-group x-link flex items-center"
@click="
isOfflineFriends = !isOfflineFriends;
saveFriendsGroupStates();
">
<ArrowRight class="rotation-transition" :class="{ 'is-rotated': isOfflineFriends }" />
<ChevronDown class="rotation-transition" :class="{ 'is-rotated': isOfflineFriends }" />
<span style="margin-left: 5px">{{ t('side_panel.offline') }} &horbar; {{ offlineFriends.length }}</span>
</div>
<div v-if="isOfflineFriends">
@@ -167,7 +167,7 @@
<script setup>
import { computed, ref, watch } from 'vue';
import { ArrowRight } from 'lucide-vue-next';
import { ChevronDown } from 'lucide-vue-next';
import { storeToRefs } from 'pinia';
import { useI18n } from 'vue-i18n';
@@ -319,7 +319,7 @@
text-decoration: underline;
} */
.is-rotated {
transform: rotate(90deg);
transform: rotate(-90deg);
}
.rotation-transition {
transition: transform 0.2s ease-in-out;

6
src/views/Sidebar/components/GroupsSidebar.vue
View File

@@ -3,7 +3,7 @@
<template v-for="(group, index) in groupedGroupInstances" :key="getGroupId(group)">
<div class="x-friend-group x-link" :style="{ paddingTop: index === 0 ? '0px' : '10px' }">
<div @click="toggleGroupSidebarCollapse(getGroupId(group))" style="display: flex; align-items: center">
<ArrowRight
<ChevronDown
class="rotation-transition"
:class="{ 'is-rotated': !groupInstancesCfg[getGroupId(group)]?.isCollapsed }" />
<span style="margin-left: 5px">{{ group[0].group.name }} – {{ group.length }}</span>
@@ -38,7 +38,7 @@
<script setup>
import { computed, ref } from 'vue';
import { ArrowRight } from 'lucide-vue-next';
import { ChevronDown } from 'lucide-vue-next';
import { storeToRefs } from 'pinia';
import { useAppearanceSettingsStore, useGroupStore } from '../../../stores';
@@ -100,7 +100,7 @@
text-decoration: underline;
}
.is-rotated {
transform: rotate(90deg);
transform: rotate(-90deg);
}
.rotation-transition {
transition: transform 0.2s ease-in-out;

38
src/views/Tools/Tools.vue
View File

@@ -6,7 +6,7 @@
<div class="tool-categories">
<div class="tool-category">
<div class="category-header" @click="toggleCategory('group')">
<ArrowRight
<ChevronDown
class="rotation-transition"
:class="{ 'is-rotated': !categoryCollapsed['group'] }" />
<span class="category-title">{{ t('view.tools.group.header') }}</span>
@@ -14,7 +14,7 @@
<div class="tools-grid" v-show="!categoryCollapsed['group']">
<Card class="tool-card p-0 gap-0">
<div class="tool-content" @click="showGroupCalendarDialog">
<div class="tool-icon">
<div class="tool-icon text-2xl">
<CalendarDays />
</div>
<div class="tool-info">
@@ -27,15 +27,15 @@
</div>
<div class="tool-category">
<div class="category-header" @click="toggleCategory('image')">
<ArrowRight
<div class="category-header text-2xl" @click="toggleCategory('image')">
<ChevronDown
class="rotation-transition"
:class="{ 'is-rotated': !categoryCollapsed['image'] }" />
<span class="category-title">{{ t('view.tools.pictures.header') }}</span>
</div>
<div class="tools-grid" v-show="!categoryCollapsed['image']">
<Card class="tool-card p-0 gap-0">
<div class="tool-content" @click="showScreenshotMetadataPage">
<div class="tool-content text-2xl" @click="showScreenshotMetadataPage">
<div class="tool-icon">
<Camera />
</div>
@@ -49,7 +49,7 @@
</Card>
<Card class="tool-card p-0 gap-0">
<div class="tool-content" @click="showGalleryPage">
<div class="tool-icon">
<div class="tool-icon text-2xl">
<Images />
</div>
<div class="tool-info">
@@ -62,7 +62,7 @@
</Card>
<Card class="tool-card p-0 gap-0">
<div class="tool-content" @click="openVrcPhotosFolder">
<div class="tool-icon">
<div class="tool-icon text-2xl">
<FolderOpen />
</div>
<div class="tool-info">
@@ -75,7 +75,7 @@
</Card>
<Card class="tool-card p-0 gap-0">
<div class="tool-content" @click="openVrcScreenshotsFolder">
<div class="tool-icon">
<div class="tool-icon text-2xl">
<FolderOpen />
</div>
<div class="tool-info">
@@ -92,15 +92,17 @@
</div>
<div class="tool-category">
<div class="category-header" @click="toggleCategory('user')">
<ArrowRight class="rotation-transition" :class="{ 'is-rotated': !categoryCollapsed['user'] }" />
<div class="category-header text-2xl" @click="toggleCategory('user')">
<ChevronDown
class="rotation-transition"
:class="{ 'is-rotated': !categoryCollapsed['user'] }" />
<span class="category-title">{{ t('view.tools.export.header') }}</span>
</div>
<div class="tools-grid" v-show="!categoryCollapsed['user']">
<Card class="tool-card p-0 gap-0">
<div class="tool-content" @click="showExportDiscordNamesDialog">
<div class="tool-icon">
<div class="tool-icon text-2xl">
<MessageSquare />
</div>
<div class="tool-info">
@@ -113,7 +115,7 @@
</Card>
<Card class="tool-card p-0 gap-0">
<div class="tool-content" @click="showNoteExportDialog">
<div class="tool-icon">
<div class="tool-icon text-2xl">
<UserCheck />
</div>
<div class="tool-info">
@@ -127,7 +129,7 @@
<Card class="tool-card p-0 gap-0">
<div class="tool-content" @click="showExportFriendsListDialog">
<div class="tool-icon">
<div class="tool-icon text-2xl">
<UserCheck />
</div>
<div class="tool-info">
@@ -140,7 +142,7 @@
</Card>
<Card class="tool-card p-0 gap-0">
<div class="tool-content" @click="showExportAvatarsListDialog">
<div class="tool-icon">
<div class="tool-icon text-2xl">
<UserCheck />
</div>
<div class="tool-info">
@@ -156,7 +158,7 @@
<div class="tool-category">
<div class="category-header" @click="toggleCategory('other')">
<ArrowRight
<ChevronDown
class="rotation-transition"
:class="{ 'is-rotated': !categoryCollapsed['other'] }" />
<span class="category-title">{{ t('view.tools.other.header') }}</span>
@@ -164,7 +166,7 @@
<div class="tools-grid" v-show="!categoryCollapsed['other']">
<Card class="tool-card p-0 gap-0">
<div class="tool-content" @click="showEditInviteMessageDialog">
<div class="tool-icon">
<div class="tool-icon text-2xl">
<SquarePen />
</div>
<div class="tool-info">
@@ -202,9 +204,9 @@
<script setup>
import {
ArrowRight,
CalendarDays,
Camera,
ChevronDown,
FolderOpen,
Images,
MessageSquare,
@@ -401,7 +403,7 @@
}
.is-rotated {
transform: rotate(90deg);
transform: rotate(-90deg);
}
.rotation-transition {