usbharu
/
misskey
mirror of https://github.com/misskey-dev/misskey.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Update MkMenu.vue

This commit is contained in:
syuilo 2023-12-22 20:30:57 +09:00
parent e9fb641f4b
commit 4818df8a26
1 changed files with 17 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

38
packages/frontend/src/components/MkMenu.vue
View File

@ -15,7 +15,7 @@ SPDX-License-Identifier: AGPL-3.0-only
<template v-for="(item, i) in items2"> <template v-for="(item, i) in items2">
<div v-if="item.type === 'divider'" role="separator" :class="$style.divider"></div> <div v-if="item.type === 'divider'" role="separator" :class="$style.divider"></div>
<span v-else-if="item.type === 'label'" role="menuitem" :class="[$style.label, $style.item]"> <span v-else-if="item.type === 'label'" role="menuitem" :class="[$style.label, $style.item]">
<span :class="$style.item_content_text">{{ item.text }}</span> <span style="opacity: 0.7;">{{ item.text }}</span>
</span> </span>
<span v-else-if="item.type === 'pending'" role="menuitem" :tabindex="i" :class="[$style.pending, $style.item]"> <span v-else-if="item.type === 'pending'" role="menuitem" :tabindex="i" :class="[$style.pending, $style.item]">
<span><MkEllipsis/></span> <span><MkEllipsis/></span>
@ -279,22 +279,6 @@ onBeforeUnmount(() => {
} }
} }
.item_content {
width: 100%;
max-width: 100vw;
display: flex;
align-items: center;
justify-content: space-between;
gap: 8px;
text-overflow: ellipsis;
> .item_content_text {
max-width: calc(100vw - 4rem);
text-overflow: ellipsis;
overflow: hidden;
}
}
.item { .item {
display: flex; display: flex;
align-items: center; align-items: center;
@ -370,10 +354,6 @@ onBeforeUnmount(() => {
pointer-events: none; pointer-events: none;
font-size: 0.7em; font-size: 0.7em;
padding-bottom: 4px; padding-bottom: 4px;
> span {
opacity: 0.7;
}
} }
&.pending { &.pending {
@ -403,6 +383,22 @@ onBeforeUnmount(() => {
} }
} }
.item_content {
width: 100%;
max-width: 100vw;
display: flex;
align-items: center;
justify-content: space-between;
gap: 8px;
text-overflow: ellipsis;
}
.item_content_text {
max-width: calc(100vw - 4rem);
text-overflow: ellipsis;
overflow: hidden;
}
.switch { .switch {
position: relative; position: relative;
display: flex; display: flex;