potsda.mn/mobilizon
10
4
Fork 1
Code Issues 22 Pull requests 1 Projects Releases Wiki Activity

Accessibility improvements in AccountSettings

Browse source 
Signed-off-by: Thomas Citharel <tcit@tcit.fr>
This commit is contained in:
Thomas Citharel 2021-08-23 10:20:55 +02:00
parent 426f85884b
commit c5d5758ece
No known key found for this signature in database
GPG key ID: A061B9DDE0CA0773
2 changed files with 15 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
js/src/variables.scss
View file

@ -54,7 +54,7 @@ $success-invert: findColorInvert($success);
$info: #36bcd4;
$info-invert: findColorInvert($info);
$danger: #ff2e54;
$danger-invert: findColorInvert($danger);
$danger-invert: #000;
$link: $primary;
$link-invert: $primary-invert;
$text: $violet-1;

18
js/src/views/Settings/AccountSettings.vue
View file

@ -51,20 +51,22 @@
class="form"
v-if="canChangeEmail"
>
<b-field :label="$t('New email')">
<b-field :label="$t('New email')" label-for="account-email">
<b-input
aria-required="true"
required
type="email"
id="account-email"
v-model="newEmail"
/>
</b-field>
<p class="help">{{ $t("You'll receive a confirmation email.") }}</p>
<b-field :label="$t('Password')">
<b-field :label="$t('Password')" label-for="account-password">
<b-input
aria-required="true"
required
type="password"
id="account-password"
password-reveal
minlength="6"
v-model="passwordForEmailChange"
@ -105,23 +107,25 @@
class="form"
v-if="canChangePassword"
>
<b-field :label="$t('Old password')">
<b-field :label="$t('Old password')" label-for="account-old-password">
<b-input
aria-required="true"
required
type="password"
password-reveal
minlength="6"
id="account-old-password"
v-model="oldPassword"
/>
</b-field>
<b-field :label="$t('New password')">
<b-field :label="$t('New password')" label-for="account-new-password">
<b-input
aria-required="true"
required
type="password"
password-reveal
minlength="6"
id="account-new-password"
v-model="newPassword"
/>
</b-field>
@ -409,6 +413,12 @@ export default class AccountSettings extends Vue {
</script>
<style lang="scss" scoped>
.modal.is-active.is-full-screen {
.help.is-danger {
font-size: 1rem;
}
}
.cancel-button {
margin-top: 2rem;
}