worldcone/cherrypick
2
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

OGPプレビュー追加

Browse source
This commit is contained in:
tamo-morita 2023-05-06 18:02:08 +09:00 committed by NoriDev
parent d3f0ab901c
commit 7162e1ff89
1 changed files with 10 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
packages/frontend/src/components/MkNotePreview.vue
View file

@ -8,6 +8,7 @@
<div>
<div>
<Mfm :text="text.trim()" :author="$i" :i="$i"/>
<MkUrlPreview v-for="url in urls" :key="url" :url="url" :compact="true" :detail="false" :class="$style.urlPreview"/>
</div>
</div>
</div>
@ -17,10 +18,14 @@
<script lang="ts" setup>
import { } from 'vue';
import { $i } from '@/account';
import MkUrlPreview from '@/components/MkUrlPreview.vue';
import { extractUrlFromMfm } from '@/scripts/extract-url-from-mfm';
import * as mfm from 'mfm-js';
const props = defineProps<{
text: string;
}>();
const urls = props.text ? extractUrlFromMfm(mfm.parse(props.text)) : null;
</script>
<style lang="scss" module>
@ -55,6 +60,11 @@ const props = defineProps<{
text-overflow: ellipsis;
}
.urlPreview {
margin-top: 8px;
margin-bottom: 8px;
}
@container (min-width: 350px) {
.avatar {
margin: 0 10px 0 0 !important;