Mastodon/Whalebird-desktop-client-mac-linux-windows
1
0
Fork 0
mirror of https://github.com/h3poteto/whalebird-desktop synced 2024-12-24 16:01:20 +01:00
Code Issues Releases Wiki Activity

refs #25 Add follow event card in notifications

Browse Source
This commit is contained in:
AkiraFukushima 2018-03-12 23:06:27 +09:00
parent 90d82610d6
commit d305e50f6f
1 changed files with 58 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

60
src/renderer/components/TimelineSpace/Cards/Notification/Follow.vue
View File

@ -1,6 +1,18 @@
<template> <template>
<div id="follow"> <div class="follow">
follow <div class="action">
<div class="action-mark">
<icon name="user-plus" scale="0.7"></icon>
</div>
<div class="action-detail">
<span class="bold">{{ message.account.display_name }}</span> is now following you
</div>
<div class="action-icon">
<img :src="message.account.avatar" />
</div>
</div>
<div class="clearfix"></div>
<div class="fill-line"></div>
</div> </div>
</template> </template>
@ -10,3 +22,47 @@ export default {
props: ['message'] props: ['message']
} }
</script> </script>
<style lang="scss" scoped>
.fill-line {
height: 1px;
background-color: #f2f6fc;
margin: 4px 0;
}
.bold {
font-weight: bold;
}
.follow {
margin-top: 8px;
.action {
margin-right: 8px;
.action-mark {
color: #409eff;
float: left;
width: 32px;
text-align: right;
}
.action-detail {
margin-left: 10px;
font-size: 14px;
float: left;
}
.action-icon {
width: 100%;
text-align: right;
img {
width: 16px;
height: 16px;
border-radius: 2px;
}
}
}
}
</style>