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

fix styles

Browse Source
This commit is contained in:
pa
2026-01-18 17:06:16 +09:00
committed by Natsumi
parent c326e4fd3e
commit 1de16dc699
40 changed files with 370 additions and 601 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/views/Favorites/FavoritesFriend.vue
+30 -118
View File
@@ -129,57 +129,35 @@
<MoreHorizontal />
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent side="right" class="w-55 p-1 rounded-lg">
<div class="favorites-group-menu">
<button
type="button"
class="favorites-group-menu__item"
@click="handleRemoteRename(group)">
<span>{{ t('view.favorite.rename_tooltip') }}</span>
</button>
<DropdownMenuSub>
<DropdownMenuSubTrigger
class="favorites-group-menu__item favorites-group-menu__item--submenu">
<span>{{ t('view.favorite.visibility_tooltip') }}</span>
</DropdownMenuSubTrigger>
<DropdownMenuPortal>
<DropdownMenuSubContent
side="right"
align="start"
class="w-[180px] p-1 rounded-lg">
<div class="group-visibility-menu">
<button
v-for="visibility in friendGroupVisibilityOptions"
:key="visibility"
type="button"
:class="[
'group-visibility-menu__item',
{
'is-active':
group.visibility === visibility
}
]"
@click="
handleVisibilitySelection(group, visibility)
">
<span>{{ formatVisibility(visibility) }}</span>
<span
v-if="group.visibility === visibility"
class="group-visibility-menu__check">
<Check class="h-3 w-3" />
</span>
</button>
</div>
</DropdownMenuSubContent>
</DropdownMenuPortal>
</DropdownMenuSub>
<button
type="button"
class="favorites-group-menu__item favorites-group-menu__item--danger"
@click="handleRemoteClear(group)">
<span>{{ t('view.favorite.clear') }}</span>
</button>
</div>
<DropdownMenuContent side="right" class="w-55">
<DropdownMenuItem @click="handleRemoteRename(group)">
<span>{{ t('view.favorite.rename_tooltip') }}</span>
</DropdownMenuItem>
<DropdownMenuSub>
<DropdownMenuSubTrigger>
<span>{{ t('view.favorite.visibility_tooltip') }}</span>
</DropdownMenuSubTrigger>
<DropdownMenuPortal>
<DropdownMenuSubContent
side="right"
align="start"
class="w-[180px]">
<DropdownMenuCheckboxItem
v-for="visibility in friendGroupVisibilityOptions"
:key="visibility"
:model-value="group.visibility === visibility"
indicator-position="right"
@select="handleVisibilitySelection(group, visibility)">
<span>{{ formatVisibility(visibility) }}</span>
</DropdownMenuCheckboxItem>
</DropdownMenuSubContent>
</DropdownMenuPortal>
</DropdownMenuSub>
<DropdownMenuItem
variant="destructive"
@click="handleRemoteClear(group)">
<span>{{ t('view.favorite.clear') }}</span>
</DropdownMenuItem>
</DropdownMenuContent>
</DropdownMenu>
</div>
@@ -320,6 +298,7 @@
import {
DropdownMenu,
DropdownMenuCheckboxItem,
DropdownMenuContent,
DropdownMenuItem,
DropdownMenuPortal,
@@ -993,73 +972,6 @@
padding: 12px 0;
}
.favorites-group-menu {
display: flex;
flex-direction: column;
gap: 4px;
}
.favorites-group-menu__item {
display: flex;
align-items: center;
justify-content: space-between;
border: none;
background: transparent;
border-radius: 8px;
padding: 6px 12px;
font-size: 13px;
cursor: pointer;
color: inherit;
transition: background-color 0.15s ease;
min-height: 32px;
align-self: stretch;
}
.favorites-group-menu__item:hover {
}
.favorites-group-menu__item--danger {
}
.favorites-group-menu__item--submenu {
padding-right: 8px;
}
.favorites-group-menu__arrow {
margin-left: auto;
font-size: 12px;
}
.group-visibility-menu {
display: flex;
flex-direction: column;
gap: 4px;
}
.group-visibility-menu__item {
display: flex;
align-items: center;
justify-content: space-between;
border: none;
background: transparent;
padding: 6px 10px;
border-radius: 8px;
cursor: pointer;
color: inherit;
font-size: 13px;
transition: background-color 0.15s ease;
min-height: 32px;
align-self: stretch;
}
.group-visibility-menu__item:hover,
.group-visibility-menu__item.is-active {
}
.group-visibility-menu__check {
font-size: 12px;
}
.favorites-content {
display: flex;
flex-direction: column;