✌️
This commit is contained in:
parent
96bc49adc6
commit
cd9fc9a717
7 changed files with 97 additions and 99 deletions
|
@ -1,8 +1,8 @@
|
|||
<template>
|
||||
<div class="message" :data-is-me="isMe">
|
||||
<a class="avatar-anchor" :href="`/${message.user.username}`" :title="message.user.username" target="_blank">
|
||||
<router-link class="avatar-anchor" :to="`/${message.user.username}`" :title="message.user.username" target="_blank">
|
||||
<img class="avatar" :src="`${message.user.avatar_url}?thumbnail&size=80`" alt=""/>
|
||||
</a>
|
||||
</router-link>
|
||||
<div class="content-container">
|
||||
<div class="balloon">
|
||||
<p class="read" v-if="isMe && message.is_read">%i18n:common.tags.mk-messaging-message.is-read%</p>
|
||||
|
|
|
@ -5,84 +5,84 @@
|
|||
<div class="notification" :class="notification.type" :key="notification.id">
|
||||
<mk-time :time="notification.created_at"/>
|
||||
<template v-if="notification.type == 'reaction'">
|
||||
<a class="avatar-anchor" :href="`/${notification.user.username}`" v-user-preview="notification.user.id">
|
||||
<router-link class="avatar-anchor" :to="`/${notification.user.username}`" v-user-preview="notification.user.id">
|
||||
<img class="avatar" :src="`${notification.user.avatar_url}?thumbnail&size=48`" alt="avatar"/>
|
||||
</a>
|
||||
</router-link>
|
||||
<div class="text">
|
||||
<p>
|
||||
<mk-reaction-icon :reaction="notification.reaction"/>
|
||||
<a :href="`/${notification.user.username}`" v-user-preview="notification.user.id">{{ notification.user.name }}</a>
|
||||
<router-link :to="`/${notification.user.username}`" v-user-preview="notification.user.id">{{ notification.user.name }}</router-link>
|
||||
</p>
|
||||
<a class="post-ref" :href="`/${notification.post.user.username}/${notification.post.id}`">
|
||||
<router-link class="post-ref" :to="`/${notification.post.user.username}/${notification.post.id}`">
|
||||
%fa:quote-left%{{ getPostSummary(notification.post) }}%fa:quote-right%
|
||||
</a>
|
||||
</router-link>
|
||||
</div>
|
||||
</template>
|
||||
<template v-if="notification.type == 'repost'">
|
||||
<a class="avatar-anchor" :href="`/${notification.post.user.username}`" v-user-preview="notification.post.user_id">
|
||||
<router-link class="avatar-anchor" :to="`/${notification.post.user.username}`" v-user-preview="notification.post.user_id">
|
||||
<img class="avatar" :src="`${notification.post.user.avatar_url}?thumbnail&size=48`" alt="avatar"/>
|
||||
</a>
|
||||
</router-link>
|
||||
<div class="text">
|
||||
<p>%fa:retweet%
|
||||
<a :href="`/${notification.post.user.username}`" v-user-preview="notification.post.user_id">{{ notification.post.user.name }}</a>
|
||||
<router-link :to="`/${notification.post.user.username}`" v-user-preview="notification.post.user_id">{{ notification.post.user.name }}</router-link>
|
||||
</p>
|
||||
<a class="post-ref" :href="`/${notification.post.user.username}/${notification.post.id}`">
|
||||
<router-link class="post-ref" :to="`/${notification.post.user.username}/${notification.post.id}`">
|
||||
%fa:quote-left%{{ getPostSummary(notification.post.repost) }}%fa:quote-right%
|
||||
</a>
|
||||
</router-link>
|
||||
</div>
|
||||
</template>
|
||||
<template v-if="notification.type == 'quote'">
|
||||
<a class="avatar-anchor" :href="`/${notification.post.user.username}`" v-user-preview="notification.post.user_id">
|
||||
<router-link class="avatar-anchor" :to="`/${notification.post.user.username}`" v-user-preview="notification.post.user_id">
|
||||
<img class="avatar" :src="`${notification.post.user.avatar_url}?thumbnail&size=48`" alt="avatar"/>
|
||||
</a>
|
||||
</router-link>
|
||||
<div class="text">
|
||||
<p>%fa:quote-left%
|
||||
<a :href="`/${notification.post.user.username}`" v-user-preview="notification.post.user_id">{{ notification.post.user.name }}</a>
|
||||
<router-link :to="`/${notification.post.user.username}`" v-user-preview="notification.post.user_id">{{ notification.post.user.name }}</router-link>
|
||||
</p>
|
||||
<a class="post-preview" :href="`/${notification.post.user.username}/${notification.post.id}`">{{ getPostSummary(notification.post) }}</a>
|
||||
<router-link class="post-preview" :to="`/${notification.post.user.username}/${notification.post.id}`">{{ getPostSummary(notification.post) }}</router-link>
|
||||
</div>
|
||||
</template>
|
||||
<template v-if="notification.type == 'follow'">
|
||||
<a class="avatar-anchor" :href="`/${notification.user.username}`" v-user-preview="notification.user.id">
|
||||
<router-link class="avatar-anchor" :to="`/${notification.user.username}`" v-user-preview="notification.user.id">
|
||||
<img class="avatar" :src="`${notification.user.avatar_url}?thumbnail&size=48`" alt="avatar"/>
|
||||
</a>
|
||||
</router-link>
|
||||
<div class="text">
|
||||
<p>%fa:user-plus%
|
||||
<a :href="`/${notification.user.username}`" v-user-preview="notification.user.id">{{ notification.user.name }}</a>
|
||||
<router-link :to="`/${notification.user.username}`" v-user-preview="notification.user.id">{{ notification.user.name }}</router-link>
|
||||
</p>
|
||||
</div>
|
||||
</template>
|
||||
<template v-if="notification.type == 'reply'">
|
||||
<a class="avatar-anchor" :href="`/${notification.post.user.username}`" v-user-preview="notification.post.user_id">
|
||||
<router-link class="avatar-anchor" :to="`/${notification.post.user.username}`" v-user-preview="notification.post.user_id">
|
||||
<img class="avatar" :src="`${notification.post.user.avatar_url}?thumbnail&size=48`" alt="avatar"/>
|
||||
</a>
|
||||
</router-link>
|
||||
<div class="text">
|
||||
<p>%fa:reply%
|
||||
<a :href="`/${notification.post.user.username}`" v-user-preview="notification.post.user_id">{{ notification.post.user.name }}</a>
|
||||
<router-link :to="`/${notification.post.user.username}`" v-user-preview="notification.post.user_id">{{ notification.post.user.name }}</router-link>
|
||||
</p>
|
||||
<a class="post-preview" :href="`/${notification.post.user.username}/${notification.post.id}`">{{ getPostSummary(notification.post) }}</a>
|
||||
<router-link class="post-preview" :to="`/${notification.post.user.username}/${notification.post.id}`">{{ getPostSummary(notification.post) }}</router-link>
|
||||
</div>
|
||||
</template>
|
||||
<template v-if="notification.type == 'mention'">
|
||||
<a class="avatar-anchor" :href="`/${notification.post.user.username}`" v-user-preview="notification.post.user_id">
|
||||
<router-link class="avatar-anchor" :to="`/${notification.post.user.username}`" v-user-preview="notification.post.user_id">
|
||||
<img class="avatar" :src="`${notification.post.user.avatar_url}?thumbnail&size=48`" alt="avatar"/>
|
||||
</a>
|
||||
</router-link>
|
||||
<div class="text">
|
||||
<p>%fa:at%
|
||||
<a :href="`/${notification.post.user.username}`" v-user-preview="notification.post.user_id">{{ notification.post.user.name }}</a>
|
||||
<router-link :to="`/${notification.post.user.username}`" v-user-preview="notification.post.user_id">{{ notification.post.user.name }}</router-link>
|
||||
</p>
|
||||
<a class="post-preview" :href="`/${notification.post.user.username}/${notification.post.id}`">{{ getPostSummary(notification.post) }}</a>
|
||||
</div>
|
||||
</template>
|
||||
<template v-if="notification.type == 'poll_vote'">
|
||||
<a class="avatar-anchor" :href="`/${notification.user.username}`" v-user-preview="notification.user.id">
|
||||
<router-link class="avatar-anchor" :to="`/${notification.user.username}`" v-user-preview="notification.user.id">
|
||||
<img class="avatar" :src="`${notification.user.avatar_url}?thumbnail&size=48`" alt="avatar"/>
|
||||
</a>
|
||||
</router-link>
|
||||
<div class="text">
|
||||
<p>%fa:chart-pie%<a :href="`/${notification.user.username}`" v-user-preview="notification.user.id">{{ notification.user.name }}</a></p>
|
||||
<a class="post-ref" :href="`/${notification.post.user.username}/${notification.post.id}`">
|
||||
<router-link class="post-ref" :to="`/${notification.post.user.username}/${notification.post.id}`">
|
||||
%fa:quote-left%{{ getPostSummary(notification.post) }}%fa:quote-right%
|
||||
</a>
|
||||
</router-link>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
|
|
|
@ -1,24 +1,24 @@
|
|||
<template>
|
||||
<div class="sub" :title="title">
|
||||
<a class="avatar-anchor" href={ '/' + post.user.username }>
|
||||
<img class="avatar" src={ post.user.avatar_url + '?thumbnail&size=64' } alt="avatar" v-user-preview={ post.user_id }/>
|
||||
</a>
|
||||
<router-link class="avatar-anchor" :to="`/${post.user.username}`">
|
||||
<img class="avatar" :src="`${post.user.avatar_url}?thumbnail&size=64`" alt="avatar" v-user-preview="post.user_id"/>
|
||||
</router-link>
|
||||
<div class="main">
|
||||
<header>
|
||||
<div class="left">
|
||||
<a class="name" href={ '/' + post.user.username } v-user-preview={ post.user_id }>{ post.user.name }</a>
|
||||
<span class="username">@{ post.user.username }</span>
|
||||
<router-link class="name" :to="`/${post.user.username}`" v-user-preview="post.user_id">{{ post.user.name }}</router-link>
|
||||
<span class="username">@{{ post.user.username }}</span>
|
||||
</div>
|
||||
<div class="right">
|
||||
<a class="time" href={ '/' + post.user.username + '/' + post.id }>
|
||||
<mk-time time={ post.created_at }/>
|
||||
</a>
|
||||
<router-link class="time" :to="`/${post.user.username}/${post.id}`">
|
||||
<mk-time :time="post.created_at"/>
|
||||
</router-link>
|
||||
</div>
|
||||
</header>
|
||||
<div class="body">
|
||||
<mk-post-html v-if="post.ast" :ast="post.ast" :i="os.i"/>
|
||||
<mk-post-html v-if="post.ast" :ast="post.ast" :i="os.i" :class="$style.text"/>
|
||||
<div class="media" v-if="post.media">
|
||||
<mk-images images={ post.media }/>
|
||||
<mk-images :images="post.media"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -108,9 +108,10 @@ export default Vue.extend({
|
|||
font-size 0.9em
|
||||
color #c0c0c0
|
||||
|
||||
> .body
|
||||
</style>
|
||||
|
||||
> .text
|
||||
<style lang="stylus" module>
|
||||
.text
|
||||
cursor default
|
||||
display block
|
||||
margin 0
|
||||
|
@ -118,8 +119,4 @@ export default Vue.extend({
|
|||
overflow-wrap break-word
|
||||
font-size 1em
|
||||
color #717171
|
||||
|
||||
> .mk-url-preview
|
||||
margin-top 8px
|
||||
|
||||
</style>
|
||||
|
|
|
@ -1,14 +1,15 @@
|
|||
<template>
|
||||
<div class="mk-post-preview" :title="title">
|
||||
<a class="avatar-anchor" :href="`/${post.user.username}`">
|
||||
<router-link class="avatar-anchor" :to="`/${post.user.username}`">
|
||||
<img class="avatar" :src="`${post.user.avatar_url}?thumbnail&size=64`" alt="avatar" v-user-preview="post.user_id"/>
|
||||
</a>
|
||||
</router-link>
|
||||
<div class="main">
|
||||
<header>
|
||||
<a class="name" :href="`/${post.user.username}`" v-user-preview="post.user_id">{{ post.user.name }}</a>
|
||||
<router-link class="name" :to="`/${post.user.username}`" v-user-preview="post.user_id">{{ post.user.name }}</router-link>
|
||||
<span class="username">@{{ post.user.username }}</span>
|
||||
<a class="time" :href="`/${post.user.username}/${post.id}`">
|
||||
<mk-time :time="post.created_at"/></a>
|
||||
<router-link class="time" :to="`/${post.user.username}/${post.id}`">
|
||||
<mk-time :time="post.created_at"/>
|
||||
</router-link>
|
||||
</header>
|
||||
<div class="body">
|
||||
<mk-sub-post-content class="text" :post="post"/>
|
||||
|
|
|
@ -1,15 +1,15 @@
|
|||
<template>
|
||||
<div class="sub" :title="title">
|
||||
<a class="avatar-anchor" :href="`/${post.user.username}`">
|
||||
<router-link class="avatar-anchor" :to="`/${post.user.username}`">
|
||||
<img class="avatar" :src="`${post.user.avatar_url}?thumbnail&size=64`" alt="avatar" v-user-preview="post.user_id"/>
|
||||
</a>
|
||||
</router-link>
|
||||
<div class="main">
|
||||
<header>
|
||||
<a class="name" :href="`/${post.user.username}`" v-user-preview="post.user_id">{{ post.user.name }}</a>
|
||||
<router-link class="name" :to="`/${post.user.username}`" v-user-preview="post.user_id">{{ post.user.name }}</router-link>
|
||||
<span class="username">@{{ post.user.username }}</span>
|
||||
<a class="created-at" :href="`/${post.user.username}/${post.id}`">
|
||||
<router-link class="created-at" :to="`/${post.user.username}/${post.id}`">
|
||||
<mk-time :time="post.created_at"/>
|
||||
</a>
|
||||
</router-link>
|
||||
</header>
|
||||
<div class="body">
|
||||
<mk-sub-post-content class="text" :post="post"/>
|
||||
|
|
|
@ -3,99 +3,99 @@
|
|||
<mk-time :time="notification.created_at"/>
|
||||
|
||||
<template v-if="notification.type == 'reaction'">
|
||||
<a class="avatar-anchor" :href="`/${notification.user.username}`">
|
||||
<router-link class="avatar-anchor" :to="`/${notification.user.username}`">
|
||||
<img class="avatar" :src="`${notification.user.avatar_url}?thumbnail&size=64`" alt="avatar"/>
|
||||
</a>
|
||||
</router-link>
|
||||
<div class="text">
|
||||
<p>
|
||||
<mk-reaction-icon :reaction="notification.reaction"/>
|
||||
<a :href="`/${notification.user.username}`">{{ notification.user.name }}</a>
|
||||
<router-link :to="`/${notification.user.username}`">{{ notification.user.name }}</router-link>
|
||||
</p>
|
||||
<a class="post-ref" :href="`/${notification.post.user.username}/${notification.post.id}`">
|
||||
<router-link class="post-ref" :to="`/${notification.post.user.username}/${notification.post.id}`">
|
||||
%fa:quote-left%{{ getPostSummary(notification.post) }}
|
||||
%fa:quote-right%
|
||||
</a>
|
||||
</router-link>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<template v-if="notification.type == 'repost'">
|
||||
<a class="avatar-anchor" :href="`/${notification.post.user.username}`">
|
||||
<router-link class="avatar-anchor" :to="`/${notification.post.user.username}`">
|
||||
<img class="avatar" :src="`${notification.post.user.avatar_url}?thumbnail&size=64`" alt="avatar"/>
|
||||
</a>
|
||||
</router-link>
|
||||
<div class="text">
|
||||
<p>
|
||||
%fa:retweet%
|
||||
<a :href="`/${notification.post.user.username}`">{{ notification.post.user.name }}</a>
|
||||
<router-link :to="`/${notification.post.user.username}`">{{ notification.post.user.name }}</router-link>
|
||||
</p>
|
||||
<a class="post-ref" :href="`/${notification.post.user.username}/${notification.post.id}`">
|
||||
<router-link class="post-ref" :to="`/${notification.post.user.username}/${notification.post.id}`">
|
||||
%fa:quote-left%{{ getPostSummary(notification.post.repost) }}%fa:quote-right%
|
||||
</a>
|
||||
</router-link>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<template v-if="notification.type == 'quote'">
|
||||
<a class="avatar-anchor" :href="`/${notification.post.user.username}`">
|
||||
<router-link class="avatar-anchor" :to="`/${notification.post.user.username}`">
|
||||
<img class="avatar" :src="`${notification.post.user.avatar_url}?thumbnail&size=64`" alt="avatar"/>
|
||||
</a>
|
||||
</router-link>
|
||||
<div class="text">
|
||||
<p>
|
||||
%fa:quote-left%
|
||||
<a :href="`/${notification.post.user.username}`">{{ notification.post.user.name }}</a>
|
||||
<router-link :to="`/${notification.post.user.username}`">{{ notification.post.user.name }}</router-link>
|
||||
</p>
|
||||
<a class="post-preview" :href="`/${notification.post.user.username}/${notification.post.id}`">{{ getPostSummary(notification.post) }}</a>
|
||||
<router-link class="post-preview" :to="`/${notification.post.user.username}/${notification.post.id}`">{{ getPostSummary(notification.post) }}</router-link>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<template v-if="notification.type == 'follow'">
|
||||
<a class="avatar-anchor" :href="`/${notification.user.username}`">
|
||||
<router-link class="avatar-anchor" :to="`/${notification.user.username}`">
|
||||
<img class="avatar" :src="`${notification.user.avatar_url}?thumbnail&size=64`" alt="avatar"/>
|
||||
</a>
|
||||
</router-link>
|
||||
<div class="text">
|
||||
<p>
|
||||
%fa:user-plus%
|
||||
<a :href="`/${notification.user.username}`">{{ notification.user.name }}</a>
|
||||
<router-link :to="`/${notification.user.username}`">{{ notification.user.name }}</router-link>
|
||||
</p>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<template v-if="notification.type == 'reply'">
|
||||
<a class="avatar-anchor" :href="`/${notification.post.user.username}`">
|
||||
<router-link class="avatar-anchor" :to="`/${notification.post.user.username}`">
|
||||
<img class="avatar" :src="`${notification.post.user.avatar_url}?thumbnail&size=64`" alt="avatar"/>
|
||||
</a>
|
||||
</router-link>
|
||||
<div class="text">
|
||||
<p>
|
||||
%fa:reply%
|
||||
<a :href="`/${notification.post.user.username}`">{{ notification.post.user.name }}</a>
|
||||
<router-link :to="`/${notification.post.user.username}`">{{ notification.post.user.name }}</router-link>
|
||||
</p>
|
||||
<a class="post-preview" :href="`/${notification.post.user.username}/${notification.post.id}`">{{ getPostSummary(notification.post) }}</a>
|
||||
<router-link class="post-preview" :to="`/${notification.post.user.username}/${notification.post.id}`">{{ getPostSummary(notification.post) }}</router-link>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<template v-if="notification.type == 'mention'">
|
||||
<a class="avatar-anchor" :href="`/${notification.post.user.username}`">
|
||||
<router-link class="avatar-anchor" :to="`/${notification.post.user.username}`">
|
||||
<img class="avatar" :src="`${notification.post.user.avatar_url}?thumbnail&size=64`" alt="avatar"/>
|
||||
</a>
|
||||
</router-link>
|
||||
<div class="text">
|
||||
<p>
|
||||
%fa:at%
|
||||
<a :href="`/${notification.post.user.username}`">{{ notification.post.user.name }}</a>
|
||||
<router-link :to="`/${notification.post.user.username}`">{{ notification.post.user.name }}</router-link>
|
||||
</p>
|
||||
<a class="post-preview" :href="`/${notification.post.user.username}/${notification.post.id}`">{{ getPostSummary(notification.post) }}</a>
|
||||
<router-link class="post-preview" :to="`/${notification.post.user.username}/${notification.post.id}`">{{ getPostSummary(notification.post) }}</router-link>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<template v-if="notification.type == 'poll_vote'">
|
||||
<a class="avatar-anchor" :href="`/${notification.user.username}`">
|
||||
<router-link class="avatar-anchor" :to="`/${notification.user.username}`">
|
||||
<img class="avatar" :src="`${notification.user.avatar_url}?thumbnail&size=64`" alt="avatar"/>
|
||||
</a>
|
||||
</router-link>
|
||||
<div class="text">
|
||||
<p>
|
||||
%fa:chart-pie%
|
||||
<a :href="`/${notification.user.username}`">{{ notification.user.name }}</a>
|
||||
<router-link :to="`/${notification.user.username}`">{{ notification.user.name }}</router-link>
|
||||
</p>
|
||||
<a class="post-ref" :href="`/${notification.post.user.username}/${notification.post.id}`">
|
||||
<router-link class="post-ref" :to="`/${notification.post.user.username}/${notification.post.id}`">
|
||||
%fa:quote-left%{{ getPostSummary(notification.post) }}%fa:quote-right%
|
||||
</a>
|
||||
</router-link>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
|
|
|
@ -1,15 +1,15 @@
|
|||
<template>
|
||||
<div class="mk-post-preview">
|
||||
<a class="avatar-anchor" :href="`/${post.user.username}`">
|
||||
<router-link class="avatar-anchor" :to="`/${post.user.username}`">
|
||||
<img class="avatar" :src="`${post.user.avatar_url}?thumbnail&size=64`" alt="avatar"/>
|
||||
</a>
|
||||
</router-link>
|
||||
<div class="main">
|
||||
<header>
|
||||
<a class="name" :href="`/${post.user.username}`">{{ post.user.name }}</a>
|
||||
<router-link class="name" :to="`/${post.user.username}`">{{ post.user.name }}</router-link>
|
||||
<span class="username">@{{ post.user.username }}</span>
|
||||
<a class="time" :href="`/${post.user.username}/${post.id}`">
|
||||
<router-link class="time" :to="`/${post.user.username}/${post.id}`">
|
||||
<mk-time :time="post.created_at"/>
|
||||
</a>
|
||||
</router-link>
|
||||
</header>
|
||||
<div class="body">
|
||||
<mk-sub-post-content class="text" :post="post"/>
|
||||
|
|
Loading…
Reference in a new issue