Merge branch 'markup-fixes-again' into 'develop'
Fix few markup inconsistencies See merge request pleroma/pleroma-fe!2008
This commit is contained in:
HJ
commit
7d2fd609ef
14 changed files with 365 additions and 324 deletions
1
changelog.d/markup-panels.fix
Normal file
1
changelog.d/markup-panels.fix
Normal file
|
|
@ -0,0 +1 @@
|
|||
Fix few markup panel inconsistencies; better ToS and registration
|
||||
|
|
@ -129,6 +129,7 @@ const setSettings = async ({ apiConfig, staticConfig, store }) => {
|
|||
copyInstanceOption('theme')
|
||||
copyInstanceOption('style')
|
||||
copyInstanceOption('palette')
|
||||
copyInstanceOption('embeddedToS')
|
||||
copyInstanceOption('nsfwCensorImage')
|
||||
copyInstanceOption('background')
|
||||
copyInstanceOption('hidePostStats')
|
||||
|
|
|
|||
|
|
@ -34,7 +34,7 @@
|
|||
</div>
|
||||
<div
|
||||
v-else
|
||||
class="emtpy-chat-list-alert"
|
||||
class="empty-chat-list-alert"
|
||||
>
|
||||
<span>{{ $t('chats.empty_chat_list_placeholder') }}</span>
|
||||
</div>
|
||||
|
|
@ -50,7 +50,7 @@
|
|||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.emtpy-chat-list-alert {
|
||||
.empty-chat-list-alert {
|
||||
padding: 3em;
|
||||
font-size: 1.2em;
|
||||
display: flex;
|
||||
|
|
|
|||
|
|
@ -1,15 +1,18 @@
|
|||
<template>
|
||||
<div class="Drafts">
|
||||
<div class="panel panel-default">
|
||||
<div class="panel-heading">
|
||||
<div class="panel-heading -sticky">
|
||||
<div class="title">
|
||||
{{ $t('drafts.drafts') }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<p v-if="drafts.length === 0">
|
||||
<div
|
||||
v-if="drafts.length === 0"
|
||||
class="empty-drafs-list-alert"
|
||||
>
|
||||
{{ $t('drafts.no_drafts') }}
|
||||
</p>
|
||||
</div>
|
||||
<List
|
||||
v-else
|
||||
:items="drafts"
|
||||
|
|
@ -33,4 +36,13 @@
|
|||
.draft {
|
||||
margin: 1em 0;
|
||||
}
|
||||
|
||||
.empty-drafs-list-alert {
|
||||
padding: 3em;
|
||||
font-size: 1.2em;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
color: var(--textFaint);
|
||||
}
|
||||
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -1,12 +1,12 @@
|
|||
<template>
|
||||
<div class="features-panel">
|
||||
<div class="panel panel-default base01-background">
|
||||
<div class="panel-heading timeline-heading base02-background base04">
|
||||
<div class="panel-heading timeline-heading base02-background base04 -sticky">
|
||||
<h1 class="title">
|
||||
{{ $t('features_panel.title') }}
|
||||
</h1>
|
||||
</div>
|
||||
<div class="panel-body features-panel">
|
||||
<div class="panel-body">
|
||||
<ul>
|
||||
<li v-if="shout">
|
||||
{{ $t('features_panel.shout') }}
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
class="mrf-transparency-panel"
|
||||
>
|
||||
<div class="panel panel-default base01-background">
|
||||
<div class="panel-heading timeline-heading base02-background">
|
||||
<div class="panel-heading timeline-heading base02-background -sticky">
|
||||
<div class="title">
|
||||
{{ $t("about.mrf.federation") }}
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -4,6 +4,7 @@ import { mapActions, mapState } from 'vuex'
|
|||
import InterfaceLanguageSwitcher from '../interface_language_switcher/interface_language_switcher.vue'
|
||||
import localeService from '../../services/locale/locale.service.js'
|
||||
import { DAY } from 'src/services/date_utils/date_utils.js'
|
||||
import TermsOfServicePanel from '../terms_of_service_panel/terms_of_service_panel.vue'
|
||||
|
||||
const registration = {
|
||||
setup () { return { v$: useVuelidate() } },
|
||||
|
|
@ -21,7 +22,8 @@ const registration = {
|
|||
captcha: {}
|
||||
}),
|
||||
components: {
|
||||
InterfaceLanguageSwitcher
|
||||
InterfaceLanguageSwitcher,
|
||||
TermsOfServicePanel
|
||||
},
|
||||
validations () {
|
||||
return {
|
||||
|
|
@ -86,6 +88,7 @@ const registration = {
|
|||
signUpNotice: (state) => state.users.signUpNotice,
|
||||
hasSignUpNotice: (state) => !!state.users.signUpNotice.message,
|
||||
termsOfService: (state) => state.instance.tos,
|
||||
embeddedToS: (state) => state.instance.embeddedToS,
|
||||
accountActivationRequired: (state) => state.instance.accountActivationRequired,
|
||||
accountApprovalRequired: (state) => state.instance.accountApprovalRequired,
|
||||
birthdayRequired: (state) => state.instance.birthdayRequired,
|
||||
|
|
|
|||
|
|
@ -1,321 +1,325 @@
|
|||
<template>
|
||||
<div class="settings panel panel-default">
|
||||
<div class="panel-heading">
|
||||
<h1 class="title">
|
||||
{{ $t('registration.registration') }}
|
||||
</h1>
|
||||
</div>
|
||||
<div
|
||||
v-if="!hasSignUpNotice"
|
||||
class="panel-body"
|
||||
>
|
||||
<form
|
||||
class="registration-form"
|
||||
@submit.prevent="submit(user)"
|
||||
<div class="column-inner">
|
||||
<TermsOfServicePanel v-if="!hasSignUpNotice && !embeddedToS" />
|
||||
<div class="settings panel panel-default">
|
||||
<div class="panel-heading">
|
||||
<h1 class="title">
|
||||
{{ $t('registration.registration') }}
|
||||
</h1>
|
||||
</div>
|
||||
<div
|
||||
v-if="!hasSignUpNotice"
|
||||
class="panel-body"
|
||||
>
|
||||
<div class="container">
|
||||
<div class="text-fields">
|
||||
<div
|
||||
class="form-group"
|
||||
:class="{ 'form-group--error': v$.user.username.$error }"
|
||||
>
|
||||
<label
|
||||
class="form--label"
|
||||
for="sign-up-username"
|
||||
>{{ $t('login.username') }}</label>
|
||||
<input
|
||||
id="sign-up-username"
|
||||
v-model.trim="v$.user.username.$model"
|
||||
:disabled="isPending"
|
||||
class="input form-control"
|
||||
:aria-required="true"
|
||||
:placeholder="$t('registration.username_placeholder')"
|
||||
<form
|
||||
class="registration-form"
|
||||
@submit.prevent="submit(user)"
|
||||
>
|
||||
<div class="container">
|
||||
<div class="text-fields">
|
||||
<div
|
||||
class="form-group"
|
||||
:class="{ 'form-group--error': v$.user.username.$error }"
|
||||
>
|
||||
</div>
|
||||
<div
|
||||
v-if="v$.user.username.$dirty"
|
||||
class="form-error"
|
||||
>
|
||||
<ul>
|
||||
<li v-if="!v$.user.username.required">
|
||||
<span>{{ $t('registration.validations.username_required') }}</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="form-group"
|
||||
:class="{ 'form-group--error': v$.user.fullname.$error }"
|
||||
>
|
||||
<label
|
||||
class="form--label"
|
||||
for="sign-up-fullname"
|
||||
>{{ $t('registration.fullname') }}</label>
|
||||
<input
|
||||
id="sign-up-fullname"
|
||||
v-model.trim="v$.user.fullname.$model"
|
||||
:disabled="isPending"
|
||||
class="input form-control"
|
||||
:aria-required="true"
|
||||
:placeholder="$t('registration.fullname_placeholder')"
|
||||
>
|
||||
</div>
|
||||
<div
|
||||
v-if="v$.user.fullname.$dirty"
|
||||
class="form-error"
|
||||
>
|
||||
<ul>
|
||||
<li v-if="!v$.user.fullname.required">
|
||||
<span>{{ $t('registration.validations.fullname_required') }}</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="form-group"
|
||||
:class="{ 'form-group--error': v$.user.email.$error }"
|
||||
>
|
||||
<label
|
||||
class="form--label"
|
||||
for="email"
|
||||
>{{ accountActivationRequired ? $t('registration.email') : $t('registration.email_optional') }}</label>
|
||||
<input
|
||||
id="email"
|
||||
v-model="v$.user.email.$model"
|
||||
:disabled="isPending"
|
||||
class="input form-control"
|
||||
type="email"
|
||||
:aria-required="accountActivationRequired"
|
||||
>
|
||||
</div>
|
||||
<div
|
||||
v-if="v$.user.email.$dirty"
|
||||
class="form-error"
|
||||
>
|
||||
<ul>
|
||||
<li v-if="!v$.user.email.required">
|
||||
<span>{{ $t('registration.validations.email_required') }}</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label
|
||||
class="form--label"
|
||||
for="bio"
|
||||
>{{ $t('registration.bio_optional') }}</label>
|
||||
<textarea
|
||||
id="bio"
|
||||
v-model="user.bio"
|
||||
:disabled="isPending"
|
||||
class="input form-control"
|
||||
:placeholder="bioPlaceholder"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="form-group"
|
||||
:class="{ 'form-group--error': v$.user.password.$error }"
|
||||
>
|
||||
<label
|
||||
class="form--label"
|
||||
for="sign-up-password"
|
||||
>{{ $t('login.password') }}</label>
|
||||
<input
|
||||
id="sign-up-password"
|
||||
v-model="user.password"
|
||||
:disabled="isPending"
|
||||
class="input form-control"
|
||||
type="password"
|
||||
:aria-required="true"
|
||||
>
|
||||
</div>
|
||||
<div
|
||||
v-if="v$.user.password.$dirty"
|
||||
class="form-error"
|
||||
>
|
||||
<ul>
|
||||
<li v-if="!v$.user.password.required">
|
||||
<span>{{ $t('registration.validations.password_required') }}</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="form-group"
|
||||
:class="{ 'form-group--error': v$.user.confirm.$error }"
|
||||
>
|
||||
<label
|
||||
class="form--label"
|
||||
for="sign-up-password-confirmation"
|
||||
>{{ $t('registration.password_confirm') }}</label>
|
||||
<input
|
||||
id="sign-up-password-confirmation"
|
||||
v-model="user.confirm"
|
||||
:disabled="isPending"
|
||||
class="input form-control"
|
||||
type="password"
|
||||
:aria-required="true"
|
||||
>
|
||||
</div>
|
||||
<div
|
||||
v-if="v$.user.confirm.$dirty"
|
||||
class="form-error"
|
||||
>
|
||||
<ul>
|
||||
<li v-if="v$.user.confirm.required.$invalid">
|
||||
<span>{{ $t('registration.validations.password_confirmation_required') }}</span>
|
||||
</li>
|
||||
<li v-if="v$.user.confirm.sameAs.$invalid">
|
||||
<span>{{ $t('registration.validations.password_confirmation_match') }}</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="form-group"
|
||||
:class="{ 'form-group--error': v$.user.birthday.$error }"
|
||||
>
|
||||
<label
|
||||
class="form--label"
|
||||
for="sign-up-birthday"
|
||||
>
|
||||
{{ birthdayRequired ? $t('registration.birthday') : $t('registration.birthday_optional') }}
|
||||
</label>
|
||||
<input
|
||||
id="sign-up-birthday"
|
||||
v-model="user.birthday"
|
||||
:disabled="isPending"
|
||||
class="input form-control"
|
||||
type="date"
|
||||
:max="birthdayRequired ? birthdayMinAttr : undefined"
|
||||
:aria-required="birthdayRequired"
|
||||
>
|
||||
</div>
|
||||
<div
|
||||
v-if="v$.user.birthday.$dirty"
|
||||
class="form-error"
|
||||
>
|
||||
<ul>
|
||||
<li v-if="v$.user.birthday.required.$invalid">
|
||||
<span>{{ $t('registration.validations.birthday_required') }}</span>
|
||||
</li>
|
||||
<li v-if="v$.user.birthday.maxValue.$invalid">
|
||||
<span>{{ $t('registration.validations.birthday_min_age', { date: birthdayMinFormatted }) }}</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="form-group"
|
||||
:class="{ 'form-group--error': v$.user.language.$error }"
|
||||
>
|
||||
<interface-language-switcher
|
||||
for="email-language"
|
||||
:prompt-text="$t('registration.email_language')"
|
||||
:language="v$.user.language.$model"
|
||||
:set-language="val => v$.user.language.$model = val"
|
||||
@click.stop.prevent
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div
|
||||
v-if="accountApprovalRequired"
|
||||
class="form-group"
|
||||
>
|
||||
<label
|
||||
class="form--label"
|
||||
for="reason"
|
||||
>{{ $t('registration.reason') }}</label>
|
||||
<textarea
|
||||
id="reason"
|
||||
v-model="user.reason"
|
||||
:disabled="isPending"
|
||||
class="input form-control"
|
||||
:placeholder="reasonPlaceholder"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div
|
||||
v-if="captcha.type != 'none'"
|
||||
id="captcha-group"
|
||||
class="form-group"
|
||||
>
|
||||
<label
|
||||
class="form--label"
|
||||
for="captcha-label"
|
||||
>{{ $t('registration.captcha') }}</label>
|
||||
|
||||
<template v-if="['kocaptcha', 'native'].includes(captcha.type)">
|
||||
<img
|
||||
:src="captcha.url"
|
||||
@click="setCaptcha"
|
||||
>
|
||||
|
||||
<sub>{{ $t('registration.new_captcha') }}</sub>
|
||||
|
||||
<label
|
||||
class="form--label"
|
||||
for="sign-up-username"
|
||||
>{{ $t('login.username') }}</label>
|
||||
<input
|
||||
id="captcha-answer"
|
||||
v-model="captcha.solution"
|
||||
id="sign-up-username"
|
||||
v-model.trim="v$.user.username.$model"
|
||||
:disabled="isPending"
|
||||
class="input form-control"
|
||||
type="text"
|
||||
autocomplete="off"
|
||||
autocorrect="off"
|
||||
autocapitalize="off"
|
||||
spellcheck="false"
|
||||
:aria-required="true"
|
||||
:placeholder="$t('registration.username_placeholder')"
|
||||
>
|
||||
</template>
|
||||
</div>
|
||||
<div
|
||||
v-if="v$.user.username.$dirty"
|
||||
class="form-error"
|
||||
>
|
||||
<ul>
|
||||
<li v-if="!v$.user.username.required">
|
||||
<span>{{ $t('registration.validations.username_required') }}</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="form-group"
|
||||
:class="{ 'form-group--error': v$.user.fullname.$error }"
|
||||
>
|
||||
<label
|
||||
class="form--label"
|
||||
for="sign-up-fullname"
|
||||
>{{ $t('registration.fullname') }}</label>
|
||||
<input
|
||||
id="sign-up-fullname"
|
||||
v-model.trim="v$.user.fullname.$model"
|
||||
:disabled="isPending"
|
||||
class="input form-control"
|
||||
:aria-required="true"
|
||||
:placeholder="$t('registration.fullname_placeholder')"
|
||||
>
|
||||
</div>
|
||||
<div
|
||||
v-if="v$.user.fullname.$dirty"
|
||||
class="form-error"
|
||||
>
|
||||
<ul>
|
||||
<li v-if="!v$.user.fullname.required">
|
||||
<span>{{ $t('registration.validations.fullname_required') }}</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="form-group"
|
||||
:class="{ 'form-group--error': v$.user.email.$error }"
|
||||
>
|
||||
<label
|
||||
class="form--label"
|
||||
for="email"
|
||||
>{{ accountActivationRequired ? $t('registration.email') : $t('registration.email_optional') }}</label>
|
||||
<input
|
||||
id="email"
|
||||
v-model="v$.user.email.$model"
|
||||
:disabled="isPending"
|
||||
class="input form-control"
|
||||
type="email"
|
||||
:aria-required="accountActivationRequired"
|
||||
>
|
||||
</div>
|
||||
<div
|
||||
v-if="v$.user.email.$dirty"
|
||||
class="form-error"
|
||||
>
|
||||
<ul>
|
||||
<li v-if="!v$.user.email.required">
|
||||
<span>{{ $t('registration.validations.email_required') }}</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label
|
||||
class="form--label"
|
||||
for="bio"
|
||||
>{{ $t('registration.bio_optional') }}</label>
|
||||
<textarea
|
||||
id="bio"
|
||||
v-model="user.bio"
|
||||
:disabled="isPending"
|
||||
class="input form-control"
|
||||
:placeholder="bioPlaceholder"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="form-group"
|
||||
:class="{ 'form-group--error': v$.user.password.$error }"
|
||||
>
|
||||
<label
|
||||
class="form--label"
|
||||
for="sign-up-password"
|
||||
>{{ $t('login.password') }}</label>
|
||||
<input
|
||||
id="sign-up-password"
|
||||
v-model="user.password"
|
||||
:disabled="isPending"
|
||||
class="input form-control"
|
||||
type="password"
|
||||
:aria-required="true"
|
||||
>
|
||||
</div>
|
||||
<div
|
||||
v-if="v$.user.password.$dirty"
|
||||
class="form-error"
|
||||
>
|
||||
<ul>
|
||||
<li v-if="!v$.user.password.required">
|
||||
<span>{{ $t('registration.validations.password_required') }}</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="form-group"
|
||||
:class="{ 'form-group--error': v$.user.confirm.$error }"
|
||||
>
|
||||
<label
|
||||
class="form--label"
|
||||
for="sign-up-password-confirmation"
|
||||
>{{ $t('registration.password_confirm') }}</label>
|
||||
<input
|
||||
id="sign-up-password-confirmation"
|
||||
v-model="user.confirm"
|
||||
:disabled="isPending"
|
||||
class="input form-control"
|
||||
type="password"
|
||||
:aria-required="true"
|
||||
>
|
||||
</div>
|
||||
<div
|
||||
v-if="v$.user.confirm.$dirty"
|
||||
class="form-error"
|
||||
>
|
||||
<ul>
|
||||
<li v-if="v$.user.confirm.required.$invalid">
|
||||
<span>{{ $t('registration.validations.password_confirmation_required') }}</span>
|
||||
</li>
|
||||
<li v-if="v$.user.confirm.sameAs.$invalid">
|
||||
<span>{{ $t('registration.validations.password_confirmation_match') }}</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="form-group"
|
||||
:class="{ 'form-group--error': v$.user.birthday.$error }"
|
||||
>
|
||||
<label
|
||||
class="form--label"
|
||||
for="sign-up-birthday"
|
||||
>
|
||||
{{ birthdayRequired ? $t('registration.birthday') : $t('registration.birthday_optional') }}
|
||||
</label>
|
||||
<input
|
||||
id="sign-up-birthday"
|
||||
v-model="user.birthday"
|
||||
:disabled="isPending"
|
||||
class="input form-control"
|
||||
type="date"
|
||||
:max="birthdayRequired ? birthdayMinAttr : undefined"
|
||||
:aria-required="birthdayRequired"
|
||||
>
|
||||
</div>
|
||||
<div
|
||||
v-if="v$.user.birthday.$dirty"
|
||||
class="form-error"
|
||||
>
|
||||
<ul>
|
||||
<li v-if="v$.user.birthday.required.$invalid">
|
||||
<span>{{ $t('registration.validations.birthday_required') }}</span>
|
||||
</li>
|
||||
<li v-if="v$.user.birthday.maxValue.$invalid">
|
||||
<span>{{ $t('registration.validations.birthday_min_age', { date: birthdayMinFormatted }) }}</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="form-group"
|
||||
:class="{ 'form-group--error': v$.user.language.$error }"
|
||||
>
|
||||
<interface-language-switcher
|
||||
for="email-language"
|
||||
:prompt-text="$t('registration.email_language')"
|
||||
:language="v$.user.language.$model"
|
||||
:set-language="val => v$.user.language.$model = val"
|
||||
@click.stop.prevent
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div
|
||||
v-if="accountApprovalRequired"
|
||||
class="form-group"
|
||||
>
|
||||
<label
|
||||
class="form--label"
|
||||
for="reason"
|
||||
>{{ $t('registration.reason') }}</label>
|
||||
<textarea
|
||||
id="reason"
|
||||
v-model="user.reason"
|
||||
:disabled="isPending"
|
||||
class="input form-control"
|
||||
:placeholder="reasonPlaceholder"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div
|
||||
v-if="captcha.type != 'none'"
|
||||
id="captcha-group"
|
||||
class="form-group"
|
||||
>
|
||||
<label
|
||||
class="form--label"
|
||||
for="captcha-label"
|
||||
>{{ $t('registration.captcha') }}</label>
|
||||
|
||||
<template v-if="['kocaptcha', 'native'].includes(captcha.type)">
|
||||
<img
|
||||
:src="captcha.url"
|
||||
@click="setCaptcha"
|
||||
>
|
||||
|
||||
<sub>{{ $t('registration.new_captcha') }}</sub>
|
||||
|
||||
<input
|
||||
id="captcha-answer"
|
||||
v-model="captcha.solution"
|
||||
:disabled="isPending"
|
||||
class="input form-control"
|
||||
type="text"
|
||||
autocomplete="off"
|
||||
autocorrect="off"
|
||||
autocapitalize="off"
|
||||
spellcheck="false"
|
||||
>
|
||||
</template>
|
||||
</div>
|
||||
|
||||
<div
|
||||
v-if="token"
|
||||
class="form-group"
|
||||
>
|
||||
<label for="token">{{ $t('registration.token') }}</label>
|
||||
<input
|
||||
id="token"
|
||||
v-model="token"
|
||||
disabled="true"
|
||||
class="input form-control"
|
||||
type="text"
|
||||
>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<button
|
||||
:disabled="isPending"
|
||||
type="submit"
|
||||
class="btn button-default"
|
||||
>
|
||||
{{ $t('registration.register') }}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- eslint-disable vue/no-v-html -->
|
||||
<div
|
||||
v-if="token"
|
||||
class="form-group"
|
||||
>
|
||||
<label for="token">{{ $t('registration.token') }}</label>
|
||||
<input
|
||||
id="token"
|
||||
v-model="token"
|
||||
disabled="true"
|
||||
class="input form-control"
|
||||
type="text"
|
||||
>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<button
|
||||
:disabled="isPending"
|
||||
type="submit"
|
||||
class="btn button-default"
|
||||
>
|
||||
{{ $t('registration.register') }}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- eslint-disable vue/no-v-html -->
|
||||
<div
|
||||
class="terms-of-service"
|
||||
v-html="termsOfService"
|
||||
/>
|
||||
v-if="embeddedToS"
|
||||
class="terms-of-service"
|
||||
v-html="termsOfService"
|
||||
/>
|
||||
<!-- eslint-enable vue/no-v-html -->
|
||||
</div>
|
||||
<div
|
||||
v-if="serverValidationErrors.length"
|
||||
class="form-group"
|
||||
>
|
||||
<div class="alert error">
|
||||
<span
|
||||
v-for="error in serverValidationErrors"
|
||||
:key="error"
|
||||
>{{ error }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div v-else>
|
||||
<p class="registration-notice">
|
||||
{{ signUpNotice.message }}
|
||||
</p>
|
||||
<div
|
||||
v-if="serverValidationErrors.length"
|
||||
class="form-group"
|
||||
>
|
||||
<div class="alert error">
|
||||
<span
|
||||
v-for="error in serverValidationErrors"
|
||||
:key="error"
|
||||
>{{ error }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div v-else>
|
||||
<p class="registration-notice">
|
||||
{{ signUpNotice.message }}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -325,7 +329,7 @@
|
|||
.registration-form {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin: 0.6em;
|
||||
margin: 1em;
|
||||
|
||||
.container {
|
||||
display: flex;
|
||||
|
|
@ -338,7 +342,7 @@
|
|||
|
||||
.terms-of-service {
|
||||
flex: 0 1 50%;
|
||||
margin: 0.8em;
|
||||
margin: 0.6em 0 0 0.8em;
|
||||
}
|
||||
|
||||
.text-fields {
|
||||
|
|
@ -417,6 +421,10 @@
|
|||
@media all and (max-width: 800px) {
|
||||
.registration-form .container {
|
||||
flex-direction: column-reverse;
|
||||
|
||||
.terms-of-service {
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<div class="staff-panel">
|
||||
<div class="panel panel-default base01-background">
|
||||
<div class="panel-heading timeline-heading base02-background">
|
||||
<div class="panel-heading timeline-heading base02-background -sticky">
|
||||
<div class="title">
|
||||
{{ $t("about.staff") }}
|
||||
</div>
|
||||
|
|
@ -28,8 +28,7 @@
|
|||
|
||||
<style lang="scss">
|
||||
.staff-group {
|
||||
padding-left: 1em;
|
||||
padding-top: 1em;
|
||||
padding: 1em;
|
||||
|
||||
.basic-user-card {
|
||||
padding-left: 0;
|
||||
|
|
|
|||
|
|
@ -2,6 +2,9 @@ const TermsOfServicePanel = {
|
|||
computed: {
|
||||
content () {
|
||||
return this.$store.state.instance.tos
|
||||
},
|
||||
embedded () {
|
||||
return this.$store.state.instance.embeddedToS
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,13 +1,21 @@
|
|||
<template>
|
||||
<div>
|
||||
<div class="terms-of-service-panel">
|
||||
<div class="panel panel-default">
|
||||
<div
|
||||
v-if="!embedded"
|
||||
class="panel-heading -sticky"
|
||||
>
|
||||
<div class="title">
|
||||
{{ $t("about.terms") }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<!-- eslint-disable vue/no-v-html -->
|
||||
<div
|
||||
class="tos-content"
|
||||
v-html="content"
|
||||
/>
|
||||
<!-- eslint-enable vue/no-v-html -->
|
||||
<!-- eslint-enable vue/no-v-html -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -19,4 +27,5 @@
|
|||
.tos-content {
|
||||
margin: 1em;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -275,7 +275,10 @@
|
|||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="!hideBio">
|
||||
<div
|
||||
v-if="!hideBio"
|
||||
class="user-bio"
|
||||
>
|
||||
<div
|
||||
v-if="!mergedConfig.hideUserStats && switcher"
|
||||
class="user-counts"
|
||||
|
|
|
|||
|
|
@ -30,7 +30,8 @@
|
|||
"media_nsfw_desc": "This instance forces media to be set sensitive in posts on the following instances:"
|
||||
}
|
||||
},
|
||||
"staff": "Staff"
|
||||
"staff": "Staff",
|
||||
"terms": "Terms of Service"
|
||||
},
|
||||
"announcements": {
|
||||
"page_header": "Announcements",
|
||||
|
|
|
|||
|
|
@ -54,6 +54,7 @@ const defaultState = {
|
|||
defaultAvatar: '/images/avi.png',
|
||||
defaultBanner: '/images/banner.png',
|
||||
background: '/static/aurora_borealis.jpg',
|
||||
embeddedToS: true,
|
||||
collapseMessageWithSubject: false,
|
||||
greentext: false,
|
||||
useAtIcon: false,
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue