Fix /deep/ selector

This commit is contained in:
AkiraFukushima 2022-04-23 23:14:26 +09:00
parent d82bc7df05
commit b656832290
No known key found for this signature in database
GPG Key ID: B6E51BAC4DE1A957
23 changed files with 262 additions and 350 deletions

View File

@ -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 {

View File

@ -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>

View File

@ -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>

View File

@ -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 {

View File

@ -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 {

View File

@ -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>

View File

@ -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);
}

View File

@ -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 {

View File

@ -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>

View File

@ -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>

View File

@ -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);
}

View File

@ -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 {

View File

@ -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);
}
}

View File

@ -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 {

View File

@ -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;
}
}

View File

@ -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;
}
}

View File

@ -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;
}
}

View File

@ -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;
}
}

View File

@ -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;
}
}

View File

@ -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;
}
}

View File

@ -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;
}
}

View File

@ -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;
}
}

View File

@ -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;
}
}