Resolve #747
This commit is contained in:
parent
c1e7d56ff8
commit
daff0977cb
8 changed files with 83 additions and 86 deletions
|
@ -1,6 +1,10 @@
|
|||
ChangeLog
|
||||
=========
|
||||
|
||||
unreleased
|
||||
----------
|
||||
* モバイル版でも連携サービスを表示するように
|
||||
|
||||
10.87.4
|
||||
----------
|
||||
* フォローリクエストを許可するときにエラーになる問題を修正
|
||||
|
|
|
@ -0,0 +1,44 @@
|
|||
<template>
|
||||
<a class="zxrjzpcj" :href="url" :class="service" target="_blank">
|
||||
<fa :icon="icon" size="lg" fixed-width /><span>{{ text }}</span>
|
||||
</a>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import Vue from 'vue';
|
||||
|
||||
export default Vue.extend({
|
||||
props: ['url', 'text', 'icon', 'service']
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
.zxrjzpcj
|
||||
padding 6px 8px 6px 6px
|
||||
border-radius 32px
|
||||
|
||||
&:hover
|
||||
text-decoration none
|
||||
|
||||
&.twitter
|
||||
color #fff
|
||||
background #1da1f3
|
||||
|
||||
&:hover
|
||||
background #0c87cf
|
||||
|
||||
&.github
|
||||
color #fff
|
||||
background #171515
|
||||
|
||||
&:hover
|
||||
background #000
|
||||
|
||||
&.discord
|
||||
color #fff
|
||||
background #7289da
|
||||
|
||||
&:hover
|
||||
background #4968ce
|
||||
|
||||
</style>
|
26
src/client/app/common/views/components/integrations.vue
Normal file
26
src/client/app/common/views/components/integrations.vue
Normal file
|
@ -0,0 +1,26 @@
|
|||
<template>
|
||||
<div class="nbogcrmo" :v-if="user.twitter || user.github || user.discord">
|
||||
<x-integration v-if="user.twitter" service="twitter" :url="`https://twitter.com/${user.twitter.screenName}`" :text="user.twitter.screenName" :icon="['fab', 'twitter']"/>
|
||||
<x-integration v-if="user.github" service="github" :url="`https://github.com/${user.github.login}`" :text="user.github.login" :icon="['fab', 'github']"/>
|
||||
<x-integration v-if="user.discord" service="discord" :url="`https://discordapp.com/users/${user.discord.id}`" :text="`${user.discord.username}#${user.discord.discriminator}`" :icon="['fab', 'discord']"/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import Vue from 'vue';
|
||||
import XIntegration from './integrations.integration.vue';
|
||||
|
||||
export default Vue.extend({
|
||||
components: {
|
||||
XIntegration
|
||||
},
|
||||
props: ['user']
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
.nbogcrmo
|
||||
> *
|
||||
margin-right 10px
|
||||
|
||||
</style>
|
|
@ -23,6 +23,7 @@
|
|||
<div class="description">
|
||||
<mfm v-if="user.description" :text="user.description" :is-note="false" :author="user" :i="$store.state.i" :custom-emojis="user.emojis"/>
|
||||
<p v-else class="empty">{{ $t('no-description') }}</p>
|
||||
<x-integrations :user="user" style="margin-top:16px;"/>
|
||||
</div>
|
||||
<div class="fields" v-if="user.fields">
|
||||
<dl class="field" v-for="(field, i) in user.fields" :key="i">
|
||||
|
@ -52,9 +53,13 @@ import Vue from 'vue';
|
|||
import i18n from '../../../../i18n';
|
||||
import * as age from 's-age';
|
||||
import XUserMenu from '../../../../common/views/components/user-menu.vue';
|
||||
import XIntegrations from '../../../../common/views/components/integrations.vue';
|
||||
|
||||
export default Vue.extend({
|
||||
i18n: i18n('desktop/views/pages/user/user.header.vue'),
|
||||
components: {
|
||||
XIntegrations
|
||||
},
|
||||
props: ['user'],
|
||||
computed: {
|
||||
style(): any {
|
||||
|
|
|
@ -1,6 +1,5 @@
|
|||
<template>
|
||||
<div class="lnctpgve">
|
||||
<x-integrations :user="user" v-if="user.twitter || user.github || user.discord"/>
|
||||
<mk-note-detail v-for="n in user.pinnedNotes" :key="n.id" :note="n" :compact="true"/>
|
||||
<!--<mk-calendar @chosen="warp" :start="new Date(user.createdAt)"/>-->
|
||||
<div class="activity">
|
||||
|
@ -17,11 +16,8 @@
|
|||
<script lang="ts">
|
||||
import Vue from 'vue';
|
||||
import i18n from '../../../../i18n';
|
||||
import parseAcct from '../../../../../../misc/acct/parse';
|
||||
import Progress from '../../../../common/scripts/loading';
|
||||
import XTimeline from './user.timeline.vue';
|
||||
import XPhotos from './user.photos.vue';
|
||||
import XIntegrations from './user.integrations.vue';
|
||||
import XActivity from '../../../../common/views/components/activity.vue';
|
||||
|
||||
export default Vue.extend({
|
||||
|
@ -29,7 +25,6 @@ export default Vue.extend({
|
|||
components: {
|
||||
XTimeline,
|
||||
XPhotos,
|
||||
XIntegrations,
|
||||
XActivity
|
||||
},
|
||||
props: {
|
||||
|
|
|
@ -1,14 +0,0 @@
|
|||
<template>
|
||||
<a :href="url" :class="service" target="_blank">
|
||||
<fa :icon="icon" size="lg" fixed-width />
|
||||
<div>{{ text }}</div>
|
||||
</a>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import Vue from 'vue';
|
||||
|
||||
export default Vue.extend({
|
||||
props: ['url', 'text', 'icon', 'service']
|
||||
});
|
||||
</script>
|
|
@ -1,66 +0,0 @@
|
|||
<template>
|
||||
<div class="usertwitxxxgithxxdiscxxxintegrat" :v-if="user.twitter || user.github || user.discord">
|
||||
<x-integration v-if="user.twitter" service="twitter" :url="`https://twitter.com/${user.twitter.screenName}`" :text="user.twitter.screenName" :icon="['fab', 'twitter']"/>
|
||||
<x-integration v-if="user.github" service="github" :url="`https://github.com/${user.github.login}`" :text="user.github.login" :icon="['fab', 'github']"/>
|
||||
<x-integration v-if="user.discord" service="discord" :url="`https://discordapp.com/users/${user.discord.id}`" :text="`${user.discord.username}#${user.discord.discriminator}`" :icon="['fab', 'discord']"/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import Vue from 'vue';
|
||||
import XIntegration from './user.integrations.integration.vue';
|
||||
|
||||
export default Vue.extend({
|
||||
components: {
|
||||
XIntegration
|
||||
},
|
||||
props: ['user']
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
.usertwitxxxgithxxdiscxxxintegrat
|
||||
display flex
|
||||
|
||||
> a
|
||||
display flex
|
||||
flex 1
|
||||
align-items center
|
||||
padding 16px
|
||||
box-shadow var(--shadow)
|
||||
border-radius var(--round)
|
||||
|
||||
&:not(:last-child)
|
||||
margin-right 16px
|
||||
|
||||
&:hover
|
||||
text-decoration none
|
||||
|
||||
> div
|
||||
padding-left .2em
|
||||
line-height 1.3em
|
||||
flex 1 0
|
||||
word-wrap anywhere
|
||||
|
||||
&.twitter
|
||||
color #fff
|
||||
background #1da1f3
|
||||
|
||||
&:hover
|
||||
background #0c87cf
|
||||
|
||||
&.github
|
||||
color #fff
|
||||
background #171515
|
||||
|
||||
&:hover
|
||||
background #000
|
||||
|
||||
&.discord
|
||||
color #fff
|
||||
background #7289da
|
||||
|
||||
&:hover
|
||||
background #4968ce
|
||||
|
||||
</style>
|
|
@ -23,6 +23,7 @@
|
|||
</div>
|
||||
<div class="description">
|
||||
<mfm v-if="user.description" :text="user.description" :is-note="false" :author="user" :i="$store.state.i" :custom-emojis="user.emojis"/>
|
||||
<x-integrations :user="user" style="margin:16px 0;"/>
|
||||
</div>
|
||||
<div class="fields" v-if="user.fields">
|
||||
<dl class="field" v-for="(field, i) in user.fields" :key="i">
|
||||
|
@ -86,11 +87,13 @@ import Progress from '../../../../common/scripts/loading';
|
|||
import XUserMenu from '../../../../common/views/components/user-menu.vue';
|
||||
import XHome from './home.vue';
|
||||
import { getStaticImageUrl } from '../../../../common/scripts/get-static-image-url';
|
||||
import XIntegrations from '../../../../common/views/components/integrations.vue';
|
||||
|
||||
export default Vue.extend({
|
||||
i18n: i18n('mobile/views/pages/user.vue'),
|
||||
components: {
|
||||
XHome
|
||||
XHome,
|
||||
XIntegrations
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
|
|
Loading…
Reference in a new issue