diff options
Diffstat (limited to 'packages/frontend/src/components')
| -rw-r--r-- | packages/frontend/src/components/MkClipPreview.vue | 39 |
1 files changed, 39 insertions, 0 deletions
diff --git a/packages/frontend/src/components/MkClipPreview.vue b/packages/frontend/src/components/MkClipPreview.vue new file mode 100644 index 0000000000..c5fb718782 --- /dev/null +++ b/packages/frontend/src/components/MkClipPreview.vue @@ -0,0 +1,39 @@ +<template> +<div :class="$style.root" class="_panel"> + <b>{{ clip.name }}</b> + <div v-if="clip.description" :class="$style.description">{{ clip.description }}</div> + <div v-if="clip.lastClippedAt">{{ i18n.ts.updatedAt }}: <MkTime :time="clip.lastClippedAt" mode="detail"/></div> + <div :class="$style.user"> + <MkAvatar :user="clip.user" :class="$style.userAvatar" indicator link preview/> <MkUserName :user="clip.user" :nowrap="false"/> + </div> +</div> +</template> + +<script lang="ts" setup> +import { i18n } from '@/i18n'; + +defineProps<{ + clip: any; +}>(); +</script> + +<style lang="scss" module> +.root { + display: block; + padding: 16px; +} + +.description { + padding: 8px 0; +} + +.user { + padding-top: 16px; + border-top: solid 0.5px var(--divider); +} + +.userAvatar { + width: 32px; + height: 32px; +} +</style> |