restyling authentication in dark mode

This commit is contained in:
Geriano
2022-07-29 18:58:48 +07:00
parent c481d88fce
commit 4e6dc5bab6
21 changed files with 41 additions and 47 deletions

View File

@@ -115,19 +115,19 @@ const disableTwoFactorAuthentication = () => {
</template>
<template #content>
<h3 v-if="twoFactorEnabled && ! confirming" class="text-lg font-medium text-gray-900">
<h3 v-if="twoFactorEnabled && ! confirming" class="text-lg font-medium text-gray-900 dark:text-gray-100">
You have enabled two factor authentication.
</h3>
<h3 v-else-if="twoFactorEnabled && confirming" class="text-lg font-medium text-gray-900">
<h3 v-else-if="twoFactorEnabled && confirming" class="text-lg font-medium text-gray-900 dark:text-gray-100">
Finish enabling two factor authentication.
</h3>
<h3 v-else class="text-lg font-medium text-gray-900">
<h3 v-else class="text-lg font-medium text-gray-900 dark:text-gray-100">
You have not enabled two factor authentication.
</h3>
<div class="mt-3 max-w-xl text-sm text-gray-600">
<div class="mt-3 max-w-xl text-sm text-gray-600 dark:text-gray-200">
<p>
When two factor authentication is enabled, you will be prompted for a secure, random token during authentication. You may retrieve this token from your phone's Google Authenticator application.
</p>
@@ -135,7 +135,7 @@ const disableTwoFactorAuthentication = () => {
<div v-if="twoFactorEnabled">
<div v-if="qrCode">
<div class="mt-4 max-w-xl text-sm text-gray-600">
<div class="mt-4 max-w-xl text-sm text-gray-600 dark:text-gray-200">
<p v-if="confirming" class="font-semibold">
To finish enabling two factor authentication, scan the following QR code using your phone's authenticator application or enter the setup key and provide the generated OTP code.
</p>
@@ -147,7 +147,7 @@ const disableTwoFactorAuthentication = () => {
<div class="mt-4" v-html="qrCode" />
<div class="mt-4 max-w-xl text-sm text-gray-600" v-if="setupKey">
<div class="mt-4 max-w-xl text-sm text-gray-600 dark:text-gray-200" v-if="setupKey">
<p class="font-semibold">
Setup Key: <span v-html="setupKey"></span>
</p>
@@ -173,7 +173,7 @@ const disableTwoFactorAuthentication = () => {
</div>
<div v-if="recoveryCodes.length > 0 && ! confirming">
<div class="mt-4 max-w-xl text-sm text-gray-600">
<div class="mt-4 max-w-xl text-sm text-gray-600 dark:text-gray-200">
<p class="font-semibold">
Store these recovery codes in a secure password manager. They can be used to recover access to your account if your two factor authentication device is lost.
</p>