Troplo/pleroma-fe
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

Cut notification header length from 3 lines to 1.

Browse source
This commit is contained in:
Shpuld Shpuldson 2017-05-30 00:24:08 +03:00
parent 32d1d2178a
commit e621be1428
2 changed files with 21 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
src/components/notifications/notifications.scss
View file

@ -54,10 +54,14 @@
} }
h1 { h1 {
word-break: break-all;
margin: 0 0 0.3em; margin: 0 0 0.3em;
padding: 0; padding: 0;
font-size: 1em; font-size: 1em;
line-height:20px; line-height:20px;
small {
font-weight: lighter;
}
} }
padding: 0.3em 0.8em 0.5em; padding: 0.3em 0.8em 0.5em;

23
src/components/notifications/notifications.vue
View file

@ -12,17 +12,28 @@
<img class='avatar' :src="notification.action.user.profile_image_url_original"> <img class='avatar' :src="notification.action.user.profile_image_url_original">
</a> </a>
<div class='text'> <div class='text'>
<timeago :since="notification.action.created_at" :auto-update="240"></timeago>
<div v-if="notification.type === 'favorite'"> <div v-if="notification.type === 'favorite'">
<h1>{{ notification.action.user.name }}<br><i class="fa icon-star"></i> favorited your <router-link :to="{ name: 'conversation', params: { id: notification.status.id } }">status</router-link></h1> <h1>
<p>{{ notification.status.text }}</p> {{ notification.action.user.name }}
<i class="fa icon-star"></i>
<small><router-link :to="{ name: 'conversation', params: { id: notification.status.id } }"><timeago :since="notification.action.created_at" :auto-update="240"></timeago></router-link></small>
</h1>
<p>{{ notification.status.text }}</p>
</div> </div>
<div v-if="notification.type === 'repeat'"> <div v-if="notification.type === 'repeat'">
<h1>{{ notification.action.user.name }}<br><i class="fa icon-retweet"></i> repeated your <router-link :to="{ name: 'conversation', params: { id: notification.status.id } }">status</router-link></h1> <h1>
<p>{{ notification.status.text }}</p> {{ notification.action.user.name }}
<i class="fa icon-retweet"></i>
<small><router-link :to="{ name: 'conversation', params: { id: notification.status.id } }"><timeago :since="notification.action.created_at" :auto-update="240"></timeago></router-link></small>
</h1>
<p>{{ notification.status.text }}</p>
</div> </div>
<div v-if="notification.type === 'mention'"> <div v-if="notification.type === 'mention'">
<h1>{{ notification.action.user.name }}<br><i class="fa icon-reply"></i> <router-link :to="{ name: 'conversation', params: { id: notification.status.id } }">mentioned</router-link> you</h1> <h1>
{{ notification.action.user.name }}
<i class="fa icon-reply"></i>
<small><router-link :to="{ name: 'conversation', params: { id: notification.status.id } }"><timeago :since="notification.action.created_at" :auto-update="240"></timeago></router-link></small>
</h1>
<p>{{ notification.status.text }}</p> <p>{{ notification.status.text }}</p>
</div> </div>
</div> </div>