spec(frontend): 非ログイン状態ではセンシティブに設定されたコンテンツを閲覧できないように (MisskeyIO#498)
This commit is contained in:
まっちゃとーにゅ
GitHub
parent
7d98e6d4f6
commit
a24e93ec6c
|
|
@ -11,7 +11,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
]"
|
||||
@contextmenu.stop
|
||||
>
|
||||
<button v-if="hide" :class="$style.hidden" @click="hide = false">
|
||||
<button v-if="hide" :class="$style.hidden" @click="showHiddenContent">
|
||||
<div :class="$style.hiddenTextWrapper">
|
||||
<b v-if="audio.isSensitive" style="display: block;"><i class="ti ti-eye-exclamation"></i> {{ i18n.ts.sensitive }}{{ defaultStore.state.dataSaver.media ? ` (${i18n.ts.audio}${audio.size ? ' ' + bytes(audio.size) : ''})` : '' }}</b>
|
||||
<b v-else style="display: block;"><i class="ti ti-music"></i> {{ defaultStore.state.dataSaver.media && audio.size ? bytes(audio.size) : i18n.ts.audio }}</b>
|
||||
|
|
@ -26,19 +26,19 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
<source :src="audio.url">
|
||||
</audio>
|
||||
<div :class="[$style.controlsChild, $style.controlsLeft]">
|
||||
<button class="_button" :class="$style.controlButton" @click="togglePlayPause">
|
||||
<button class="_button" :class="$style.controlButton" @click.prevent.stop="togglePlayPause">
|
||||
<i v-if="isPlaying" class="ti ti-player-pause-filled"></i>
|
||||
<i v-else class="ti ti-player-play-filled"></i>
|
||||
</button>
|
||||
</div>
|
||||
<div :class="[$style.controlsChild, $style.controlsRight]">
|
||||
<button class="_button" :class="$style.controlButton" @click="showMenu">
|
||||
<button class="_button" :class="$style.controlButton" @click.prevent.stop="showMenu">
|
||||
<i class="ti ti-settings"></i>
|
||||
</button>
|
||||
</div>
|
||||
<div :class="[$style.controlsChild, $style.controlsTime]">{{ hms(elapsedTimeMs) }}</div>
|
||||
<div :class="[$style.controlsChild, $style.controlsVolume]">
|
||||
<button class="_button" :class="$style.controlButton" @click="toggleMute">
|
||||
<button class="_button" :class="$style.controlButton" @click.prevent.stop="toggleMute">
|
||||
<i v-if="volume === 0" class="ti ti-volume-3"></i>
|
||||
<i v-else class="ti ti-volume"></i>
|
||||
</button>
|
||||
|
|
@ -66,7 +66,8 @@ import * as os from '@/os.js';
|
|||
import bytes from '@/filters/bytes.js';
|
||||
import { hms } from '@/filters/hms.js';
|
||||
import MkMediaRange from '@/components/MkMediaRange.vue';
|
||||
import { iAmModerator } from '@/account.js';
|
||||
import { pleaseLogin } from '@/scripts/please-login.js';
|
||||
import { $i, iAmModerator } from '@/account.js';
|
||||
|
||||
const props = defineProps<{
|
||||
audio: Misskey.entities.DriveFile;
|
||||
|
|
@ -114,6 +115,21 @@ function showMenu(ev: MouseEvent) {
|
|||
});
|
||||
}
|
||||
|
||||
function showHiddenContent(ev: MouseEvent) {
|
||||
if (props.audio.isSensitive && !$i) {
|
||||
ev.preventDefault();
|
||||
ev.stopPropagation();
|
||||
pleaseLogin();
|
||||
return;
|
||||
}
|
||||
|
||||
if (hide.value) {
|
||||
ev.preventDefault();
|
||||
ev.stopPropagation();
|
||||
hide.value = false;
|
||||
}
|
||||
}
|
||||
|
||||
function toggleSensitive(file: Misskey.entities.DriveFile) {
|
||||
os.apiWithDialog('drive/files/update', {
|
||||
fileId: file.id,
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
<template>
|
||||
<div :class="$style.root">
|
||||
<MkMediaAudio v-if="media.type.startsWith('audio') && media.type !== 'audio/midi'" :audio="media"/>
|
||||
<div v-else-if="media.isSensitive && hide" :class="$style.sensitive" @click="hide = false">
|
||||
<div v-else-if="media.isSensitive && hide" :class="$style.sensitive" @click="showHiddenContent">
|
||||
<span style="font-size: 1.6em;"><i class="ti ti-alert-triangle"></i></span>
|
||||
<b>{{ i18n.ts.sensitive }}</b>
|
||||
<span>{{ i18n.ts.clickToShow }}</span>
|
||||
|
|
@ -28,6 +28,8 @@ import { shallowRef, watch, ref } from 'vue';
|
|||
import * as Misskey from 'misskey-js';
|
||||
import { i18n } from '@/i18n.js';
|
||||
import MkMediaAudio from '@/components/MkMediaAudio.vue';
|
||||
import { pleaseLogin } from '@/scripts/please-login.js';
|
||||
import { $i } from '@/account.js';
|
||||
|
||||
const props = withDefaults(defineProps<{
|
||||
media: Misskey.entities.DriveFile;
|
||||
|
|
@ -37,6 +39,21 @@ const props = withDefaults(defineProps<{
|
|||
const audioEl = shallowRef<HTMLAudioElement>();
|
||||
const hide = ref(true);
|
||||
|
||||
function showHiddenContent(ev: MouseEvent) {
|
||||
if (props.media.isSensitive && !$i) {
|
||||
ev.preventDefault();
|
||||
ev.stopPropagation();
|
||||
pleaseLogin();
|
||||
return;
|
||||
}
|
||||
|
||||
if (hide.value) {
|
||||
ev.preventDefault();
|
||||
ev.stopPropagation();
|
||||
hide.value = false;
|
||||
}
|
||||
}
|
||||
|
||||
watch(audioEl, () => {
|
||||
if (audioEl.value) {
|
||||
audioEl.value.volume = 0.3;
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
-->
|
||||
|
||||
<template>
|
||||
<div :class="[hide ? $style.hidden : $style.visible, (image.isSensitive && defaultStore.state.highlightSensitiveMedia) && $style.sensitive]" :style="darkMode ? '--c: rgb(255 255 255 / 2%);' : '--c: rgb(0 0 0 / 2%);'" @click="onclick">
|
||||
<div :class="[hide ? $style.hidden : $style.visible, (image.isSensitive && defaultStore.state.highlightSensitiveMedia) && $style.sensitive]" :style="darkMode ? '--c: rgb(255 255 255 / 2%);' : '--c: rgb(0 0 0 / 2%);'" @click="showHiddenContent">
|
||||
<component
|
||||
:is="disableImageLink ? 'div' : 'a'"
|
||||
v-bind="disableImageLink ? {
|
||||
|
|
@ -19,7 +19,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
>
|
||||
<ImgWithBlurhash
|
||||
:hash="image.blurhash"
|
||||
:src="(defaultStore.state.dataSaver.media && hide) ? null : url"
|
||||
:src="(props.image.isSensitive && !$i) || (defaultStore.state.dataSaver.media && hide) ? null : url"
|
||||
:forceBlurhash="hide"
|
||||
:cover="hide || cover"
|
||||
:alt="image.comment || image.name"
|
||||
|
|
@ -44,8 +44,8 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
<div v-if="image.comment" :class="$style.indicator">ALT</div>
|
||||
<div v-if="image.isSensitive" :class="$style.indicator" style="color: var(--warn);" :title="i18n.ts.sensitive"><i class="ti ti-eye-exclamation"></i></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>
|
||||
<button :class="$style.menu" class="_button" @click.prevent.stop="showMenu"><i class="ti ti-dots" style="vertical-align: middle;"></i></button>
|
||||
<i class="ti ti-eye-off" :class="$style.hide" @click.prevent.stop="hide = true"></i>
|
||||
</template>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -59,7 +59,8 @@ import ImgWithBlurhash from '@/components/MkImgWithBlurhash.vue';
|
|||
import { defaultStore } from '@/store.js';
|
||||
import { i18n } from '@/i18n.js';
|
||||
import * as os from '@/os.js';
|
||||
import { iAmModerator } from '@/account.js';
|
||||
import { pleaseLogin } from '@/scripts/please-login.js';
|
||||
import { $i, iAmModerator } from '@/account.js';
|
||||
|
||||
const props = withDefaults(defineProps<{
|
||||
image: Misskey.entities.DriveFile;
|
||||
|
|
@ -83,11 +84,21 @@ const url = computed(() => (props.raw || defaultStore.state.loadRawImages)
|
|||
: props.image.thumbnailUrl,
|
||||
);
|
||||
|
||||
function onclick() {
|
||||
function showHiddenContent(ev: MouseEvent) {
|
||||
if (!props.controls) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (props.image.isSensitive && !$i) {
|
||||
ev.preventDefault();
|
||||
ev.stopPropagation();
|
||||
pleaseLogin();
|
||||
return;
|
||||
}
|
||||
|
||||
if (hide.value) {
|
||||
ev.preventDefault();
|
||||
ev.stopPropagation();
|
||||
hide.value = false;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -15,7 +15,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
@mouseleave="onMouseLeave"
|
||||
@contextmenu.stop
|
||||
>
|
||||
<button v-if="hide" :class="$style.hidden" @click="hide = false">
|
||||
<button v-if="hide" :class="$style.hidden" @click="showHiddenContent">
|
||||
<div :class="$style.hiddenTextWrapper">
|
||||
<b v-if="video.isSensitive" style="display: block;"><i class="ti ti-eye-exclamation"></i> {{ i18n.ts.sensitive }}{{ defaultStore.state.dataSaver.media ? ` (${i18n.ts.video}${video.size ? ' ' + bytes(video.size) : ''})` : '' }}</b>
|
||||
<b v-else style="display: block;"><i class="ti ti-photo"></i> {{ defaultStore.state.dataSaver.media && video.size ? bytes(video.size) : i18n.ts.video }}</b>
|
||||
|
|
@ -38,30 +38,31 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
<div v-else-if="!isActuallyPlaying" :class="$style.videoLoading">
|
||||
<MkLoading/>
|
||||
</div>
|
||||
<i class="ti ti-eye-off" :class="$style.hide" @click="hide = true"></i>
|
||||
<div :class="$style.indicators">
|
||||
<div v-if="video.comment" :class="$style.indicator">ALT</div>
|
||||
<div v-if="video.isSensitive" :class="$style.indicator" style="color: var(--warn);" :title="i18n.ts.sensitive"><i class="ti ti-eye-exclamation"></i></div>
|
||||
</div>
|
||||
<div :class="$style.videoControls" @click.self="togglePlayPause">
|
||||
<button v-if="!videoControls" :class="$style.menu" class="_button" @click.prevent.stop="showMenu"><i class="ti ti-dots" style="vertical-align: middle;"></i></button>
|
||||
<i class="ti ti-eye-off" :class="$style.hide" @click.prevent.stop="hide = true"></i>
|
||||
<div v-if="videoControls" :class="$style.videoControls" @click.self="togglePlayPause">
|
||||
<div :class="[$style.controlsChild, $style.controlsLeft]">
|
||||
<button class="_button" :class="$style.controlButton" @click="togglePlayPause">
|
||||
<button class="_button" :class="$style.controlButton" @click.prevent.stop="togglePlayPause">
|
||||
<i v-if="isPlaying" class="ti ti-player-pause-filled"></i>
|
||||
<i v-else class="ti ti-player-play-filled"></i>
|
||||
</button>
|
||||
</div>
|
||||
<div :class="[$style.controlsChild, $style.controlsRight]">
|
||||
<button class="_button" :class="$style.controlButton" @click="showMenu">
|
||||
<button class="_button" :class="$style.controlButton" @click.prevent.stop="showMenu">
|
||||
<i class="ti ti-settings"></i>
|
||||
</button>
|
||||
<button class="_button" :class="$style.controlButton" @click="toggleFullscreen">
|
||||
<button class="_button" :class="$style.controlButton" @click.prevent.stop="toggleFullscreen">
|
||||
<i v-if="isFullscreen" class="ti ti-arrows-minimize"></i>
|
||||
<i v-else class="ti ti-arrows-maximize"></i>
|
||||
</button>
|
||||
</div>
|
||||
<div :class="[$style.controlsChild, $style.controlsTime]">{{ hms(elapsedTimeMs) }}</div>
|
||||
<div :class="[$style.controlsChild, $style.controlsVolume]">
|
||||
<button class="_button" :class="$style.controlButton" @click="toggleMute">
|
||||
<button class="_button" :class="$style.controlButton" @click.prevent.stop="toggleMute">
|
||||
<i v-if="volume === 0" class="ti ti-volume-3"></i>
|
||||
<i v-else class="ti ti-volume"></i>
|
||||
</button>
|
||||
|
|
@ -94,11 +95,15 @@ import * as os from '@/os.js';
|
|||
import { isFullscreenNotSupported } from '@/scripts/device-kind.js';
|
||||
import hasAudio from '@/scripts/media-has-audio.js';
|
||||
import MkMediaRange from '@/components/MkMediaRange.vue';
|
||||
import { iAmModerator } from '@/account.js';
|
||||
import { pleaseLogin } from '@/scripts/please-login.js';
|
||||
import { $i, iAmModerator } from '@/account.js';
|
||||
|
||||
const props = defineProps<{
|
||||
const props = withDefaults(defineProps<{
|
||||
video: Misskey.entities.DriveFile;
|
||||
}>();
|
||||
videoControls?: boolean;
|
||||
}>(), {
|
||||
videoControls: true,
|
||||
});
|
||||
|
||||
// eslint-disable-next-line vue/no-setup-props-destructure
|
||||
const hide = ref((defaultStore.state.nsfw === 'force' || defaultStore.state.dataSaver.media) ? true : (props.video.isSensitive && defaultStore.state.nsfw !== 'ignore'));
|
||||
|
|
@ -140,6 +145,21 @@ function showMenu(ev: MouseEvent) {
|
|||
});
|
||||
}
|
||||
|
||||
function showHiddenContent(ev: MouseEvent) {
|
||||
if (props.video.isSensitive && !$i) {
|
||||
ev.preventDefault();
|
||||
ev.stopPropagation();
|
||||
pleaseLogin();
|
||||
return;
|
||||
}
|
||||
|
||||
if (hide.value) {
|
||||
ev.preventDefault();
|
||||
ev.stopPropagation();
|
||||
hide.value = false;
|
||||
}
|
||||
}
|
||||
|
||||
function toggleSensitive(file: Misskey.entities.DriveFile) {
|
||||
os.apiWithDialog('drive/files/update', {
|
||||
fileId: file.id,
|
||||
|
|
@ -403,7 +423,6 @@ onDeactivated(() => {
|
|||
font: inherit;
|
||||
color: inherit;
|
||||
cursor: pointer;
|
||||
padding: 120px 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
|
@ -415,6 +434,22 @@ onDeactivated(() => {
|
|||
color: #fff;
|
||||
}
|
||||
|
||||
.menu {
|
||||
display: block;
|
||||
position: absolute;
|
||||
border-radius: 999px;
|
||||
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;
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
text-align: center;
|
||||
bottom: 10px;
|
||||
right: 10px;
|
||||
}
|
||||
|
||||
.videoRoot {
|
||||
background: #000;
|
||||
position: relative;
|
||||
|
|
|
|||
|
|
@ -251,7 +251,7 @@ const urls = computed(() => parsed.value ? extractUrlFromMfm(parsed.value).filte
|
|||
const isLong = shouldCollapsed(appearNote.value, urls.value ?? []);
|
||||
const collapsed = ref(appearNote.value.cw == null && isLong);
|
||||
const isDeleted = ref(false);
|
||||
const muted = ref(checkMute(appearNote.value, $i?.mutedWords));
|
||||
const muted = ref(checkMute(appearNote.value, $i?.mutedWords ?? []));
|
||||
const translation = ref<Misskey.entities.NotesTranslateResponse | null>(null);
|
||||
const translating = ref(false);
|
||||
const showTicker = (defaultStore.state.instanceTicker === 'always') || (defaultStore.state.instanceTicker === 'remote' && appearNote.value.user.instance);
|
||||
|
|
@ -260,24 +260,16 @@ const renoteCollapsed = ref(
|
|||
defaultStore.state.collapseRenotes && isRenote && (
|
||||
($i && ($i.id === note.value.userId || $i.id === appearNote.value.userId)) || // `||` must be `||`! See https://github.com/misskey-dev/misskey/issues/13131
|
||||
(appearNote.value.myReaction != null)
|
||||
)
|
||||
),
|
||||
);
|
||||
const hideMutedNotes = defaultStore.state.hideMutedNotes;
|
||||
|
||||
/* Overload FunctionにLintが対応していないのでコメントアウト
|
||||
function checkMute(noteToCheck: Misskey.entities.Note, mutedWords: Array<string | string[]> | undefined | null, checkOnly: true): boolean;
|
||||
function checkMute(noteToCheck: Misskey.entities.Note, mutedWords: Array<string | string[]> | undefined | null, checkOnly: false): boolean | 'sensitiveMute';
|
||||
*/
|
||||
function checkMute(noteToCheck: Misskey.entities.Note, mutedWords: Array<string | string[]> | undefined | null, checkOnly = false): boolean | 'sensitiveMute' {
|
||||
if (mutedWords == null) return false;
|
||||
const hideMutedNotes = $i ? defaultStore.state.hideMutedNotes : true;
|
||||
|
||||
function checkMute(noteToCheck: Misskey.entities.Note, mutedWords: Array<string | string[]>): boolean | 'sensitiveMute' {
|
||||
if (checkWordMute(noteToCheck, $i, mutedWords)) return true;
|
||||
if (noteToCheck.reply && checkWordMute(noteToCheck.reply, $i, mutedWords)) return true;
|
||||
if (noteToCheck.renote && checkWordMute(noteToCheck.renote, $i, mutedWords)) return true;
|
||||
|
||||
if (checkOnly) return false;
|
||||
|
||||
if (inTimeline && !defaultStore.state.tl.filter.withSensitive && noteToCheck.files?.some((v) => v.isSensitive)) return 'sensitiveMute';
|
||||
if (inTimeline && ($i ? !defaultStore.state.tl.filter.withSensitive : true) && noteToCheck.files?.some((v) => v.isSensitive)) return 'sensitiveMute';
|
||||
return false;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -9,25 +9,16 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
<template #header>{{ i18n.ts.files }}</template>
|
||||
<div :class="$style.root">
|
||||
<MkLoading v-if="fetching"/>
|
||||
<div v-if="!fetching && files.length > 0" :class="$style.stream">
|
||||
<template v-for="file in files" :key="file.note.id + file.file.id">
|
||||
<div v-if="file.file.isSensitive && !showingFiles.includes(file.file.id)" :class="$style.img" @click="showingFiles.push(file.file.id)">
|
||||
<!-- TODO: 画像以外のファイルに対応 -->
|
||||
<ImgWithBlurhash :class="$style.sensitiveImg" :hash="file.file.blurhash" :src="thumbnail(file.file)" :title="file.file.name" :forceBlurhash="true"/>
|
||||
<div :class="$style.sensitive">
|
||||
<div>
|
||||
<div><i class="ti ti-eye-exclamation"></i> {{ i18n.ts.sensitive }}</div>
|
||||
<div>{{ i18n.ts.clickToShow }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<MkA v-else :class="$style.img" :to="notePage(file.note)">
|
||||
<!-- TODO: 画像以外のファイルに対応 -->
|
||||
<ImgWithBlurhash :hash="file.file.blurhash" :src="thumbnail(file.file)" :title="file.file.name"/>
|
||||
<div v-if="!fetching && medias.length > 0" :class="$style.stream">
|
||||
<template v-for="media in medias" :key="media.note.id + media.file.id">
|
||||
<MkA :to="notePage(media.note)">
|
||||
<XVideo v-if="media.file.type.startsWith('video')" :key="`video:${media.file.id}`" :class="$style.media" :video="media.file" :videoControls="false"/>
|
||||
<XImage v-else-if="media.file.type.startsWith('image')" :key="`image:${media.file.id}`" :class="$style.media" class="image" :data-id="media.file.id" :image="media.file" :disableImageLink="true"/>
|
||||
<XBanner v-else :media="media.file"/>
|
||||
</MkA>
|
||||
</template>
|
||||
</div>
|
||||
<p v-if="!fetching && files.length == 0" :class="$style.empty">{{ i18n.ts.nothing }}</p>
|
||||
<p v-if="!fetching && medias.length == 0" :class="$style.empty">{{ i18n.ts.nothing }}</p>
|
||||
</div>
|
||||
</MkContainer>
|
||||
</template>
|
||||
|
|
@ -35,12 +26,12 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
<script lang="ts" setup>
|
||||
import { onMounted, ref } from 'vue';
|
||||
import * as Misskey from 'misskey-js';
|
||||
import { getStaticImageUrl } from '@/scripts/media-proxy.js';
|
||||
import { notePage } from '@/filters/note.js';
|
||||
import { misskeyApi } from '@/scripts/misskey-api.js';
|
||||
import MkContainer from '@/components/MkContainer.vue';
|
||||
import ImgWithBlurhash from '@/components/MkImgWithBlurhash.vue';
|
||||
import { defaultStore } from '@/store.js';
|
||||
import XVideo from '@/components/MkMediaVideo.vue';
|
||||
import XImage from '@/components/MkMediaImage.vue';
|
||||
import XBanner from '@/components/MkMediaBanner.vue';
|
||||
import { i18n } from '@/i18n.js';
|
||||
|
||||
const props = defineProps<{
|
||||
|
|
@ -48,17 +39,10 @@ const props = defineProps<{
|
|||
}>();
|
||||
|
||||
const fetching = ref(true);
|
||||
const files = ref<{
|
||||
const medias = ref<{
|
||||
note: Misskey.entities.Note;
|
||||
file: Misskey.entities.DriveFile;
|
||||
}[]>([]);
|
||||
const showingFiles = ref<string[]>([]);
|
||||
|
||||
function thumbnail(image: Misskey.entities.DriveFile): string {
|
||||
return defaultStore.state.disableShowingAnimatedImages
|
||||
? getStaticImageUrl(image.url)
|
||||
: image.thumbnailUrl;
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
misskeyApi('users/notes', {
|
||||
|
|
@ -68,7 +52,7 @@ onMounted(() => {
|
|||
}).then(notes => {
|
||||
for (const note of notes) {
|
||||
for (const file of note.files) {
|
||||
files.value.push({
|
||||
medias.value.push({
|
||||
note,
|
||||
file,
|
||||
});
|
||||
|
|
@ -90,7 +74,7 @@ onMounted(() => {
|
|||
grid-gap: 6px;
|
||||
}
|
||||
|
||||
.img {
|
||||
.media {
|
||||
position: relative;
|
||||
height: 128px;
|
||||
border-radius: 6px;
|
||||
|
|
@ -102,26 +86,4 @@ onMounted(() => {
|
|||
padding: 16px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.sensitiveImg {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
filter: brightness(0.7);
|
||||
}
|
||||
|
||||
.sensitive {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: grid;
|
||||
place-items: center;
|
||||
font-size: 0.8em;
|
||||
color: #fff;
|
||||
cursor: pointer;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -40,7 +40,7 @@ const isScrolling = ref(false);
|
|||
const scrollEl = shallowRef<HTMLElement>();
|
||||
|
||||
misskeyApiGet('notes/featured').then(_notes => {
|
||||
notes.value = _notes;
|
||||
notes.value = _notes.filter(note => !note.cw && !note.files?.some(file => file.isSensitive));
|
||||
});
|
||||
|
||||
onUpdated(() => {
|
||||
|
|
|
|||
Loading…
Reference in New Issue