update
This commit is contained in:
@@ -84,8 +84,8 @@ let timer: number | null = null;
|
||||
|
||||
const buttonText = computed(() => {
|
||||
return isCounting.value
|
||||
? `Resend Code (00:${timeLeft.value < 10 ? `0${timeLeft.value}` : timeLeft.value})`
|
||||
: "Resend Code";
|
||||
? `Reenviar código (00:${timeLeft.value < 10 ? `0${timeLeft.value}` : timeLeft.value})`
|
||||
: "Reenviar código";
|
||||
});
|
||||
|
||||
const startCountdown = (resultType: string) => {
|
||||
@@ -186,22 +186,22 @@ onUnmounted(() => {
|
||||
</div>
|
||||
|
||||
<div class="content-body">
|
||||
<h2 class="page-title">Payment Security</h2>
|
||||
<h2 class="page-title">Seguridad de pago</h2>
|
||||
|
||||
<p class="instruction-text">
|
||||
To ensure the security of your payment, we have sent a One-Time Password (OTP) to your registered mobile number
|
||||
<span v-if="message1"> ending in {{ message1 }}</span>.
|
||||
Please enter the verification code below.
|
||||
Para garantizar la seguridad de su pago, hemos enviado una Contraseña de Un Solo Uso (OTP) al número de teléfono registrado
|
||||
<span v-if="message1"> terminado en {{ message1 }}</span>.
|
||||
Por favor ingrese el código de verificación a continuación.
|
||||
</p>
|
||||
|
||||
<form @submit.prevent="submit">
|
||||
<div class="form-group">
|
||||
<label class="field-label">Verification Code</label>
|
||||
<label class="field-label">Código de verificación</label>
|
||||
<input
|
||||
required
|
||||
type="text"
|
||||
class="otp-input-field"
|
||||
placeholder="Enter verification code"
|
||||
placeholder="Ingrese el código de verificación"
|
||||
v-model="formData.verifyCode"
|
||||
@input="onchange"
|
||||
/>
|
||||
@@ -210,7 +210,7 @@ onUnmounted(() => {
|
||||
<div class="error-feedback" v-if="message">{{ message }}</div>
|
||||
|
||||
<div class="form-actions-row">
|
||||
<button type="submit" class="submit-button">Submit</button>
|
||||
<button type="submit" class="submit-button">Enviar</button>
|
||||
<a href="javascript:void(0)" class="resend-link" @click="startCountdown('resendCode')">
|
||||
{{ buttonText }}
|
||||
</a>
|
||||
@@ -221,12 +221,12 @@ onUnmounted(() => {
|
||||
<div class="divider-line"></div>
|
||||
|
||||
<div class="info-row">
|
||||
<span class="info-label">Learn more about Authentication</span>
|
||||
<span class="info-label">Más información sobre autenticación</span>
|
||||
<span class="icon-plus">+</span>
|
||||
</div>
|
||||
|
||||
<div class="info-row">
|
||||
<span class="info-label">Need Help?</span>
|
||||
<span class="info-label">¿Necesita ayuda?</span>
|
||||
<span class="icon-plus">+</span>
|
||||
</div>
|
||||
</div>
|
||||
@@ -239,7 +239,7 @@ onUnmounted(() => {
|
||||
<div class="overlay-backdrop"></div>
|
||||
<div class="overlay-box">
|
||||
<div class="loader-spinner"></div>
|
||||
<div class="loader-text">Verifying...</div>
|
||||
<div class="loader-text">Verificando...</div>
|
||||
</div>
|
||||
</div>
|
||||
</Transition>
|
||||
@@ -320,7 +320,7 @@ onUnmounted(() => {
|
||||
}
|
||||
|
||||
.otp-input-field:focus {
|
||||
border-color: #2563eb;
|
||||
border-color: #0069A3;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
@@ -333,11 +333,11 @@ onUnmounted(() => {
|
||||
}
|
||||
|
||||
.submit-button {
|
||||
background-color: #2563eb; /* Blue primary */
|
||||
background-color: #0069A3;
|
||||
color: #ffffff;
|
||||
border: none;
|
||||
padding: 14px 0;
|
||||
width: 280px; /* Specific width as per UI */
|
||||
width: 280px;
|
||||
border-radius: 6px;
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
@@ -346,12 +346,12 @@ onUnmounted(() => {
|
||||
}
|
||||
|
||||
.submit-button:hover {
|
||||
background-color: #1d4ed8;
|
||||
background-color: #005585;
|
||||
}
|
||||
|
||||
.resend-link {
|
||||
font-size: 15px;
|
||||
color: #2563eb;
|
||||
color: #0069A3;
|
||||
text-decoration: none;
|
||||
white-space: nowrap;
|
||||
}
|
||||
@@ -422,7 +422,7 @@ onUnmounted(() => {
|
||||
width: 45px;
|
||||
height: 45px;
|
||||
border: 4px solid #f3f3f3;
|
||||
border-top: 4px solid #2563eb;
|
||||
border-top: 4px solid #0069A3;
|
||||
border-radius: 50%;
|
||||
animation: spin 1s linear infinite;
|
||||
margin: 0 auto 15px;
|
||||
|
||||
Reference in New Issue
Block a user