Fix /deep/ selector
This commit is contained in:
parent
d82bc7df05
commit
b656832290
|
@ -103,7 +103,7 @@ export default {
|
|||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
#authorize /deep/ {
|
||||
#authorize {
|
||||
background-color: #292f3f;
|
||||
color: #ffffff;
|
||||
text-align: center;
|
||||
|
@ -132,14 +132,16 @@ export default {
|
|||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.el-form-item__label {
|
||||
color: #f0f3f9;
|
||||
}
|
||||
.authorize-form :deep() {
|
||||
.el-form-item__label {
|
||||
color: #f0f3f9;
|
||||
}
|
||||
|
||||
.el-input__inner {
|
||||
background-color: #373d48;
|
||||
color: #ffffff;
|
||||
border: 0;
|
||||
.el-input__inner {
|
||||
background-color: #373d48;
|
||||
color: #ffffff;
|
||||
border: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.hidden {
|
||||
|
|
|
@ -23,7 +23,7 @@
|
|||
<FailoverImg :src="`${account.baseURL}/favicon.ico`" :failoverSrc="`${account.baseURL}/favicon.png`" class="instance-icon" />
|
||||
<span slot="title">{{ account.domain }}</span>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="/login" :title="$t('global_header.add_new_account')" role="menuitem">
|
||||
<el-menu-item index="/login" :title="$t('global_header.add_new_account')" role="menuitem" class="add-new-account">
|
||||
<font-awesome-icon icon="plus" />
|
||||
<span slot="new">New</span>
|
||||
</el-menu-item>
|
||||
|
@ -141,5 +141,9 @@ export default {
|
|||
.with-global-header {
|
||||
margin-left: 65px;
|
||||
}
|
||||
|
||||
.add-new-account {
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -22,7 +22,14 @@
|
|||
<el-button type="primary" class="login" @click="login" v-if="allowLogin">
|
||||
{{ $t('login.login') }}
|
||||
</el-button>
|
||||
<el-button type="primary" v-else @click="confirm('loginForm')" v-loading="searching" element-loading-background="rgba(0, 0, 0, 0.8)">
|
||||
<el-button
|
||||
type="primary"
|
||||
class="search"
|
||||
v-else
|
||||
@click="confirm('loginForm')"
|
||||
v-loading="searching"
|
||||
element-loading-background="rgba(0, 0, 0, 0.8)"
|
||||
>
|
||||
{{ $t('login.search') }}
|
||||
</el-button>
|
||||
</el-form-item>
|
||||
|
@ -138,20 +145,10 @@ export default {
|
|||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.login-form /deep/ {
|
||||
.login-form {
|
||||
margin: 0 auto;
|
||||
width: 300px;
|
||||
|
||||
.el-form-item__label {
|
||||
color: #f0f3f9;
|
||||
}
|
||||
|
||||
.el-input__inner {
|
||||
background-color: #373d48;
|
||||
color: #fff;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.instance-group {
|
||||
text-align: left;
|
||||
margin: 0 auto;
|
||||
|
@ -165,12 +162,12 @@ export default {
|
|||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.submit {
|
||||
margin: 0;
|
||||
.search {
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.back {
|
||||
margin-right: 20px;
|
||||
.login {
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.hidden {
|
||||
|
@ -182,4 +179,16 @@ export default {
|
|||
margin-bottom: 24px;
|
||||
}
|
||||
}
|
||||
|
||||
.login-form :deep() {
|
||||
.el-form-item__label {
|
||||
color: #f0f3f9;
|
||||
}
|
||||
|
||||
.el-input__inner {
|
||||
background-color: #373d48;
|
||||
color: #fff;
|
||||
box-shadow: none;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -146,12 +146,12 @@ export default {
|
|||
margin: 24px 0 20px;
|
||||
}
|
||||
|
||||
.section /deep/ {
|
||||
.section {
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
|
||||
.el-form-item__label {
|
||||
color: var(--theme-primary-color);
|
||||
}
|
||||
.section :deep(.el-form-item__label) {
|
||||
color: var(--theme-primary-color);
|
||||
}
|
||||
|
||||
.selection {
|
||||
|
|
|
@ -105,12 +105,12 @@ export default {
|
|||
margin: 24px 0 20px;
|
||||
}
|
||||
|
||||
.section /deep/ {
|
||||
.section {
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
|
||||
.el-form-item__label {
|
||||
color: var(--theme-primary-color);
|
||||
}
|
||||
.section :deep(.el-form-item__label) {
|
||||
color: var(--theme-primary-color);
|
||||
}
|
||||
|
||||
.selection {
|
||||
|
|
|
@ -148,12 +148,12 @@ export default {
|
|||
margin: 24px 0 20px;
|
||||
}
|
||||
|
||||
.section /deep/ {
|
||||
.section {
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
|
||||
.el-form-item__label {
|
||||
color: var(--theme-primary-color);
|
||||
}
|
||||
.section :deep(.el-form-item__label) {
|
||||
color: var(--theme-primary-color);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -155,9 +155,11 @@ export default {
|
|||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.section /deep/ {
|
||||
.section {
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
|
||||
.section :deep() {
|
||||
.el-form-item__label {
|
||||
color: var(--theme-primary-color);
|
||||
}
|
||||
|
|
|
@ -62,12 +62,12 @@ export default {
|
|||
|
||||
<style lang="scss" scoped>
|
||||
#general {
|
||||
.section /deep/ {
|
||||
.section {
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
|
||||
.el-form-item__label {
|
||||
color: var(--theme-primary-color);
|
||||
}
|
||||
.section :deep(.el-form-item__label) {
|
||||
color: var(--theme-primary-color);
|
||||
}
|
||||
|
||||
.notice {
|
||||
|
|
|
@ -1,60 +1,32 @@
|
|||
<template>
|
||||
<div id="timeline">
|
||||
<h2>{{ $t('settings.timeline.title') }}</h2>
|
||||
<el-form
|
||||
class="unread-notification section"
|
||||
size="default"
|
||||
label-position="right"
|
||||
label-width="250px"
|
||||
>
|
||||
<el-form class="unread-notification section" size="default" label-position="right" label-width="250px">
|
||||
<h3>{{ $t('settings.timeline.unread_notification.title') }}</h3>
|
||||
<p class="description">
|
||||
{{ $t('settings.timeline.unread_notification.description') }}
|
||||
</p>
|
||||
|
||||
<el-form-item
|
||||
for="direct"
|
||||
:label="$t('settings.timeline.unread_notification.direct')"
|
||||
>
|
||||
<el-form-item for="direct" :label="$t('settings.timeline.unread_notification.direct')">
|
||||
<el-switch v-model="direct" id="direct" />
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
for="local"
|
||||
:label="$t('settings.timeline.unread_notification.local')"
|
||||
>
|
||||
<el-form-item for="local" :label="$t('settings.timeline.unread_notification.local')">
|
||||
<el-switch v-model="local" id="local" />
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
for="public"
|
||||
:label="$t('settings.timeline.unread_notification.public')"
|
||||
>
|
||||
<el-form-item for="public" :label="$t('settings.timeline.unread_notification.public')">
|
||||
<el-switch v-model="public" id="public" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<el-form
|
||||
class="use-marker section"
|
||||
size="default"
|
||||
label-position="right"
|
||||
label-width="250px"
|
||||
>
|
||||
<el-form class="use-marker section" size="default" label-position="right" label-width="250px">
|
||||
<h3>{{ $t('settings.timeline.use_marker.title') }}</h3>
|
||||
<el-form-item
|
||||
for="marker_home"
|
||||
:label="$t('settings.timeline.use_marker.home')"
|
||||
>
|
||||
<el-form-item for="marker_home" :label="$t('settings.timeline.use_marker.home')">
|
||||
<el-switch v-model="marker_home" id="marker_home" />
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
for="marker_notifications"
|
||||
:label="$t('settings.timeline.use_marker.notifications')"
|
||||
>
|
||||
<el-form-item for="marker_notifications" :label="$t('settings.timeline.use_marker.notifications')">
|
||||
<el-switch v-model="marker_notifications" id="marker_notifications" />
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
for="marker_mentions"
|
||||
:label="$t('settings.timeline.use_marker.mentions')"
|
||||
>
|
||||
<el-form-item for="marker_mentions" :label="$t('settings.timeline.use_marker.mentions')">
|
||||
<el-switch v-model="marker_mentions" id="marker_mentions" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
@ -67,36 +39,33 @@ export default {
|
|||
computed: {
|
||||
direct: {
|
||||
get() {
|
||||
return this.$store.state.Settings.Timeline.setting.unreadNotification
|
||||
.direct
|
||||
return this.$store.state.Settings.Timeline.setting.unreadNotification.direct
|
||||
},
|
||||
set(value) {
|
||||
this.$store.dispatch('Settings/Timeline/changeUnreadNotification', {
|
||||
direct: value,
|
||||
direct: value
|
||||
})
|
||||
},
|
||||
}
|
||||
},
|
||||
local: {
|
||||
get() {
|
||||
return this.$store.state.Settings.Timeline.setting.unreadNotification
|
||||
.local
|
||||
return this.$store.state.Settings.Timeline.setting.unreadNotification.local
|
||||
},
|
||||
set(value) {
|
||||
this.$store.dispatch('Settings/Timeline/changeUnreadNotification', {
|
||||
local: value,
|
||||
local: value
|
||||
})
|
||||
},
|
||||
}
|
||||
},
|
||||
public: {
|
||||
get() {
|
||||
return this.$store.state.Settings.Timeline.setting.unreadNotification
|
||||
.public
|
||||
return this.$store.state.Settings.Timeline.setting.unreadNotification.public
|
||||
},
|
||||
set(value) {
|
||||
this.$store.dispatch('Settings/Timeline/changeUnreadNotification', {
|
||||
public: value,
|
||||
public: value
|
||||
})
|
||||
},
|
||||
}
|
||||
},
|
||||
marker_home: {
|
||||
get() {
|
||||
|
@ -104,20 +73,19 @@ export default {
|
|||
},
|
||||
set(value) {
|
||||
this.$store.dispatch('Settings/Timeline/changeUseMarker', {
|
||||
home: value,
|
||||
home: value
|
||||
})
|
||||
},
|
||||
}
|
||||
},
|
||||
marker_notifications: {
|
||||
get() {
|
||||
return this.$store.state.Settings.Timeline.setting.useMarker
|
||||
.notifications
|
||||
return this.$store.state.Settings.Timeline.setting.useMarker.notifications
|
||||
},
|
||||
set(value) {
|
||||
this.$store.dispatch('Settings/Timeline/changeUseMarker', {
|
||||
notifications: value,
|
||||
notifications: value
|
||||
})
|
||||
},
|
||||
}
|
||||
},
|
||||
marker_mentions: {
|
||||
get() {
|
||||
|
@ -125,14 +93,14 @@ export default {
|
|||
},
|
||||
set(value) {
|
||||
this.$store.dispatch('Settings/Timeline/changeUseMarker', {
|
||||
mentions: value,
|
||||
mentions: value
|
||||
})
|
||||
},
|
||||
},
|
||||
}
|
||||
}
|
||||
},
|
||||
async created() {
|
||||
await this.$store.dispatch('Settings/Timeline/loadTimelineSetting')
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
|
@ -142,12 +110,12 @@ export default {
|
|||
margin: 32px 0 20px;
|
||||
}
|
||||
|
||||
.section /deep/ {
|
||||
.section {
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
|
||||
.el-form-item__label {
|
||||
color: var(--theme-primary-color);
|
||||
}
|
||||
.section :deep(.el-form-item__label) {
|
||||
color: var(--theme-primary-color);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -21,7 +21,7 @@
|
|||
</template>
|
||||
</DynamicScroller>
|
||||
<div :class="openSideBar ? 'upper-with-side-bar' : 'upper'" v-show="!heading">
|
||||
<el-button type="primary" :icon="ElIconArrowUp" @click="upper" circle>
|
||||
<el-button type="primary" @click="upper" circle>
|
||||
<font-awesome-icon icon="angle-up" class="upper-icon" />
|
||||
</el-button>
|
||||
</div>
|
||||
|
|
|
@ -2,20 +2,12 @@
|
|||
<div id="list">
|
||||
<table class="tag-list">
|
||||
<tbody>
|
||||
<tr
|
||||
v-for="tag in tags"
|
||||
v-bind:key="tag._id"
|
||||
@click.stop.prevent="openTimeline(tag.tagName)"
|
||||
>
|
||||
<tr v-for="tag in tags" v-bind:key="tag._id" @click.stop.prevent="openTimeline(tag.tagName)">
|
||||
<td>
|
||||
{{ tag.tagName }}
|
||||
</td>
|
||||
<td class="action">
|
||||
<el-button
|
||||
type="text"
|
||||
@click.stop="deleteTag(tag)"
|
||||
:title="$t('hashtag.delete_tag')"
|
||||
>
|
||||
<el-button type="text" @click.stop="deleteTag(tag)" :title="$t('hashtag.delete_tag')">
|
||||
<font-awesome-icon :icon="['far', 'trash-can']" />
|
||||
</el-button>
|
||||
</td>
|
||||
|
@ -32,8 +24,8 @@ export default {
|
|||
name: 'list',
|
||||
computed: {
|
||||
...mapState({
|
||||
tags: (state) => state.TimelineSpace.Contents.Hashtag.List.tags,
|
||||
}),
|
||||
tags: state => state.TimelineSpace.Contents.Hashtag.List.tags
|
||||
})
|
||||
},
|
||||
created() {
|
||||
this.$store.dispatch('TimelineSpace/Contents/Hashtag/List/listTags')
|
||||
|
@ -41,13 +33,13 @@ export default {
|
|||
methods: {
|
||||
openTimeline(tagName) {
|
||||
this.$router.push({
|
||||
path: `/${this.$route.params.id}/hashtag/${tagName}`,
|
||||
path: `/${this.$route.params.id}/hashtag/${tagName}`
|
||||
})
|
||||
},
|
||||
deleteTag(tag) {
|
||||
this.$store.dispatch('TimelineSpace/Contents/Hashtag/List/removeTag', tag)
|
||||
},
|
||||
},
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
|
@ -73,7 +65,7 @@ export default {
|
|||
.action {
|
||||
width: 20px;
|
||||
|
||||
.el-button /deep/ {
|
||||
.el-button {
|
||||
padding: 0;
|
||||
color: var(--theme-secondary-color);
|
||||
}
|
||||
|
|
|
@ -389,9 +389,19 @@ export default {
|
|||
margin: 0 auto 12px auto;
|
||||
}
|
||||
|
||||
.username :deep(.emojione) {
|
||||
max-width: 1em;
|
||||
max-height: 1em;
|
||||
}
|
||||
|
||||
.account {
|
||||
color: #409eff;
|
||||
}
|
||||
|
||||
.note :deep(.emojione) {
|
||||
max-width: 1.2em;
|
||||
height: 1.2em;
|
||||
}
|
||||
}
|
||||
|
||||
.identity {
|
||||
|
|
|
@ -3,51 +3,25 @@
|
|||
<template v-if="poll">
|
||||
<ul class="poll-list">
|
||||
<template v-if="poll.voted">
|
||||
<li
|
||||
class="voted"
|
||||
v-for="(option, id) in poll.options"
|
||||
v-bind:key="id"
|
||||
>
|
||||
<span
|
||||
class="progress-bar"
|
||||
:style="
|
||||
progress(percentage(option.votes_count, poll.votes_count))
|
||||
"
|
||||
></span>
|
||||
<li class="voted" v-for="(option, id) in poll.options" v-bind:key="id">
|
||||
<span class="progress-bar" :style="progress(percentage(option.votes_count, poll.votes_count))"></span>
|
||||
<label class="text">
|
||||
<span class="percentage"
|
||||
>{{ percentage(option.votes_count, poll.votes_count) }}%</span
|
||||
>
|
||||
<span class="percentage">{{ percentage(option.votes_count, poll.votes_count) }}%</span>
|
||||
<span>{{ option.title }}</span>
|
||||
</label>
|
||||
</li>
|
||||
</template>
|
||||
<template v-else>
|
||||
<li
|
||||
class="not-voted"
|
||||
v-for="(option, id) in poll.options"
|
||||
v-bind:key="id"
|
||||
>
|
||||
<el-radio v-model="pollRadio" :label="id">{{
|
||||
option.title
|
||||
}}</el-radio>
|
||||
<li class="not-voted" v-for="(option, id) in poll.options" v-bind:key="id">
|
||||
<el-radio v-model="pollRadio" :label="id">{{ option.title }}</el-radio>
|
||||
</li>
|
||||
</template>
|
||||
</ul>
|
||||
<el-button
|
||||
v-if="!poll.voted"
|
||||
type="success"
|
||||
size="small"
|
||||
@click="vote"
|
||||
:disabled="pollRadio === null"
|
||||
>{{ $t('cards.toot.poll.vote') }}</el-button
|
||||
>
|
||||
<el-button v-else type="text" @click="refresh">{{
|
||||
$t('cards.toot.poll.refresh')
|
||||
<el-button v-if="!poll.voted" type="success" size="small" @click="vote" :disabled="pollRadio === null">{{
|
||||
$t('cards.toot.poll.vote')
|
||||
}}</el-button>
|
||||
<span class="votes-count"
|
||||
>{{ poll.votes_count }} {{ $t('cards.toot.poll.votes_count') }},</span
|
||||
>
|
||||
<el-button v-else type="text" @click="refresh">{{ $t('cards.toot.poll.refresh') }}</el-button>
|
||||
<span class="votes-count">{{ poll.votes_count }} {{ $t('cards.toot.poll.votes_count') }},</span>
|
||||
<span class="until">{{ parseDatetime(poll.expires_at, now) }}</span>
|
||||
</template>
|
||||
</div>
|
||||
|
@ -62,32 +36,32 @@ export default {
|
|||
data() {
|
||||
return {
|
||||
pollRadio: null,
|
||||
now: Date.now(),
|
||||
now: Date.now()
|
||||
}
|
||||
},
|
||||
props: {
|
||||
poll: {
|
||||
type: Object,
|
||||
default: null,
|
||||
},
|
||||
default: null
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapState('App', {
|
||||
timeFormat: (state) => state.timeFormat,
|
||||
language: (state) => state.language,
|
||||
}),
|
||||
timeFormat: state => state.timeFormat,
|
||||
language: state => state.language
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
parseDatetime(datetime, epoch) {
|
||||
switch (this.timeFormat) {
|
||||
case TimeFormat.Absolute.value:
|
||||
return this.$t('cards.toot.poll.until', {
|
||||
datetime: moment(datetime).format('YYYY-MM-DD HH:mm:ss'),
|
||||
datetime: moment(datetime).format('YYYY-MM-DD HH:mm:ss')
|
||||
})
|
||||
case TimeFormat.Relative.value:
|
||||
moment.locale(this.language)
|
||||
return this.$t('cards.toot.poll.left', {
|
||||
datetime: moment(datetime).from(epoch),
|
||||
datetime: moment(datetime).from(epoch)
|
||||
})
|
||||
}
|
||||
},
|
||||
|
@ -107,8 +81,8 @@ export default {
|
|||
},
|
||||
refresh() {
|
||||
this.$emit('refresh', this.poll.id)
|
||||
},
|
||||
},
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
|
@ -123,7 +97,7 @@ export default {
|
|||
margin: 4px 0;
|
||||
line-height: 32px;
|
||||
|
||||
.el-radio /deep/ {
|
||||
.el-radio {
|
||||
color: var(--theme-regular-color);
|
||||
}
|
||||
}
|
||||
|
|
|
@ -24,12 +24,7 @@
|
|||
>
|
||||
<font-awesome-icon icon="user-xmark" />
|
||||
</el-button>
|
||||
<el-button
|
||||
v-else-if="relationship.requested"
|
||||
class="requested"
|
||||
type="text"
|
||||
:title="$t('side_bar.account_profile.follow_requested')"
|
||||
>
|
||||
<el-button v-else-if="relationship.requested" class="requested" type="text" :title="$t('side_bar.account_profile.follow_requested')">
|
||||
<font-awesome-icon icon="hourglass" />
|
||||
</el-button>
|
||||
<el-button
|
||||
|
@ -43,20 +38,10 @@
|
|||
</el-button>
|
||||
</div>
|
||||
<div class="tool" v-else-if="request">
|
||||
<el-button
|
||||
class="accept"
|
||||
type="text"
|
||||
@click.stop.prevent="acceptRequest(user)"
|
||||
:title="$t('follow_requests.accept')"
|
||||
>
|
||||
<el-button class="accept" type="text" @click.stop.prevent="acceptRequest(user)" :title="$t('follow_requests.accept')">
|
||||
<font-awesome-icon icon="check" />
|
||||
</el-button>
|
||||
<el-button
|
||||
class="reject"
|
||||
type="text"
|
||||
@click.stop.prevent="rejectRequest(user)"
|
||||
:tilte="$t('follow_requests.reject')"
|
||||
>
|
||||
<el-button class="reject" type="text" @click.stop.prevent="rejectRequest(user)" :tilte="$t('follow_requests.reject')">
|
||||
<font-awesome-icon icon="xmark" />
|
||||
</el-button>
|
||||
</div>
|
||||
|
@ -70,25 +55,25 @@ import emojify from '~/src/renderer/utils/emojify'
|
|||
export default {
|
||||
name: 'user',
|
||||
components: {
|
||||
FailoverImg,
|
||||
FailoverImg
|
||||
},
|
||||
props: {
|
||||
user: {
|
||||
type: Object,
|
||||
default: {},
|
||||
default: {}
|
||||
},
|
||||
remove: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
default: false
|
||||
},
|
||||
relationship: {
|
||||
type: Object,
|
||||
default: null,
|
||||
default: null
|
||||
},
|
||||
request: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
default: false
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
username(account) {
|
||||
|
@ -99,17 +84,9 @@ export default {
|
|||
}
|
||||
},
|
||||
openUser(account) {
|
||||
this.$store.dispatch(
|
||||
'TimelineSpace/Contents/SideBar/openAccountComponent'
|
||||
)
|
||||
this.$store.dispatch(
|
||||
'TimelineSpace/Contents/SideBar/AccountProfile/changeAccount',
|
||||
account
|
||||
)
|
||||
this.$store.commit(
|
||||
'TimelineSpace/Contents/SideBar/changeOpenSideBar',
|
||||
true
|
||||
)
|
||||
this.$store.dispatch('TimelineSpace/Contents/SideBar/openAccountComponent')
|
||||
this.$store.dispatch('TimelineSpace/Contents/SideBar/AccountProfile/changeAccount', account)
|
||||
this.$store.commit('TimelineSpace/Contents/SideBar/changeOpenSideBar', true)
|
||||
},
|
||||
removeAccount(account) {
|
||||
this.$emit('removeAccount', account)
|
||||
|
@ -125,8 +102,8 @@ export default {
|
|||
},
|
||||
rejectRequest(account) {
|
||||
this.$emit('rejectRequest', account)
|
||||
},
|
||||
},
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
|
@ -164,11 +141,9 @@ export default {
|
|||
padding-left: 8px;
|
||||
overflow: hidden;
|
||||
|
||||
.username /deep/ {
|
||||
.emojione {
|
||||
max-width: 1em;
|
||||
max-height: 1em;
|
||||
}
|
||||
.username :deep(.emojione) {
|
||||
max-width: 1em;
|
||||
max-height: 1em;
|
||||
}
|
||||
|
||||
.acct {
|
||||
|
|
|
@ -82,8 +82,8 @@
|
|||
</el-button>
|
||||
<div class="media" v-bind:key="media.preview_url" v-for="media in mediaAttachments(message.status)">
|
||||
<FailoverImg :src="media.preview_url" :title="media.description" :readExif="true" />
|
||||
<el-tag class="media-label" size="mini" v-if="media.type == 'gifv'">GIF</el-tag>
|
||||
<el-tag class="media-label" size="mini" v-else-if="media.type == 'video'">VIDEO</el-tag>
|
||||
<el-tag class="media-label" size="small" v-if="media.type == 'gifv'">GIF</el-tag>
|
||||
<el-tag class="media-label" size="small" v-else-if="media.type == 'video'">VIDEO</el-tag>
|
||||
</div>
|
||||
</div>
|
||||
<div class="clearfix"></div>
|
||||
|
@ -312,13 +312,13 @@ export default {
|
|||
float: left;
|
||||
max-width: 80%;
|
||||
|
||||
.bold /deep/ {
|
||||
.bold {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.emojione {
|
||||
max-width: 14px;
|
||||
max-height: 14px;
|
||||
}
|
||||
.bold :deep(.emojione) {
|
||||
max-width: 14px;
|
||||
max-height: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -351,7 +351,7 @@ export default {
|
|||
margin: 8px 8px 0 42px;
|
||||
color: #909399;
|
||||
|
||||
.content-wrapper /deep/ {
|
||||
.content-wrapper {
|
||||
font-size: var(--base-font-size);
|
||||
margin: 0;
|
||||
|
||||
|
@ -363,11 +363,11 @@ export default {
|
|||
.content p {
|
||||
unicode-bidi: plaintext;
|
||||
}
|
||||
}
|
||||
|
||||
.emojione {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
}
|
||||
.content-wrapper :deep(.emojione) {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
}
|
||||
|
||||
.toot-header {
|
||||
|
@ -378,11 +378,9 @@ export default {
|
|||
font-size: var(--base-font-size);
|
||||
cursor: pointer;
|
||||
|
||||
.display-name /deep/ {
|
||||
.emojione {
|
||||
max-width: 14px;
|
||||
max-height: 14px;
|
||||
}
|
||||
.display-name :deep(.emojione) {
|
||||
max-width: 14px;
|
||||
max-height: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -133,13 +133,13 @@ export default {
|
|||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
|
||||
.bold /deep/ {
|
||||
.bold {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.emojione {
|
||||
max-width: 14px;
|
||||
max-height: 14px;
|
||||
}
|
||||
.bold :deep(.emojione) {
|
||||
max-width: 14px;
|
||||
max-height: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -133,13 +133,13 @@ export default {
|
|||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
|
||||
.bold /deep/ {
|
||||
.bold {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.emojione {
|
||||
max-width: 14px;
|
||||
max-height: 14px;
|
||||
}
|
||||
.bold :deep(.emojione) {
|
||||
max-width: 14px;
|
||||
max-height: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -82,8 +82,8 @@
|
|||
</el-button>
|
||||
<div class="media" v-bind:key="media.preview_url" v-for="media in mediaAttachments(message.status)">
|
||||
<FailoverImg :src="media.preview_url" :title="media.description" :readExif="true" />
|
||||
<el-tag class="media-label" size="mini" v-if="media.type == 'gifv'">GIF</el-tag>
|
||||
<el-tag class="media-label" size="mini" v-else-if="media.type == 'video'">VIDEO</el-tag>
|
||||
<el-tag class="media-label" size="small" v-if="media.type == 'gifv'">GIF</el-tag>
|
||||
<el-tag class="media-label" size="small" v-else-if="media.type == 'video'">VIDEO</el-tag>
|
||||
</div>
|
||||
</div>
|
||||
<div class="clearfix"></div>
|
||||
|
@ -312,13 +312,13 @@ export default {
|
|||
float: left;
|
||||
max-width: 80%;
|
||||
|
||||
.bold /deep/ {
|
||||
.bold {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.emojione {
|
||||
max-width: 14px;
|
||||
max-height: 14px;
|
||||
}
|
||||
.bold :deep(.emojione) {
|
||||
max-width: 14px;
|
||||
max-height: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -351,7 +351,7 @@ export default {
|
|||
margin: 8px 8px 0 42px;
|
||||
color: #909399;
|
||||
|
||||
.content-wrapper /deep/ {
|
||||
.content-wrapper {
|
||||
font-size: var(--base-font-size);
|
||||
margin: 0;
|
||||
|
||||
|
@ -363,11 +363,11 @@ export default {
|
|||
.content p {
|
||||
unicode-bidi: plaintext;
|
||||
}
|
||||
}
|
||||
|
||||
.emojione {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
}
|
||||
.content-wrapper :deep(.emojione) {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
}
|
||||
|
||||
.toot-header {
|
||||
|
@ -378,11 +378,9 @@ export default {
|
|||
font-size: var(--base-font-size);
|
||||
cursor: pointer;
|
||||
|
||||
.display-name /deep/ {
|
||||
.emojione {
|
||||
max-width: 14px;
|
||||
max-height: 14px;
|
||||
}
|
||||
.display-name :deep(.emojione) {
|
||||
max-width: 14px;
|
||||
max-height: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -82,8 +82,8 @@
|
|||
</el-button>
|
||||
<div class="media" v-bind:key="media.preview_url" v-for="media in mediaAttachments(message.status)">
|
||||
<FailoverImg :src="media.preview_url" :title="media.description" :readExif="true" />
|
||||
<el-tag class="media-label" size="mini" v-if="media.type == 'gifv'">GIF</el-tag>
|
||||
<el-tag class="media-label" size="mini" v-else-if="media.type == 'video'">VIDEO</el-tag>
|
||||
<el-tag class="media-label" size="small" v-if="media.type == 'gifv'">GIF</el-tag>
|
||||
<el-tag class="media-label" size="small" v-else-if="media.type == 'video'">VIDEO</el-tag>
|
||||
</div>
|
||||
</div>
|
||||
<div class="clearfix"></div>
|
||||
|
@ -312,13 +312,12 @@ export default {
|
|||
float: left;
|
||||
max-width: 80%;
|
||||
|
||||
.bold /deep/ {
|
||||
.bold {
|
||||
cursor: pointer;
|
||||
|
||||
.emojione {
|
||||
max-width: 14px;
|
||||
max-height: 14px;
|
||||
}
|
||||
}
|
||||
.bold :deep(.emojione) {
|
||||
max-width: 14px;
|
||||
max-height: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -351,7 +350,7 @@ export default {
|
|||
margin: 8px 8px 0 42px;
|
||||
color: #909399;
|
||||
|
||||
.content-wrapper /deep/ {
|
||||
.content-wrapper {
|
||||
font-size: var(--base-font-size);
|
||||
margin: 0;
|
||||
|
||||
|
@ -363,11 +362,11 @@ export default {
|
|||
.content p {
|
||||
unicode-bidi: plaintext;
|
||||
}
|
||||
}
|
||||
|
||||
.emojione {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
}
|
||||
.content-wrapper :deep(.emojione) {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
}
|
||||
|
||||
.toot-header {
|
||||
|
@ -378,11 +377,9 @@ export default {
|
|||
font-size: var(--base-font-size);
|
||||
cursor: pointer;
|
||||
|
||||
.display-name /deep/ {
|
||||
.emojione {
|
||||
max-width: 14px;
|
||||
max-height: 14px;
|
||||
}
|
||||
.display-name :deep(.emojione) {
|
||||
max-width: 14px;
|
||||
max-height: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -84,8 +84,8 @@
|
|||
</el-button>
|
||||
<div class="media" v-bind:key="media.preview_url" v-for="media in mediaAttachments(message.status)">
|
||||
<FailoverImg :src="media.preview_url" :title="media.description" :readExif="true" />
|
||||
<el-tag class="media-label" size="mini" v-if="media.type == 'gifv'">GIF</el-tag>
|
||||
<el-tag class="media-label" size="mini" v-else-if="media.type == 'video'">VIDEO</el-tag>
|
||||
<el-tag class="media-label" size="small" v-if="media.type == 'gifv'">GIF</el-tag>
|
||||
<el-tag class="media-label" size="small" v-else-if="media.type == 'video'">VIDEO</el-tag>
|
||||
</div>
|
||||
</div>
|
||||
<div class="clearfix"></div>
|
||||
|
@ -319,13 +319,13 @@ export default {
|
|||
float: left;
|
||||
max-width: 80%;
|
||||
|
||||
.bold /deep/ {
|
||||
.bold {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.emojione {
|
||||
max-width: 14px;
|
||||
max-height: 14px;
|
||||
}
|
||||
.bold :deep(.emojione) {
|
||||
max-width: 14px;
|
||||
max-height: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -358,7 +358,7 @@ export default {
|
|||
margin: 8px 8px 0 42px;
|
||||
color: #909399;
|
||||
|
||||
.content-wrapper /deep/ {
|
||||
.content-wrapper {
|
||||
font-size: var(--base-font-size);
|
||||
margin: 0;
|
||||
|
||||
|
@ -366,11 +366,11 @@ export default {
|
|||
font-size: var(--base-font-size);
|
||||
word-wrap: break-word;
|
||||
}
|
||||
}
|
||||
|
||||
.emojione {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
}
|
||||
.content-wrapper :deep(.emojione) {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
}
|
||||
|
||||
.toot-header {
|
||||
|
@ -380,11 +380,9 @@ export default {
|
|||
float: left;
|
||||
font-size: var(--base-font-size);
|
||||
|
||||
.display-name /deep/ {
|
||||
.emojione {
|
||||
max-width: 14px;
|
||||
max-height: 14px;
|
||||
}
|
||||
.display-name :deep(.emojione) {
|
||||
max-width: 14px;
|
||||
max-height: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -82,8 +82,8 @@
|
|||
</el-button>
|
||||
<div class="media" v-bind:key="media.preview_url" v-for="media in mediaAttachments(message.status)">
|
||||
<FailoverImg :src="media.preview_url" :title="media.description" :readExif="true" />
|
||||
<el-tag class="media-label" size="mini" v-if="media.type == 'gifv'">GIF</el-tag>
|
||||
<el-tag class="media-label" size="mini" v-else-if="media.type == 'video'">VIDEO</el-tag>
|
||||
<el-tag class="media-label" size="small" v-if="media.type == 'gifv'">GIF</el-tag>
|
||||
<el-tag class="media-label" size="small" v-else-if="media.type == 'video'">VIDEO</el-tag>
|
||||
</div>
|
||||
</div>
|
||||
<div class="clearfix"></div>
|
||||
|
@ -312,13 +312,13 @@ export default {
|
|||
float: left;
|
||||
max-width: 80%;
|
||||
|
||||
.bold /deep/ {
|
||||
.bold {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.emojione {
|
||||
max-width: 14px;
|
||||
max-height: 14px;
|
||||
}
|
||||
.bold :deep(.emojione) {
|
||||
max-width: 14px;
|
||||
max-height: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -351,7 +351,7 @@ export default {
|
|||
margin: 8px 8px 0 42px;
|
||||
color: #909399;
|
||||
|
||||
.content-wrapper /deep/ {
|
||||
.content-wrapper {
|
||||
font-size: var(--base-font-size);
|
||||
margin: 0;
|
||||
|
||||
|
@ -363,11 +363,11 @@ export default {
|
|||
.content p {
|
||||
unicode-bidi: plaintext;
|
||||
}
|
||||
}
|
||||
|
||||
.emojione {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
}
|
||||
.content-wrapper :deep(.emojione) {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
}
|
||||
|
||||
.toot-header {
|
||||
|
@ -378,11 +378,9 @@ export default {
|
|||
font-size: var(--base-font-size);
|
||||
cursor: pointer;
|
||||
|
||||
.display-name /deep/ {
|
||||
.emojione {
|
||||
max-width: 14px;
|
||||
max-height: 14px;
|
||||
}
|
||||
.display-name :deep(.emojione) {
|
||||
max-width: 14px;
|
||||
max-height: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -84,8 +84,8 @@
|
|||
</el-button>
|
||||
<div class="media" v-bind:key="media.preview_url" v-for="media in mediaAttachments(message.status)">
|
||||
<FailoverImg :src="media.preview_url" :title="media.description" :readExif="true" />
|
||||
<el-tag class="media-label" size="mini" v-if="media.type == 'gifv'">GIF</el-tag>
|
||||
<el-tag class="media-label" size="mini" v-else-if="media.type == 'video'">VIDEO</el-tag>
|
||||
<el-tag class="media-label" size="small" v-if="media.type == 'gifv'">GIF</el-tag>
|
||||
<el-tag class="media-label" size="small" v-else-if="media.type == 'video'">VIDEO</el-tag>
|
||||
</div>
|
||||
</div>
|
||||
<div class="clearfix"></div>
|
||||
|
@ -312,13 +312,13 @@ export default {
|
|||
float: left;
|
||||
max-width: 80%;
|
||||
|
||||
.bold /deep/ {
|
||||
.bold {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.emojione {
|
||||
max-width: 14px;
|
||||
max-height: 14px;
|
||||
}
|
||||
.bold :deep(.emojione) {
|
||||
max-width: 14px;
|
||||
max-height: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -351,7 +351,7 @@ export default {
|
|||
margin: 8px 8px 0 42px;
|
||||
color: #909399;
|
||||
|
||||
.content-wrapper /deep/ {
|
||||
.content-wrapper {
|
||||
font-size: var(--base-font-size);
|
||||
margin: 0;
|
||||
|
||||
|
@ -359,11 +359,11 @@ export default {
|
|||
font-size: var(--base-font-size);
|
||||
word-wrap: break-word;
|
||||
}
|
||||
}
|
||||
|
||||
.emojione {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
}
|
||||
.content-wrapper :deep(.emojione) {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
}
|
||||
|
||||
.toot-header {
|
||||
|
@ -373,11 +373,9 @@ export default {
|
|||
float: left;
|
||||
font-size: var(--base-font-size);
|
||||
|
||||
.display-name /deep/ {
|
||||
.emojione {
|
||||
max-width: 14px;
|
||||
max-height: 14px;
|
||||
}
|
||||
.display-name :deep(.emojione) {
|
||||
max-width: 14px;
|
||||
max-height: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -10,17 +10,14 @@
|
|||
v-html="
|
||||
$t('notification.status.body', {
|
||||
username: username(message.account),
|
||||
interpolation: { escapeValue: false },
|
||||
interpolation: { escapeValue: false }
|
||||
})
|
||||
"
|
||||
></bdi>
|
||||
</span>
|
||||
</div>
|
||||
<div class="action-icon" role="presentation">
|
||||
<FailoverImg
|
||||
:src="message.account.avatar"
|
||||
:alt="`Avatar of ${message.account.username}`"
|
||||
/>
|
||||
<FailoverImg :src="message.account.avatar" :alt="`Avatar of ${message.account.username}`" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="clearfix"></div>
|
||||
|
@ -51,20 +48,20 @@ export default {
|
|||
props: {
|
||||
message: {
|
||||
type: Object,
|
||||
default: {},
|
||||
default: {}
|
||||
},
|
||||
filters: {
|
||||
type: Array,
|
||||
default: [],
|
||||
default: []
|
||||
},
|
||||
focused: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
default: false
|
||||
},
|
||||
overlaid: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
default: false
|
||||
}
|
||||
},
|
||||
components: { Toot, FailoverImg },
|
||||
methods: {
|
||||
|
@ -82,19 +79,11 @@ export default {
|
|||
}
|
||||
},
|
||||
openUser(account) {
|
||||
this.$store.dispatch(
|
||||
'TimelineSpace/Contents/SideBar/openAccountComponent'
|
||||
)
|
||||
this.$store.dispatch(
|
||||
'TimelineSpace/Contents/SideBar/AccountProfile/changeAccount',
|
||||
account
|
||||
)
|
||||
this.$store.commit(
|
||||
'TimelineSpace/Contents/SideBar/changeOpenSideBar',
|
||||
true
|
||||
)
|
||||
},
|
||||
},
|
||||
this.$store.dispatch('TimelineSpace/Contents/SideBar/openAccountComponent')
|
||||
this.$store.dispatch('TimelineSpace/Contents/SideBar/AccountProfile/changeAccount', account)
|
||||
this.$store.commit('TimelineSpace/Contents/SideBar/changeOpenSideBar', true)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
|
@ -123,13 +112,13 @@ export default {
|
|||
float: left;
|
||||
max-width: 80%;
|
||||
|
||||
.bold /deep/ {
|
||||
.bold {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.emojione {
|
||||
max-width: 14px;
|
||||
max-height: 14px;
|
||||
}
|
||||
.bold :deep(.emojione) {
|
||||
max-width: 14px;
|
||||
max-height: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
Loading…
Reference in New Issue