transition(:duration="400")
.modal(v-show='isShown', v-cloak)
transition(name='modal-background')
.modal-background(v-show='isShown')
.modal-container
transition(name='modal-content')
.modal-content(v-show='isShown')
template(v-if='step === "qr"')
header.is-blue Setup your 2FA app
section.modal-loading
i
span Wiki.js {{ mode }} in progress...
em Please wait
template(v-if='step === "error"')
header.is-red Error
section.modal-loading
span {{ error }}
footer
a.button.is-grey.is-outlined(@click='cancel') Discard
template(v-if='step === "confirm"')
header.is-blue Two-Factor Authentication
section
label.label Do you want to enable 2FA?
span.note Two-Factor Authentication (2FA) provides an extra layer of security for your account. Upon login, you will be prompted to enter a token generated by a 2FA app (e.g. Authy, Google Authenticator, etc.).
footer
a.button.is-grey.is-outlined(@click='cancel') Discard
a.button.is-blue(@click='confirm') Setup