diff options
author | Robin Appelman <robin@icewind.nl> | 2020-10-12 17:22:47 +0200 |
---|---|---|
committer | Robin Appelman <robin@icewind.nl> | 2020-10-22 14:38:55 +0200 |
commit | 0b536bd83118a507ed4d5165c3d4eee3317712f4 (patch) | |
tree | 2c9494a251013d2780e3a73068bf618b032f5191 | |
parent | 37fa47804839e12f8b29e23106fedf2b82b0d9a7 (diff) |
show profile numbers inline instead of next to the name and avatar
Signed-off-by: Robin Appelman <robin@icewind.nl>
-rw-r--r-- | src/components/ProfileInfo.vue | 36 |
1 files changed, 17 insertions, 19 deletions
diff --git a/src/components/ProfileInfo.vue b/src/components/ProfileInfo.vue index 899494a2..53a1e8b9 100644 --- a/src/components/ProfileInfo.vue +++ b/src/components/ProfileInfo.vue @@ -22,23 +22,11 @@ <template> <div v-if="profileAccount && accountInfo" class="user-profile"> - <div> - <avatar v-if="accountInfo.local" :user="localUid" :disable-tooltip="true" - :size="128" /> - <avatar v-else :url="avatarUrl" :disable-tooltip="true" - :size="128" /> - <h2>{{ displayName }}</h2> - <p>@{{ accountInfo.account }}</p> - <p v-if="accountInfo.website"> - Website: <a :href="accountInfo.website.value"> - {{ accountInfo.website.value }} - </a> - </p> - <follow-button :account="accountInfo.account" :uid="uid" /> - <button v-if="serverData.public" class="primary" @click="followRemote"> - {{ t('social', 'Follow') }} - </button> - </div> + <avatar v-if="accountInfo.local" :user="localUid" :disable-tooltip="true" + :size="128" /> + <avatar v-else :url="avatarUrl" :disable-tooltip="true" + :size="128" /> + <h2>{{ displayName }}</h2> <!-- TODO: we have no details, timeline and follower list for non-local accounts for now --> <ul v-if="accountInfo.details && accountInfo.local" class="user-profile--sections"> <li> @@ -57,17 +45,28 @@ </router-link> </li> </ul> + <p>@{{ accountInfo.account }}</p> + <p v-if="accountInfo.website"> + Website: <a :href="accountInfo.website.value"> + {{ accountInfo.website.value }} + </a> + </p> + <follow-button :account="accountInfo.account" :uid="uid" /> + <button v-if="serverData.public" class="primary" @click="followRemote"> + {{ t('social', 'Follow') }} + </button> </div> </template> <style scoped> .user-profile { display: flex; flex-wrap: wrap; + flex-direction: column; justify-content: space-between; width: 100%; text-align: center; padding-top: 20px; - align-items: flex-end; + align-items: center; margin-bottom: 20px; } h2 { @@ -76,7 +75,6 @@ .user-profile--sections { display: flex; - margin-bottom: 30px; } .user-profile--sections li { flex-grow: 1; |