mirror of
https://activitypub.software/TransFem-org/Sharkey
synced 2024-12-31 12:01:17 +00:00
[Client] Fix #3213
This commit is contained in:
syuilo
parent
4a6722b9e9
commit
7896242f57
15 changed files with 196 additions and 320 deletions
|
|
@ -668,13 +668,6 @@ desktop/views/components/media-video.vue:
|
|||
sensitive: "閲覧注意"
|
||||
click-to-show: "クリックして表示"
|
||||
|
||||
desktop/views/components/follow-button.vue:
|
||||
following: "フォロー中"
|
||||
follow: "フォロー"
|
||||
request-pending: "フォロー許可待ち"
|
||||
follow-processing: "フォロー処理中"
|
||||
follow-request: "フォロー申請"
|
||||
|
||||
desktop/views/components/followers-window.vue:
|
||||
followers: "{} のフォロワー"
|
||||
|
||||
|
|
@ -1336,7 +1329,7 @@ mobile/views/components/media-video.vue:
|
|||
sensitive: "閲覧注意"
|
||||
click-to-show: "クリックして表示"
|
||||
|
||||
mobile/views/components/follow-button.vue:
|
||||
common/views/components/follow-button.vue:
|
||||
following: "フォロー中"
|
||||
follow: "フォロー"
|
||||
request-pending: "フォロー許可待ち"
|
||||
|
|
|
|||
184
src/client/app/common/views/components/follow-button.vue
Normal file
184
src/client/app/common/views/components/follow-button.vue
Normal file
|
|
@ -0,0 +1,184 @@
|
|||
<template>
|
||||
<button class="wfliddvnhxvyusikowhxozkyxyenqxqr"
|
||||
:class="{ wait, block, mini, active: isFollowing || hasPendingFollowRequestFromYou }"
|
||||
@click="onClick"
|
||||
:disabled="wait"
|
||||
>
|
||||
<template v-if="!wait">
|
||||
<fa :icon="iconAndText[0]"/> <template v-if="!mini">{{ iconAndText[1] }}</template>
|
||||
</template>
|
||||
<template v-else><fa icon="spinner" pulse fixed-width/></template>
|
||||
</button>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import Vue from 'vue';
|
||||
import i18n from '../../../i18n';
|
||||
|
||||
export default Vue.extend({
|
||||
i18n: i18n('common/views/components/follow-button.vue'),
|
||||
|
||||
props: {
|
||||
user: {
|
||||
type: Object,
|
||||
required: true
|
||||
},
|
||||
block: {
|
||||
type: Boolean,
|
||||
required: false,
|
||||
default: false
|
||||
},
|
||||
mini: {
|
||||
type: Boolean,
|
||||
required: false,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
|
||||
data() {
|
||||
return {
|
||||
isFollowing: this.user.isFollowing,
|
||||
hasPendingFollowRequestFromYou: this.user.hasPendingFollowRequestFromYou,
|
||||
wait: false,
|
||||
connection: null
|
||||
};
|
||||
},
|
||||
|
||||
computed: {
|
||||
iconAndText(): any[] {
|
||||
return (
|
||||
(this.hasPendingFollowRequestFromYou && this.user.isLocked) ? ['hourglass-half', this.$t('request-pending')] :
|
||||
(this.hasPendingFollowRequestFromYou && !this.user.isLocked) ? ['hourglass-start', this.$t('follow-processing')] :
|
||||
(this.isFollowing) ? ['minus', this.$t('following')] :
|
||||
(!this.isFollowing && this.user.isLocked) ? ['plus', this.$t('follow-request')] :
|
||||
(!this.isFollowing && !this.user.isLocked) ? ['plus', this.$t('follow')] :
|
||||
[]
|
||||
);
|
||||
}
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.connection = this.$root.stream.useSharedConnection('main');
|
||||
|
||||
this.connection.on('follow', this.onFollowChange);
|
||||
this.connection.on('unfollow', this.onFollowChange);
|
||||
},
|
||||
|
||||
beforeDestroy() {
|
||||
this.connection.dispose();
|
||||
},
|
||||
|
||||
methods: {
|
||||
onFollowChange(user) {
|
||||
if (user.id == this.user.id) {
|
||||
this.isFollowing = user.isFollowing;
|
||||
this.hasPendingFollowRequestFromYou = user.hasPendingFollowRequestFromYou;
|
||||
}
|
||||
},
|
||||
|
||||
async onClick() {
|
||||
this.wait = true;
|
||||
|
||||
try {
|
||||
if (this.isFollowing) {
|
||||
await this.$root.api('following/delete', {
|
||||
userId: this.user.id
|
||||
});
|
||||
} else {
|
||||
if (this.hasPendingFollowRequestFromYou) {
|
||||
await this.$root.api('following/requests/cancel', {
|
||||
userId: this.user.id
|
||||
});
|
||||
} else if (this.user.isLocked) {
|
||||
await this.$root.api('following/create', {
|
||||
userId: this.user.id
|
||||
});
|
||||
this.hasPendingFollowRequestFromYou = true;
|
||||
} else {
|
||||
await this.$root.api('following/create', {
|
||||
userId: this.user.id
|
||||
});
|
||||
this.hasPendingFollowRequestFromYou = true;
|
||||
}
|
||||
}
|
||||
} catch (e) {
|
||||
console.error(e);
|
||||
} finally {
|
||||
this.wait = false;
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
.wfliddvnhxvyusikowhxozkyxyenqxqr
|
||||
display block
|
||||
user-select none
|
||||
cursor pointer
|
||||
padding 0 16px
|
||||
margin 0
|
||||
min-width 100px
|
||||
line-height 36px
|
||||
font-size 14px
|
||||
font-weight bold
|
||||
color var(--primary)
|
||||
background transparent
|
||||
outline none
|
||||
border solid 1px var(--primary)
|
||||
border-radius 36px
|
||||
|
||||
&.mini
|
||||
padding 0
|
||||
min-width 0
|
||||
width 32px
|
||||
height 32px
|
||||
font-size 16px
|
||||
border-radius 4px
|
||||
line-height 32px
|
||||
|
||||
&:focus
|
||||
&:after
|
||||
border-radius 8px
|
||||
|
||||
&.block
|
||||
width 100%
|
||||
|
||||
&:focus
|
||||
&:after
|
||||
content ""
|
||||
pointer-events none
|
||||
position absolute
|
||||
top -5px
|
||||
right -5px
|
||||
bottom -5px
|
||||
left -5px
|
||||
border 2px solid var(--primaryAlpha03)
|
||||
border-radius 36px
|
||||
|
||||
&:hover
|
||||
background var(--primaryAlpha01)
|
||||
|
||||
&:active
|
||||
background var(--primaryAlpha02)
|
||||
|
||||
&.active
|
||||
color var(--primaryForeground)
|
||||
background var(--primary)
|
||||
|
||||
&:hover
|
||||
background var(--primaryLighten10)
|
||||
border-color var(--primaryLighten10)
|
||||
|
||||
&:active
|
||||
background var(--primaryDarken10)
|
||||
border-color var(--primaryDarken10)
|
||||
|
||||
&.wait
|
||||
cursor wait !important
|
||||
opacity 0.7
|
||||
|
||||
*
|
||||
pointer-events none
|
||||
|
||||
</style>
|
||||
|
|
@ -1,5 +1,6 @@
|
|||
import Vue from 'vue';
|
||||
|
||||
import followButton from './follow-button.vue';
|
||||
import muteAndBlock from './mute-and-block.vue';
|
||||
import error from './error.vue';
|
||||
import apiSettings from './api-settings.vue';
|
||||
|
|
@ -51,6 +52,7 @@ import uiInfo from './ui/info.vue';
|
|||
import formButton from './ui/form/button.vue';
|
||||
import formRadio from './ui/form/radio.vue';
|
||||
|
||||
Vue.component('mk-follow-button', followButton);
|
||||
Vue.component('mk-mute-and-block', muteAndBlock);
|
||||
Vue.component('mk-error', error);
|
||||
Vue.component('mk-api-settings', apiSettings);
|
||||
|
|
|
|||
|
|
@ -1,157 +0,0 @@
|
|||
<template>
|
||||
<button class="mk-follow-button"
|
||||
:class="{ wait, active: u.isFollowing || u.hasPendingFollowRequestFromYou, big: size == 'big' }"
|
||||
@click="onClick"
|
||||
:disabled="wait"
|
||||
>
|
||||
<template v-if="!wait">
|
||||
<template v-if="u.hasPendingFollowRequestFromYou && u.isLocked"><fa icon="hourglass-half"/><template v-if="size == 'big'"> {{ $t('request-pending') }}</template></template>
|
||||
<template v-else-if="u.hasPendingFollowRequestFromYou && !u.isLocked"><fa icon="hourglass-start"/><template v-if="size == 'big'"> {{ $t('follow-processing') }}</template></template>
|
||||
<template v-else-if="u.isFollowing"><fa icon="minus"/><template v-if="size == 'big'"> {{ $t('following') }}</template></template>
|
||||
<template v-else-if="!u.isFollowing && u.isLocked"><fa icon="plus"/><template v-if="size == 'big'"> {{ $t('follow-request') }}</template></template>
|
||||
<template v-else-if="!u.isFollowing && !u.isLocked"><fa icon="plus"/><template v-if="size == 'big'"> {{ $t('follow') }}</template></template>
|
||||
</template>
|
||||
<template v-else><fa icon="spinner .pulse" fixed-width/></template>
|
||||
</button>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import Vue from 'vue';
|
||||
import i18n from '../../../i18n';
|
||||
|
||||
export default Vue.extend({
|
||||
i18n: i18n('desktop/views/components/follow-button.vue'),
|
||||
props: {
|
||||
user: {
|
||||
type: Object,
|
||||
required: true
|
||||
},
|
||||
size: {
|
||||
type: String,
|
||||
default: 'compact'
|
||||
}
|
||||
},
|
||||
|
||||
data() {
|
||||
return {
|
||||
u: this.user,
|
||||
wait: false,
|
||||
connection: null
|
||||
};
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.connection = this.$root.stream.useSharedConnection('main');
|
||||
this.connection.on('follow', this.onFollowChange);
|
||||
this.connection.on('unfollow', this.onFollowChange);
|
||||
},
|
||||
|
||||
beforeDestroy() {
|
||||
this.connection.dispose();
|
||||
},
|
||||
|
||||
methods: {
|
||||
onFollowChange(user) {
|
||||
if (user.id == this.u.id) {
|
||||
this.u.isFollowing = user.isFollowing;
|
||||
this.u.hasPendingFollowRequestFromYou = user.hasPendingFollowRequestFromYou;
|
||||
this.$forceUpdate();
|
||||
}
|
||||
},
|
||||
|
||||
async onClick() {
|
||||
this.wait = true;
|
||||
|
||||
try {
|
||||
if (this.u.isFollowing) {
|
||||
this.u = await this.$root.api('following/delete', {
|
||||
userId: this.u.id
|
||||
});
|
||||
} else {
|
||||
if (this.u.hasPendingFollowRequestFromYou) {
|
||||
this.u = await this.$root.api('following/requests/cancel', {
|
||||
userId: this.u.id
|
||||
});
|
||||
} else if (this.u.isLocked) {
|
||||
this.u = await this.$root.api('following/create', {
|
||||
userId: this.u.id
|
||||
});
|
||||
} else {
|
||||
this.u = await this.$root.api('following/create', {
|
||||
userId: this.user.id
|
||||
});
|
||||
}
|
||||
}
|
||||
} catch (e) {
|
||||
console.error(e);
|
||||
} finally {
|
||||
this.wait = false;
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
.mk-follow-button
|
||||
display block
|
||||
cursor pointer
|
||||
padding 0
|
||||
margin 0
|
||||
width 32px
|
||||
height 32px
|
||||
font-size 1em
|
||||
outline none
|
||||
border-radius 4px
|
||||
|
||||
*
|
||||
pointer-events none
|
||||
|
||||
&:focus
|
||||
&:after
|
||||
content ""
|
||||
pointer-events none
|
||||
position absolute
|
||||
top -5px
|
||||
right -5px
|
||||
bottom -5px
|
||||
left -5px
|
||||
border 2px solid var(--primaryAlpha03)
|
||||
border-radius 8px
|
||||
|
||||
&:not(.active)
|
||||
color var(--primary)
|
||||
border solid 1px var(--primary)
|
||||
|
||||
&:hover
|
||||
background var(--primaryAlpha03)
|
||||
|
||||
&:active
|
||||
background var(--primaryAlpha05)
|
||||
|
||||
&.active
|
||||
color var(--primaryForeground)
|
||||
background var(--primary)
|
||||
border solid 1px var(--primary)
|
||||
|
||||
&:not(:disabled)
|
||||
font-weight bold
|
||||
|
||||
&:hover:not(:disabled)
|
||||
background var(--primaryLighten5)
|
||||
border-color var(--primaryLighten5)
|
||||
|
||||
&:active:not(:disabled)
|
||||
background var(--primaryDarken5)
|
||||
border-color var(--primaryDarken5)
|
||||
|
||||
&.wait
|
||||
cursor wait !important
|
||||
opacity 0.7
|
||||
|
||||
&.big
|
||||
width 100%
|
||||
height 38px
|
||||
line-height 38px
|
||||
|
||||
</style>
|
||||
|
|
@ -14,7 +14,6 @@ import mediaVideo from './media-video.vue';
|
|||
import notifications from './notifications.vue';
|
||||
import noteForm from './post-form.vue';
|
||||
import renoteForm from './renote-form.vue';
|
||||
import followButton from './follow-button.vue';
|
||||
import notePreview from './note-preview.vue';
|
||||
import noteDetail from './note-detail.vue';
|
||||
import settings from './settings.vue';
|
||||
|
|
@ -39,7 +38,6 @@ Vue.component('mk-media-video', mediaVideo);
|
|||
Vue.component('mk-notifications', notifications);
|
||||
Vue.component('mk-post-form', noteForm);
|
||||
Vue.component('mk-renote-form', renoteForm);
|
||||
Vue.component('mk-follow-button', followButton);
|
||||
Vue.component('mk-note-preview', notePreview);
|
||||
Vue.component('mk-note-detail', noteDetail);
|
||||
Vue.component('mk-settings', settings);
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
<div class="zvdbznxvfixtmujpsigoccczftvpiwqh">
|
||||
<div class="banner" :style="bannerStyle"></div>
|
||||
<mk-avatar class="avatar" :user="user" :disable-preview="true"/>
|
||||
<mk-follow-button :user="user" class="follow"/>
|
||||
<mk-follow-button :user="user" class="follow" mini/>
|
||||
<div class="body">
|
||||
<router-link :to="user | userPage" class="name">{{ user | userName }}</router-link>
|
||||
<span class="username">@{{ user | acct }}</span>
|
||||
|
|
|
|||
|
|
@ -19,7 +19,7 @@
|
|||
<p>{{ $t('followers') }}</p><span>{{ u.followersCount }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<mk-follow-button v-if="$store.getters.isSignedIn && u.id != $store.state.i.id" :user="u"/>
|
||||
<mk-follow-button class="follow-button" v-if="$store.getters.isSignedIn && u.id != $store.state.i.id" :user="u" mini/>
|
||||
</template>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -154,7 +154,7 @@ export default Vue.extend({
|
|||
font-size 1em
|
||||
color var(--primary)
|
||||
|
||||
> .mk-follow-button
|
||||
> .follow-button
|
||||
position absolute
|
||||
top 92px
|
||||
right 8px
|
||||
|
|
|
|||
|
|
@ -14,7 +14,7 @@
|
|||
<header :style="bannerStyle">
|
||||
<div>
|
||||
<button class="menu" @click="menu" ref="menu"><fa icon="ellipsis-h"/></button>
|
||||
<mk-follow-button v-if="$store.getters.isSignedIn && user.id != $store.state.i.id" :user="user" class="follow"/>
|
||||
<mk-follow-button v-if="$store.getters.isSignedIn && user.id != $store.state.i.id" :user="user" class="follow" mini/>
|
||||
<mk-avatar class="avatar" :user="user" :disable-preview="true"/>
|
||||
<span class="name">{{ user | userName }}</span>
|
||||
<span class="acct">@{{ user | acct }}</span>
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@
|
|||
<router-link class="name" :to="friend | userPage" v-user-preview="friend.id">{{ friend.name }}</router-link>
|
||||
<p class="username">@{{ friend | acct }}</p>
|
||||
</div>
|
||||
<mk-follow-button :user="friend"/>
|
||||
<mk-follow-button class="follow-button" :user="friend"/>
|
||||
</div>
|
||||
</template>
|
||||
<p class="empty" v-if="!fetching && users.length == 0">{{ $t('no-users') }}</p>
|
||||
|
|
@ -110,7 +110,7 @@ export default Vue.extend({
|
|||
color var(--text)
|
||||
opacity 0.7
|
||||
|
||||
> .mk-follow-button
|
||||
> .follow-button
|
||||
position absolute
|
||||
top 16px
|
||||
right 16px
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<div class="profile" v-if="$store.getters.isSignedIn">
|
||||
<div class="friend-form" v-if="$store.state.i.id != user.id">
|
||||
<mk-follow-button :user="user" size="big"/>
|
||||
<mk-follow-button :user="user" block/>
|
||||
<p class="followed" v-if="user.isFollowed">{{ $t('follows-you') }}</p>
|
||||
<p class="stalk" v-if="user.isFollowing">
|
||||
<span v-if="user.isStalking">{{ $t('stalking') }} <a @click="unstalk"><fa icon="meh"/> {{ $t('unstalk') }}</a></span>
|
||||
|
|
|
|||
|
|
@ -114,11 +114,6 @@ export default define({
|
|||
color var(--text)
|
||||
opacity 0.7
|
||||
|
||||
> .mk-follow-button
|
||||
position absolute
|
||||
top 16px
|
||||
right 16px
|
||||
|
||||
> .empty
|
||||
margin 0
|
||||
padding 16px
|
||||
|
|
|
|||
|
|
@ -1,134 +0,0 @@
|
|||
<template>
|
||||
<button class="mk-follow-button"
|
||||
:class="{ wait: wait, active: u.isFollowing || u.hasPendingFollowRequestFromYou }"
|
||||
@click="onClick"
|
||||
:disabled="wait"
|
||||
>
|
||||
<template v-if="!wait">
|
||||
<template v-if="u.hasPendingFollowRequestFromYou && u.isLocked"><fa icon="hourglass-half"/> {{ $t('request-pending') }}</template>
|
||||
<template v-else-if="u.hasPendingFollowRequestFromYou && !u.isLocked"><fa icon="hourglass-start"/> {{ $t('follow-processing') }}</template>
|
||||
<template v-else-if="u.isFollowing"><fa icon="minus"/> {{ $t('following') }}</template>
|
||||
<template v-else-if="!u.isFollowing && u.isLocked"><fa icon="plus"/> {{ $t('follow-request') }}</template>
|
||||
<template v-else-if="!u.isFollowing && !u.isLocked"><fa icon="plus"/> {{ $t('follow') }}</template>
|
||||
</template>
|
||||
<template v-else><fa icon="spinner .pulse" fixed-width/></template>
|
||||
</button>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import Vue from 'vue';
|
||||
import i18n from '../../../i18n';
|
||||
|
||||
export default Vue.extend({
|
||||
i18n: i18n('mobile/views/components/follow-button.vue'),
|
||||
props: {
|
||||
user: {
|
||||
type: Object,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
|
||||
data() {
|
||||
return {
|
||||
u: this.user,
|
||||
wait: false,
|
||||
connection: null
|
||||
};
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.connection = this.$root.stream.useSharedConnection('main');
|
||||
|
||||
this.connection.on('follow', this.onFollowChange);
|
||||
this.connection.on('unfollow', this.onFollowChange);
|
||||
},
|
||||
|
||||
beforeDestroy() {
|
||||
this.connection.dispose();
|
||||
},
|
||||
|
||||
methods: {
|
||||
onFollowChange(user) {
|
||||
if (user.id == this.u.id) {
|
||||
this.u.isFollowing = user.isFollowing;
|
||||
this.u.hasPendingFollowRequestFromYou = user.hasPendingFollowRequestFromYou;
|
||||
this.$forceUpdate();
|
||||
}
|
||||
},
|
||||
|
||||
async onClick() {
|
||||
this.wait = true;
|
||||
|
||||
try {
|
||||
if (this.u.isFollowing) {
|
||||
this.u = await this.$root.api('following/delete', {
|
||||
userId: this.u.id
|
||||
});
|
||||
} else {
|
||||
if (this.u.hasPendingFollowRequestFromYou) {
|
||||
this.u = await this.$root.api('following/requests/cancel', {
|
||||
userId: this.u.id
|
||||
});
|
||||
} else if (this.u.isLocked) {
|
||||
this.u = await this.$root.api('following/create', {
|
||||
userId: this.u.id
|
||||
});
|
||||
} else {
|
||||
this.u = await this.$root.api('following/create', {
|
||||
userId: this.user.id
|
||||
});
|
||||
}
|
||||
}
|
||||
} catch (e) {
|
||||
console.error(e);
|
||||
} finally {
|
||||
this.wait = false;
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
.mk-follow-button
|
||||
display block
|
||||
user-select none
|
||||
cursor pointer
|
||||
padding 0 16px
|
||||
margin 0
|
||||
min-width 100px
|
||||
line-height 36px
|
||||
font-size 14px
|
||||
font-weight bold
|
||||
color var(--primary)
|
||||
background transparent
|
||||
outline none
|
||||
border solid 1px var(--primary)
|
||||
border-radius 36px
|
||||
|
||||
&:hover
|
||||
background var(--primaryAlpha01)
|
||||
|
||||
&:active
|
||||
background var(--primaryAlpha02)
|
||||
|
||||
&.active
|
||||
color var(--primaryForeground)
|
||||
background var(--primary)
|
||||
|
||||
&:hover
|
||||
background var(--primaryLighten10)
|
||||
border-color var(--primaryLighten10)
|
||||
|
||||
&:active
|
||||
background var(--primaryDarken10)
|
||||
border-color var(--primaryDarken10)
|
||||
|
||||
&.wait
|
||||
cursor wait !important
|
||||
opacity 0.7
|
||||
|
||||
*
|
||||
pointer-events none
|
||||
|
||||
</style>
|
||||
|
|
@ -10,7 +10,6 @@ import subNoteContent from './sub-note-content.vue';
|
|||
import noteCard from './note-card.vue';
|
||||
import userCard from './user-card.vue';
|
||||
import noteDetail from './note-detail.vue';
|
||||
import followButton from './follow-button.vue';
|
||||
import friendsMaker from './friends-maker.vue';
|
||||
import notification from './notification.vue';
|
||||
import notifications from './notifications.vue';
|
||||
|
|
@ -33,7 +32,6 @@ Vue.component('mk-sub-note-content', subNoteContent);
|
|||
Vue.component('mk-note-card', noteCard);
|
||||
Vue.component('mk-user-card', userCard);
|
||||
Vue.component('mk-note-detail', noteDetail);
|
||||
Vue.component('mk-follow-button', followButton);
|
||||
Vue.component('mk-friends-maker', friendsMaker);
|
||||
Vue.component('mk-notification', notification);
|
||||
Vue.component('mk-notifications', notifications);
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@
|
|||
</header>
|
||||
<a class="name" :href="user | userPage" target="_blank">{{ user | userName }}</a>
|
||||
<p class="username"><mk-acct :user="user"/></p>
|
||||
<mk-follow-button :user="user"/>
|
||||
<mk-follow-button class="follow-button" :user="user"/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
|
@ -53,7 +53,7 @@ export default Vue.extend({
|
|||
font-size 15px
|
||||
color #ccc
|
||||
|
||||
> .mk-follow-button
|
||||
> .follow-button
|
||||
display inline-block
|
||||
margin 8px 0 16px 0
|
||||
|
||||
|
|
|
|||
|
|
@ -243,9 +243,6 @@ main
|
|||
font-size 18px
|
||||
color var(--text)
|
||||
|
||||
> .mk-follow-button
|
||||
margin 0
|
||||
|
||||
> .title
|
||||
margin 8px 0
|
||||
|
||||
|
|
|
|||
Loading…
Reference in a new issue