dan/Nertivia-Client
1
0
Fork 0
mirror of https://github.com/danbulant/Nertivia-Client synced 2026-06-21 15:41:51 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

moved verification tick next to the name

Browse source
This commit is contained in:
supertiger1234 2019-09-06 20:28:37 +01:00
parent ca95c78542
commit 8d8c30d102
1 changed files with 20 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

32
src/components/app/Tabs/Explore/serverTemplate.vue
View file

@ -5,13 +5,17 @@
size="90px" size="90px"
:url="`${avatarDomain}/${server.server.avatar}`" :url="`${avatarDomain}/${server.server.avatar}`"
/> />
<div class="name">{{server.server.name}}</div> <div class="name">
<div class="name-container">
<span class="inner-name">{{server.server.name}}</span>
<span class="material-icons" v-if="server.verified">check</span>
</div>
</div>
</div> </div>
<div class="bottom"> <div class="bottom">
<div class="description">{{server.description}}</div> <div class="description">{{server.description}}</div>
<div class="buttons"> <div class="buttons">
<div class="member-count"><div class="material-icons">account_box</div>{{server.total_members}}</div> <div class="member-count"><div class="material-icons">account_box</div>{{server.total_members}}</div>
<div class="verified" v-if="server.verified"><div class="material-icons">check</div></div>
<div class="button" :class="{selected: joined}" @click="joinButton"> <div class="button" :class="{selected: joined}" @click="joinButton">
<span v-if="joined">Joined</span> <span v-if="joined">Joined</span>
<spinner v-else-if="joinClicked" :size="30"/> <spinner v-else-if="joinClicked" :size="30"/>
@ -99,6 +103,20 @@ export default {
text-overflow: ellipsis; text-overflow: ellipsis;
width: 100%; width: 100%;
text-align: center; text-align: center;
display: flex;
.name-container {
display: flex;
margin: auto;
}
.inner-name {
max-width: 200px;
overflow: hidden;
text-overflow: ellipsis
}
.material-icons {
color: #66e0ff;
margin-left: 5px;
}
} }
} }
.bottom { .bottom {
@ -124,16 +142,6 @@ export default {
width: 100%; width: 100%;
flex-direction: row; flex-direction: row;
} }
.verified {
display: flex;
margin: auto;
margin-right: 10px;
margin-bottom: 14px;
flex-shrink: 0;
.material-icons {
color: #66e0ff;
}
}
.member-count { .member-count {
display: flex; display: flex;
align-items: center; align-items: center;