This commit is contained in:
syuilo 2023-05-19 18:16:26 +09:00
parent bd6666173a
commit c713af8e23
2 changed files with 21 additions and 26 deletions

View file

@ -105,7 +105,7 @@ defineProps<{
.mfm {
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
-webkit-box-orient: vertical;
overflow: hidden;
}

View file

@ -2,15 +2,15 @@
<MkStickyContainer>
<template #header><MkPageHeader :actions="headerActions"/></template>
<MkSpacer :contentMax="800">
<div v-if="clip">
<div class="okzinsic _panel">
<div v-if="clip.description" class="description">
<div v-if="clip" class="_gaps">
<div class="_panel">
<div v-if="clip.description" :class="$style.description">
<Mfm :text="clip.description" :isNote="false" :i="$i"/>
</div>
<MkButton v-if="favorited" v-tooltip="i18n.ts.unfavorite" asLike class="button" rounded primary @click="unfavorite()"><i class="ti ti-heart"></i><span v-if="clip.favoritedCount > 0" style="margin-left: 6px;">{{ clip.favoritedCount }}</span></MkButton>
<MkButton v-else v-tooltip="i18n.ts.favorite" asLike class="button" rounded @click="favorite()"><i class="ti ti-heart"></i><span v-if="clip.favoritedCount > 0" style="margin-left: 6px;">{{ clip.favoritedCount }}</span></MkButton>
<div class="user">
<MkAvatar :user="clip.user" class="avatar" indicator link preview/> <MkUserName :user="clip.user" :nowrap="false"/>
<MkButton v-if="favorited" v-tooltip="i18n.ts.unfavorite" asLike rounded primary @click="unfavorite()"><i class="ti ti-heart"></i><span v-if="clip.favoritedCount > 0" style="margin-left: 6px;">{{ clip.favoritedCount }}</span></MkButton>
<MkButton v-else v-tooltip="i18n.ts.favorite" asLike rounded @click="favorite()"><i class="ti ti-heart"></i><span v-if="clip.favoritedCount > 0" style="margin-left: 6px;">{{ clip.favoritedCount }}</span></MkButton>
<div :class="$style.user">
<MkAvatar :user="clip.user" :class="$style.avatar" indicator link preview/> <MkUserName :user="clip.user" :nowrap="false"/>
</div>
</div>
@ -147,25 +147,20 @@ definePageMetadata(computed(() => clip ? {
} : null));
</script>
<style lang="scss" scoped>
.okzinsic {
position: relative;
margin-bottom: var(--margin);
<style lang="scss" module>
.description {
padding: 16px;
}
> .description {
padding: 16px;
}
.user {
--height: 32px;
padding: 16px;
border-top: solid 0.5px var(--divider);
line-height: var(--height);
}
> .user {
$height: 32px;
padding: 16px;
border-top: solid 0.5px var(--divider);
line-height: $height;
> .avatar {
width: $height;
height: $height;
}
}
.avatar {
width: var(--height);
height: var(--height);
}
</style>