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

refs #116 Set background-image in account profile

Browse Source
This commit is contained in:
AkiraFukushima 2018-03-30 16:58:48 +09:00
parent a83572471d
commit 6561e7df0a
2 changed files with 27 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/renderer/components/TimelineSpace/Contents/SideBar.vue
View File

@ -46,6 +46,10 @@ export default {
border-top: solid 1px #dcdfe6;
border-bottom: solid 1px #dcdfe6;
text-align: right;
.el-icon-close {
cursor: pointer;
}
}
}
</style>

39
src/renderer/components/TimelineSpace/Contents/SideBar/AccountProfile.vue
View File

@ -1,5 +1,6 @@
<template>
<div id="account_profile">
<div id="account_profile">
<div class="header-background" v-bind:style="{ backgroundImage: 'url(' + account.header + ')' }">
<div class="header">
<div class="icon">
<img :src="account.avatar" />
@ -12,21 +13,22 @@
</div>
<div class="note" v-html="account.note"></div>
</div>
<el-row class="basic-info">
<el-col :span="8"class="info">
<div class="title">Posts</div>
<div class="count">{{ account.statuses_count }}</div>
</el-col>
<el-col :span="8"class="info">
<div class="title">Following</div>
<div class="count">{{ account.following_count }}</div>
</el-col>
<el-col :span="8"class="info">
<div class="title">Followers</div>
<div class="count">{{ account.followers_count }}</div>
</el-col>
</el-row>
</div>
<el-row class="basic-info">
<el-col :span="8"class="info">
<div class="title">Posts</div>
<div class="count">{{ account.statuses_count }}</div>
</el-col>
<el-col :span="8"class="info">
<div class="title">Following</div>
<div class="count">{{ account.following_count }}</div>
</el-col>
<el-col :span="8"class="info">
<div class="title">Followers</div>
<div class="count">{{ account.followers_count }}</div>
</el-col>
</el-row>
</div>
</template>
<script>
@ -52,8 +54,13 @@ export default {
</script>
<style lang="scss" scoped>
.header-background {
background-position: 50% 50%;
background-size: cover;
}
.header {
background-color: rgba(255, 255, 255, 0.5);
background-color: rgba(255, 255, 255, 0.7);
text-align: center;
padding: 12px;
box-sizing: border-box;