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

@ -2,15 +2,15 @@
<MkStickyContainer> <MkStickyContainer>
<template #header><MkPageHeader :actions="headerActions"/></template> <template #header><MkPageHeader :actions="headerActions"/></template>
<MkSpacer :contentMax="800"> <MkSpacer :contentMax="800">
<div v-if="clip"> <div v-if="clip" class="_gaps">
<div class="okzinsic _panel"> <div class="_panel">
<div v-if="clip.description" class="description"> <div v-if="clip.description" :class="$style.description">
<Mfm :text="clip.description" :isNote="false" :i="$i"/> <Mfm :text="clip.description" :isNote="false" :i="$i"/>
</div> </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-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 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> <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="user"> <div :class="$style.user">
<MkAvatar :user="clip.user" class="avatar" indicator link preview/> <MkUserName :user="clip.user" :nowrap="false"/> <MkAvatar :user="clip.user" :class="$style.avatar" indicator link preview/> <MkUserName :user="clip.user" :nowrap="false"/>
</div> </div>
</div> </div>
@ -147,25 +147,20 @@ definePageMetadata(computed(() => clip ? {
} : null)); } : null));
</script> </script>
<style lang="scss" scoped> <style lang="scss" module>
.okzinsic { .description {
position: relative; padding: 16px;
margin-bottom: var(--margin); }
> .description { .user {
padding: 16px; --height: 32px;
} padding: 16px;
border-top: solid 0.5px var(--divider);
line-height: var(--height);
}
> .user { .avatar {
$height: 32px; width: var(--height);
padding: 16px; height: var(--height);
border-top: solid 0.5px var(--divider);
line-height: $height;
> .avatar {
width: $height;
height: $height;
}
}
} }
</style> </style>