sjw
/
pleroma-fe
mirror of https://git.pleroma.social/sjw/pleroma-fe.git
1
0
Fork 0
Code Issues Releases Wiki Activity

updated user_settings/setup otp

This commit is contained in:
Maksim Pechnikov 2019-06-08 15:05:26 +03:00
parent 1b1e182f27
commit f1e8edab11
2 changed files with 37 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

52
src/components/user_settings/mfa.vue
View File

@ -22,31 +22,36 @@
<i v-if="prepareOTP">{{$t('settings.mfa.wait_pre_setup_otp')}}</i>
<div v-if="confirmOTP">
<h3>{{$t('settings.mfa.setup_otp')}}</h3>
<h4>{{$t('settings.mfa.scan.title')}}</h4>
<p>{{$t('settings.mfa.scan.desc')}}</p>
<qrcode :value="otpSettings.provisioning_uri" :options="{ width: 200 }"></qrcode>
<p>
{{$t('settings.mfa.scan.secret_code')}}:
{{otpSettings.key}}
</p>
<div>
<h4>{{$t('general.verify')}}</h4>
<p>{{$t('settings.mfa.verify.desc')}}</p>
<input type="text" v-model="otpConfirmToken">
<div class="setup-otp">
<div class="qr-code">
<h4>{{$t('settings.mfa.scan.title')}}</h4>
<p>{{$t('settings.mfa.scan.desc')}}</p>
<qrcode :value="otpSettings.provisioning_uri" :options="{ width: 200 }"></qrcode>
<p>
{{$t('settings.mfa.scan.secret_code')}}:
{{otpSettings.key}}
</p>
</div>
<p>{{$t('settings.enter_current_password_to_confirm')}}:</p>
<input type="password" v-model="currentPassword">
<div class="verify">
<h4>{{$t('general.verify')}}</h4>
<p>{{$t('settings.mfa.verify.desc')}}</p>
<input type="text" v-model="otpConfirmToken">
<p>{{$t('settings.enter_current_password_to_confirm')}}:</p>
<input type="password" v-model="currentPassword">
<button class="btn btn-default" @click="doConfirmOTP">
{{$t('settings.mfa.confirm_and_enable')}}
</button>
<div class="alert error" v-if="error">{{error}}</div>
</div>
</div>
<button class="btn btn-default" @click="doConfirmOTP">
{{$t('settings.mfa.confirm_and_enable')}}
</button>
<div class="alert error" v-if="error">{{error}}</div>
</div>
</div>
</div>
</div>
<div v-if="settings.enabled">
<div class="setting-item">
@ -83,5 +88,14 @@
justify-content: space-between;
align-items: baseline;
}
.setup-otp {
display: flex;
justify-content: center;
flex-wrap: wrap;
.qr-code { flex: 1; }
.verify { flex: 1; }
.error { margin: 4px 0 0 0; }
}
}
</style>

5
src/components/user_settings/mfa_backup_codes.vue
View File

@ -4,7 +4,7 @@
<i v-if="inProgress">{{$t('settings.mfa.waiting_a_recovery_codes')}}</i>
<template v-if="ready">
<p class="alert warning">{{$t('settings.mfa.recovery_codes_warning')}}</p>
<ul><li v-for="code in backupCodes.codes">{{code}}</li></ul>
<ul class="backup-codes"><li v-for="code in backupCodes.codes">{{code}}</li></ul>
</template>
</div>
</template>
@ -16,4 +16,7 @@
color: $fallback--cOrange;
color: var(--cOrange, $fallback--cOrange);
}
.backup-codes {
font-family: var(--postCodeFont, monospace);
}
</style>