summaryrefslogtreecommitdiff
path: root/packages/frontend/src/components/MkMediaImage.vue
diff options
context:
space:
mode:
authoranatawa12 <anatawa12@icloud.com>2023-07-06 08:49:07 +0900
committerGitHub <noreply@github.com>2023-07-06 08:49:07 +0900
commitdc8763215ada27149e8b4370bb86b8fb6ad3a002 (patch)
tree303b27524c687bb6f6474398c9247f5b30986536 /packages/frontend/src/components/MkMediaImage.vue
parentrefactor(`ApDbResolverService.ts`): URLを扱う複雑な正規表現をURL... (diff)
downloadmisskey-dc8763215ada27149e8b4370bb86b8fb6ad3a002.tar.gz
misskey-dc8763215ada27149e8b4370bb86b8fb6ad3a002.tar.bz2
misskey-dc8763215ada27149e8b4370bb86b8fb6ad3a002.zip
feat(frontend): 画像を動画と同様に簡単に隠せるように (#11127)
* feat: hide image easily * docs(changelog): add 画像を動画と同様に簡単に隠せるように
Diffstat (limited to 'packages/frontend/src/components/MkMediaImage.vue')
-rw-r--r--packages/frontend/src/components/MkMediaImage.vue16
1 files changed, 16 insertions, 0 deletions
diff --git a/packages/frontend/src/components/MkMediaImage.vue b/packages/frontend/src/components/MkMediaImage.vue
index b29871c363..df49bcb26d 100644
--- a/packages/frontend/src/components/MkMediaImage.vue
+++ b/packages/frontend/src/components/MkMediaImage.vue
@@ -33,6 +33,7 @@
<div v-if="image.isSensitive" :class="$style.indicator" style="color: var(--warn);">NSFW</div>
</div>
<button :class="$style.menu" class="_button" @click.stop="showMenu"><i class="ti ti-dots" style="vertical-align: middle;"></i></button>
+ <i class="ti ti-eye-off" :class="$style.hide" @click.stop="hide = true"></i>
</template>
</div>
</template>
@@ -113,6 +114,21 @@ function showMenu(ev: MouseEvent) {
align-items: center;
}
+.hide {
+ display: block;
+ position: absolute;
+ border-radius: 6px;
+ background-color: var(--fg);
+ color: var(--accentLighten);
+ font-size: 14px;
+ opacity: .5;
+ padding: 3px 6px;
+ text-align: center;
+ cursor: pointer;
+ top: 12px;
+ right: 12px;
+}
+
.hiddenTextWrapper {
display: table-cell;
text-align: center;