diff --git a/CHANGELOG.md b/CHANGELOG.md index daa3f6c86ce5de4d0bc9fbf73edeaa965c664853..1d2a0032e3c40e862681ee77d7e098d623829670 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -49,6 +49,7 @@ - データセーãƒãƒ¼ãƒ¢ãƒ¼ãƒ‰ã‚’è¿½åŠ * ç”»åƒãŒå…¨ã¦éš ã‚ŒãŸçŠ¶æ…‹ã§è¡¨ç¤ºã•ã‚Œã‚‹ã‚ˆã†ã«ãªã‚Šã¾ã™ - 閲覧注æ„è¨å®šã•ã‚ŒãŸç”»åƒã¯è¡¨ç¤ºã—ãŸçŠ¶æ…‹ã§ã‚‚ãã‚ŒãŒé–²è¦§æ³¨æ„ã ã¨åˆ†ã‹ã‚‹è¡¨ç¤ºã‚’ã™ã‚‹ã‚ˆã†ã« +- モデレーターã¯ãƒŽãƒ¼ãƒˆã«æ·»ä»˜ã•ã‚ŒãŸç”»åƒä¸Šã‹ã‚‰ç›´æŽ¥NSFWè¨å®šã§ãるよã†ã« - 1æžšã ã‘ã®ãƒ¡ãƒ‡ã‚£ã‚¢ãƒªã‚¹ãƒˆã®ç”»åƒã®ã‚¢ã‚¹ãƒšã‚¯ãƒˆæ¯”ã‚’ç”»åƒã«å¿œã˜ã¦ç¸¦é•·ã«ã™ã‚‹ã‚ˆã†ã« - プãƒãƒ•ã‚£ãƒ¼ãƒ«è¨å®šã€Œè¿½åŠ æƒ…å ±ã€ã®é …ç›®ã®å‰Šé™¤ã¨ä¸¦ã³æ›¿ãˆãŒã§ãるよã†ã« - æ–°ã—ã„å®Ÿç¸¾ã‚’è¿½åŠ diff --git a/packages/frontend/src/components/MkMediaImage.vue b/packages/frontend/src/components/MkMediaImage.vue index 0634ea5c0ed8148de1a8eb4a053f9a34fe720a71..42dc9e79ff55c154d0eb9d6408d0d3712f4b082f 100644 --- a/packages/frontend/src/components/MkMediaImage.vue +++ b/packages/frontend/src/components/MkMediaImage.vue @@ -23,6 +23,7 @@ <div v-if="image.isSensitive" :class="$style.indicator" style="color: var(--warn);">NSFW</div> </div> <button v-tooltip="i18n.ts.hide" :class="$style.hide" class="_button" @click="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> </div> </template> @@ -34,6 +35,8 @@ import bytes from '@/filters/bytes'; import ImgWithBlurhash from '@/components/MkImgWithBlurhash.vue'; import { defaultStore } from '@/store'; import { i18n } from '@/i18n'; +import * as os from '@/os'; +import { iAmModerator } from '@/account'; const props = defineProps<{ image: misskey.entities.DriveFile; @@ -57,6 +60,17 @@ watch(() => props.image, () => { deep: true, immediate: true, }); + +function showMenu(ev: MouseEvent) { + os.popupMenu([...(iAmModerator ? [{ + text: i18n.ts.markAsSensitive, + icon: 'ti ti-eye-off', + action: () => { + os.apiWithDialog('drive/files/update', { fileId: props.image.id, isSensitive: true }); + }, + }] : [])], ev.currentTarget ?? ev.target); +} + </script> <style lang="scss" module> @@ -106,6 +120,21 @@ watch(() => props.image, () => { right: 12px; } +.menu { + display: block; + position: absolute; + border-radius: 6px; + background-color: rgba(0, 0, 0, 0.3); + -webkit-backdrop-filter: var(--blur, blur(15px)); + backdrop-filter: var(--blur, blur(15px)); + color: #fff; + font-size: 0.8em; + padding: 6px 8px; + text-align: center; + bottom: 12px; + right: 12px; +} + .imageContainer { display: block; cursor: zoom-in;