🎨
This commit is contained in:
parent
f091007882
commit
a3a47b8d35
3 changed files with 16 additions and 28 deletions
|
@ -32,7 +32,6 @@
|
||||||
<div v-if="image.comment" :class="$style.indicator">ALT</div>
|
<div v-if="image.comment" :class="$style.indicator">ALT</div>
|
||||||
<div v-if="image.isSensitive" :class="$style.indicator" style="color: var(--warn);">NSFW</div>
|
<div v-if="image.isSensitive" :class="$style.indicator" style="color: var(--warn);">NSFW</div>
|
||||||
</div>
|
</div>
|
||||||
<button v-tooltip="i18n.ts.hide" :class="$style.hide" class="_button" @click.stop.prevent="hide = true"><i class="ti ti-eye-off"></i></button>
|
|
||||||
<button :class="$style.menu" class="_button" @click.stop="showMenu"><i class="ti ti-dots"></i></button>
|
<button :class="$style.menu" class="_button" @click.stop="showMenu"><i class="ti ti-dots"></i></button>
|
||||||
</template>
|
</template>
|
||||||
</div>
|
</div>
|
||||||
|
@ -79,9 +78,15 @@ watch(() => props.image, () => {
|
||||||
});
|
});
|
||||||
|
|
||||||
function showMenu(ev: MouseEvent) {
|
function showMenu(ev: MouseEvent) {
|
||||||
os.popupMenu([...(iAmModerator ? [{
|
os.popupMenu([{
|
||||||
text: i18n.ts.markAsSensitive,
|
text: i18n.ts.hide,
|
||||||
icon: 'ti ti-eye-off',
|
icon: 'ti ti-eye-off',
|
||||||
|
action: () => {
|
||||||
|
hide = true;
|
||||||
|
},
|
||||||
|
}, ...(iAmModerator ? [{
|
||||||
|
text: i18n.ts.markAsSensitive,
|
||||||
|
icon: 'ti ti-eye-exclamation',
|
||||||
action: () => {
|
action: () => {
|
||||||
os.apiWithDialog('drive/files/update', { fileId: props.image.id, isSensitive: true });
|
os.apiWithDialog('drive/files/update', { fileId: props.image.id, isSensitive: true });
|
||||||
},
|
},
|
||||||
|
@ -122,21 +127,6 @@ function showMenu(ev: MouseEvent) {
|
||||||
background-size: 16px 16px;
|
background-size: 16px 16px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.hide {
|
|
||||||
display: block;
|
|
||||||
position: absolute;
|
|
||||||
border-radius: 6px;
|
|
||||||
background-color: var(--accentedBg);
|
|
||||||
-webkit-backdrop-filter: var(--blur, blur(15px));
|
|
||||||
backdrop-filter: var(--blur, blur(15px));
|
|
||||||
color: var(--accent);
|
|
||||||
font-size: 0.8em;
|
|
||||||
padding: 6px 8px;
|
|
||||||
text-align: center;
|
|
||||||
top: 12px;
|
|
||||||
right: 12px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.menu {
|
.menu {
|
||||||
display: block;
|
display: block;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
|
@ -148,8 +138,8 @@ function showMenu(ev: MouseEvent) {
|
||||||
font-size: 0.8em;
|
font-size: 0.8em;
|
||||||
padding: 6px 8px;
|
padding: 6px 8px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
bottom: 12px;
|
bottom: 10px;
|
||||||
right: 12px;
|
right: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.imageContainer {
|
.imageContainer {
|
||||||
|
@ -166,12 +156,10 @@ function showMenu(ev: MouseEvent) {
|
||||||
.indicators {
|
.indicators {
|
||||||
display: inline-flex;
|
display: inline-flex;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 12px;
|
top: 10px;
|
||||||
left: 12px;
|
left: 10px;
|
||||||
text-align: center;
|
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
opacity: .5;
|
opacity: .5;
|
||||||
font-size: 14px;
|
|
||||||
gap: 6px;
|
gap: 6px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -182,7 +170,7 @@ function showMenu(ev: MouseEvent) {
|
||||||
color: var(--accentLighten);
|
color: var(--accentLighten);
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
font-size: 12px;
|
font-size: 0.8em;
|
||||||
padding: 2px 6px;
|
padding: 2px 5px;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
@ -93,7 +93,7 @@ function showFileMenu(file, ev: MouseEvent) {
|
||||||
action: () => { rename(file); },
|
action: () => { rename(file); },
|
||||||
}, {
|
}, {
|
||||||
text: file.isSensitive ? i18n.ts.unmarkAsSensitive : i18n.ts.markAsSensitive,
|
text: file.isSensitive ? i18n.ts.unmarkAsSensitive : i18n.ts.markAsSensitive,
|
||||||
icon: file.isSensitive ? 'ti ti-eye-off' : 'ti ti-eye',
|
icon: file.isSensitive ? 'ti ti-eye-exclamation' : 'ti ti-eye',
|
||||||
action: () => { toggleSensitive(file); },
|
action: () => { toggleSensitive(file); },
|
||||||
}, {
|
}, {
|
||||||
text: i18n.ts.describeFile,
|
text: i18n.ts.describeFile,
|
||||||
|
|
|
@ -73,7 +73,7 @@ export function getDriveFileMenu(file: Misskey.entities.DriveFile) {
|
||||||
action: () => rename(file),
|
action: () => rename(file),
|
||||||
}, {
|
}, {
|
||||||
text: file.isSensitive ? i18n.ts.unmarkAsSensitive : i18n.ts.markAsSensitive,
|
text: file.isSensitive ? i18n.ts.unmarkAsSensitive : i18n.ts.markAsSensitive,
|
||||||
icon: file.isSensitive ? 'ti ti-eye' : 'ti ti-eye-off',
|
icon: file.isSensitive ? 'ti ti-eye' : 'ti ti-eye-exclamation',
|
||||||
action: () => toggleSensitive(file),
|
action: () => toggleSensitive(file),
|
||||||
}, {
|
}, {
|
||||||
text: i18n.ts.describeFile,
|
text: i18n.ts.describeFile,
|
||||||
|
|
Loading…
Reference in a new issue