forked from mirror/misskey
enhance(frontend): 投稿されてから時間が経過しているノートであることを視覚的に分かりやすく
This commit is contained in:
parent
18af290b18
commit
21986a2168
@ -25,6 +25,7 @@
|
|||||||
|
|
||||||
### Client
|
### Client
|
||||||
- Enhance: TLの返信表示オプションを記憶するように
|
- Enhance: TLの返信表示オプションを記憶するように
|
||||||
|
- Enhance: 投稿されてから時間が経過しているノートであることを視覚的に分かりやすく
|
||||||
|
|
||||||
### Server
|
### Server
|
||||||
- Enhance: タイムライン取得時のパフォーマンスを向上
|
- Enhance: タイムライン取得時のパフォーマンスを向上
|
||||||
|
@ -94,7 +94,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||||||
<footer>
|
<footer>
|
||||||
<div :class="$style.noteFooterInfo">
|
<div :class="$style.noteFooterInfo">
|
||||||
<MkA :to="notePage(appearNote)">
|
<MkA :to="notePage(appearNote)">
|
||||||
<MkTime :time="appearNote.createdAt" mode="detail"/>
|
<MkTime :time="appearNote.createdAt" mode="detail" colored/>
|
||||||
</MkA>
|
</MkA>
|
||||||
</div>
|
</div>
|
||||||
<MkReactionsViewer ref="reactionsViewer" :note="appearNote"/>
|
<MkReactionsViewer ref="reactionsViewer" :note="appearNote"/>
|
||||||
|
@ -15,7 +15,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||||||
</div>
|
</div>
|
||||||
<div :class="$style.info">
|
<div :class="$style.info">
|
||||||
<MkA :to="notePage(note)">
|
<MkA :to="notePage(note)">
|
||||||
<MkTime :time="note.createdAt"/>
|
<MkTime :time="note.createdAt" colored/>
|
||||||
</MkA>
|
</MkA>
|
||||||
<span v-if="note.visibility !== 'public'" style="margin-left: 0.5em;" :title="i18n.ts._visibility[note.visibility]">
|
<span v-if="note.visibility !== 'public'" style="margin-left: 0.5em;" :title="i18n.ts._visibility[note.visibility]">
|
||||||
<i v-if="note.visibility === 'home'" class="ti ti-home"></i>
|
<i v-if="note.visibility === 'home'" class="ti ti-home"></i>
|
||||||
|
@ -4,7 +4,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||||||
-->
|
-->
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<time :title="absolute">
|
<time :title="absolute" :class="{ [$style.old1]: colored && (ago > 60 * 60 * 24 * 90), [$style.old2]: colored && (ago > 60 * 60 * 24 * 180) }">
|
||||||
<template v-if="invalid">{{ i18n.ts._ago.invalid }}</template>
|
<template v-if="invalid">{{ i18n.ts._ago.invalid }}</template>
|
||||||
<template v-else-if="mode === 'relative'">{{ relative }}</template>
|
<template v-else-if="mode === 'relative'">{{ relative }}</template>
|
||||||
<template v-else-if="mode === 'absolute'">{{ absolute }}</template>
|
<template v-else-if="mode === 'absolute'">{{ absolute }}</template>
|
||||||
@ -22,6 +22,7 @@ const props = withDefaults(defineProps<{
|
|||||||
time: Date | string | number | null;
|
time: Date | string | number | null;
|
||||||
origin?: Date | null;
|
origin?: Date | null;
|
||||||
mode?: 'relative' | 'absolute' | 'detail';
|
mode?: 'relative' | 'absolute' | 'detail';
|
||||||
|
colored?: boolean;
|
||||||
}>(), {
|
}>(), {
|
||||||
origin: isChromatic() ? new Date('2023-04-01T00:00:00Z') : null,
|
origin: isChromatic() ? new Date('2023-04-01T00:00:00Z') : null,
|
||||||
mode: 'relative',
|
mode: 'relative',
|
||||||
@ -75,3 +76,13 @@ if (!invalid && props.origin === null && (props.mode === 'relative' || props.mod
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" module>
|
||||||
|
.old1 {
|
||||||
|
color: var(--warn);
|
||||||
|
}
|
||||||
|
|
||||||
|
.old1.old2 {
|
||||||
|
color: var(--error);
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
Loading…
Reference in New Issue
Block a user