Use more clear explanation in the scope notice, make sure the hide button doesn't overlap with text in notice.
This commit is contained in:
parent
4af343374a
commit
a89010843d
7 changed files with 30 additions and 18 deletions
13
src/App.scss
13
src/App.scss
|
@ -648,6 +648,19 @@ nav {
|
||||||
border-radius: var(--inputRadius, $fallback--inputRadius);
|
border-radius: var(--inputRadius, $fallback--inputRadius);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.notice-dismissible {
|
||||||
|
padding-right: 4rem;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
.dismiss {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
right: 0;
|
||||||
|
padding: .5em;
|
||||||
|
color: inherit;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
@keyframes modal-background-fadein {
|
@keyframes modal-background-fadein {
|
||||||
from {
|
from {
|
||||||
background-color: rgba(0, 0, 0, 0);
|
background-color: rgba(0, 0, 0, 0);
|
||||||
|
|
|
@ -12,8 +12,7 @@ const MobilePostStatusModal = {
|
||||||
scrollingDown: false,
|
scrollingDown: false,
|
||||||
inputActive: false,
|
inputActive: false,
|
||||||
oldScrollPos: 0,
|
oldScrollPos: 0,
|
||||||
amountScrolled: 0,
|
amountScrolled: 0
|
||||||
visibility: this.$store.state.users.currentUser.default_scope
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
created () {
|
created () {
|
||||||
|
@ -33,9 +32,6 @@ const MobilePostStatusModal = {
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
onScopeChange (visibility) {
|
|
||||||
this.visibility = visibility
|
|
||||||
},
|
|
||||||
openPostForm () {
|
openPostForm () {
|
||||||
this.postFormOpen = true
|
this.postFormOpen = true
|
||||||
this.hidden = true
|
this.hidden = true
|
||||||
|
|
|
@ -7,7 +7,7 @@
|
||||||
>
|
>
|
||||||
<div class="post-form-modal-panel panel" @click.stop="">
|
<div class="post-form-modal-panel panel" @click.stop="">
|
||||||
<div class="panel-heading">{{$t('post_status.new_status')}}</div>
|
<div class="panel-heading">{{$t('post_status.new_status')}}</div>
|
||||||
<PostStatusForm class="panel-body" @posted="closePostForm" @onScopeChange="onScopeChange" />
|
<PostStatusForm class="panel-body" @posted="closePostForm" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<button
|
<button
|
||||||
|
|
|
@ -341,7 +341,6 @@ const PostStatusForm = {
|
||||||
},
|
},
|
||||||
changeVis (visibility) {
|
changeVis (visibility) {
|
||||||
this.newStatus.visibility = visibility
|
this.newStatus.visibility = visibility
|
||||||
this.$emit('onScopeChange', visibility)
|
|
||||||
},
|
},
|
||||||
dismissScopeNotice () {
|
dismissScopeNotice () {
|
||||||
this.$store.dispatch('setOption', { name: 'hideScopeNotice', value: true })
|
this.$store.dispatch('setOption', { name: 'hideScopeNotice', value: true })
|
||||||
|
|
|
@ -9,21 +9,21 @@
|
||||||
class="visibility-notice">
|
class="visibility-notice">
|
||||||
<router-link :to="{ name: 'user-settings' }">{{ $t('post_status.account_not_locked_warning_link') }}</router-link>
|
<router-link :to="{ name: 'user-settings' }">{{ $t('post_status.account_not_locked_warning_link') }}</router-link>
|
||||||
</i18n>
|
</i18n>
|
||||||
<p v-if="!hideScopeNotice && newStatus.visibility === 'public'" class="visibility-notice">
|
<p v-if="!hideScopeNotice && newStatus.visibility === 'public'" class="visibility-notice notice-dismissible">
|
||||||
<span>{{ $t('post_status.scope_notice.public') }}</span>
|
<span>{{ $t('post_status.scope_notice.public') }}</span>
|
||||||
<a v-on:click.prevent="dismissScopeNotice()" style="float: right" class="button-icon">
|
<a v-on:click.prevent="dismissScopeNotice()" class="button-icon dismiss">
|
||||||
<i class='icon-cancel'></i>
|
<i class='icon-cancel'></i>
|
||||||
</a>
|
</a>
|
||||||
</p>
|
</p>
|
||||||
<p v-else-if="!hideScopeNotice && newStatus.visibility === 'unlisted'" class="visibility-notice">
|
<p v-else-if="!hideScopeNotice && newStatus.visibility === 'unlisted'" class="visibility-notice notice-dismissible">
|
||||||
<span>{{ $t('post_status.scope_notice.unlisted') }}</span>
|
<span>{{ $t('post_status.scope_notice.unlisted') }}</span>
|
||||||
<a v-on:click.prevent="dismissScopeNotice()" style="float: right" class="button-icon">
|
<a v-on:click.prevent="dismissScopeNotice()" class="button-icon dismiss">
|
||||||
<i class='icon-cancel'></i>
|
<i class='icon-cancel'></i>
|
||||||
</a>
|
</a>
|
||||||
</p>
|
</p>
|
||||||
<p v-else-if="!hideScopeNotice && newStatus.visibility === 'private'" class="visibility-notice">
|
<p v-else-if="!hideScopeNotice && newStatus.visibility === 'private' && $store.state.users.currentUser.locked" class="visibility-notice notice-dismissible">
|
||||||
<span>{{ $t('post_status.scope_notice.private') }}</span>
|
<span>{{ $t('post_status.scope_notice.private') }}</span>
|
||||||
<a v-on:click.prevent="dismissScopeNotice()" style="float: right" class="button-icon">
|
<a v-on:click.prevent="dismissScopeNotice()" class="button-icon dismiss">
|
||||||
<i class='icon-cancel'></i>
|
<i class='icon-cancel'></i>
|
||||||
</a>
|
</a>
|
||||||
</p>
|
</p>
|
||||||
|
|
|
@ -95,10 +95,9 @@
|
||||||
"direct_warning_to_first_only": "This post will only be visible to the mentioned users at the beginning of the message.",
|
"direct_warning_to_first_only": "This post will only be visible to the mentioned users at the beginning of the message.",
|
||||||
"posting": "Posting",
|
"posting": "Posting",
|
||||||
"scope_notice": {
|
"scope_notice": {
|
||||||
"public": "Post to public timelines",
|
"public": "This post will be visible to everyone",
|
||||||
"private": "Post to followers only",
|
"private": "This post will be visible to your followers only",
|
||||||
"unlisted": "Do not post to public timelines",
|
"unlisted": "This post will not be visible in Public Timeline and The Whole Known Network"
|
||||||
"direct": "Post to mentioned users only"
|
|
||||||
},
|
},
|
||||||
"scope": {
|
"scope": {
|
||||||
"direct": "Direct - Post to mentioned users only",
|
"direct": "Direct - Post to mentioned users only",
|
||||||
|
|
|
@ -42,8 +42,13 @@
|
||||||
"attachments_sensitive": "Вложения содержат чувствительный контент",
|
"attachments_sensitive": "Вложения содержат чувствительный контент",
|
||||||
"content_warning": "Тема (не обязательно)",
|
"content_warning": "Тема (не обязательно)",
|
||||||
"default": "Что нового?",
|
"default": "Что нового?",
|
||||||
"direct_warning": "Этот пост будет видет только упомянутым пользователям",
|
"direct_warning": "Этот пост будет виден только упомянутым пользователям",
|
||||||
"posting": "Отправляется",
|
"posting": "Отправляется",
|
||||||
|
"scope_notice": {
|
||||||
|
"public": "Этот пост будет виден всем",
|
||||||
|
"private": "Этот пост будет виден только вашим подписчикам",
|
||||||
|
"unlisted": "Этот пост не будет виден в публичной и федеративной ленте"
|
||||||
|
},
|
||||||
"scope": {
|
"scope": {
|
||||||
"direct": "Личное - этот пост видят только те кто в нём упомянут",
|
"direct": "Личное - этот пост видят только те кто в нём упомянут",
|
||||||
"private": "Для подписчиков - этот пост видят только подписчики",
|
"private": "Для подписчиков - этот пост видят только подписчики",
|
||||||
|
|
Loading…
Reference in a new issue