Show user fields (#3590)

This commit is contained in:
MeiMei
2018-12-11 20:18:12 +09:00
committed by syuilo
parent 1d1a373ca8
commit 638d81b66e
7 changed files with 132 additions and 1 deletions

View File

@ -26,6 +26,14 @@
<div class="description">
<misskey-flavored-markdown v-if="user.description" :text="user.description" :author="user" :i="$store.state.i" :custom-emojis="user.emojis"/>
</div>
<div class="fields" v-if="user.fields">
<dl class="field" v-for="(field, i) in user.fields" :key="i">
<dt class="name">{{ field.name }}</dt>
<dd class="value">
<misskey-flavored-markdown :text="field.value" :author="user" :i="$store.state.i" :custom-emojis="user.emojis"/>
</dd>
</dl>
</div>
<div class="counts">
<div>
<b>{{ user.notesCount | number }}</b>
@ -416,6 +424,31 @@ export default Vue.extend({
border-right solid 16px transparent
border-bottom solid 16px var(--face)
> .fields
margin-top 8px
> .field
display flex
padding 0
margin 0
> .name
padding 4px
margin 4px
width 30%
overflow hidden
white-space nowrap
text-overflow ellipsis
font-weight bold
> .value
padding 4px
margin 4px
width 70%
overflow hidden
white-space nowrap
text-overflow ellipsis
> .counts
display grid
grid-template-columns 1fr 1fr 1fr

View File

@ -18,6 +18,14 @@
<div class="description">
<misskey-flavored-markdown v-if="user.description" :text="user.description" :author="user" :i="$store.state.i" :custom-emojis="user.emojis"/>
</div>
<div class="fields" v-if="user.fields">
<dl class="field" v-for="(field, i) in user.fields" :key="i">
<dt class="name">{{ field.name }}</dt>
<dd class="value">
<misskey-flavored-markdown :text="field.value" :author="user" :i="$store.state.i" :custom-emojis="user.emojis"/>
</dd>
</dl>
</div>
<div class="info">
<span class="location" v-if="user.host === null && user.profile.location"><fa icon="map-marker"/> {{ user.profile.location }}</span>
<span class="birthday" v-if="user.host === null && user.profile.birthday"><fa icon="birthday-cake"/> {{ user.profile.birthday.replace('-', $t('year')).replace('-', $t('month')) + $t('day') }} ({{ $t('years-old', { age }) }})</span>
@ -174,6 +182,33 @@ export default Vue.extend({
padding 16px 16px 16px 154px
color var(--text)
> .fields
margin-top 16px
> .field
display flex
padding 0
margin 0
> .name
border-right solid 1px var(--faceDivider)
padding 4px
margin 4px
width 30%
overflow hidden
white-space nowrap
text-overflow ellipsis
font-weight bold
text-align center
> .value
padding 4px
margin 4px
width 70%
overflow hidden
white-space nowrap
text-overflow ellipsis
> .info
margin-top 16px
padding-top 16px

View File

@ -24,6 +24,14 @@
<div class="description">
<misskey-flavored-markdown v-if="user.description" :text="user.description" :author="user" :i="$store.state.i" :custom-emojis="user.emojis"/>
</div>
<div class="fields" v-if="user.fields">
<dl class="field" v-for="(field, i) in user.fields" :key="i">
<dt class="name">{{ field.name }}</dt>
<dd class="value">
<misskey-flavored-markdown :text="field.value" :author="user" :i="$store.state.i" :custom-emojis="user.emojis"/>
</dd>
</dl>
</div>
<div class="info">
<p class="location" v-if="user.host === null && user.profile.location">
<fa icon="map-marker"/>{{ user.profile.location }}
@ -301,6 +309,33 @@ main
margin 8px 0
color var(--mobileUserPageDescription)
> .fields
margin 8px 0
> .field
display flex
padding 0
margin 0
> .name
padding 4px
margin 4px
width 30%
overflow hidden
white-space nowrap
text-overflow ellipsis
font-weight bold
color var(--mobileUserPageStatusHighlight)
> .value
padding 4px
margin 4px
width 70%
overflow hidden
white-space nowrap
text-overflow ellipsis
color var(--mobileUserPageStatusHighlight)
> .info
margin 8px 0