Add unit tests for LoginButton component with comprehensive coverage
All checks were successful
Gitea Actions Demo / build-and-push (push) Successful in 46s
All checks were successful
Gitea Actions Demo / build-and-push (push) Successful in 46s
This commit is contained in:
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div class="layout">
|
||||
<div class="edit-view">
|
||||
<div class="view">
|
||||
<form class="forgot-form" @submit.prevent="submitForm" novalidate>
|
||||
<h2>Reset your password</h2>
|
||||
|
||||
@@ -39,9 +39,9 @@
|
||||
{{ successMsg }}
|
||||
</div>
|
||||
|
||||
<div class="form-group" style="margin-top: 0.4rem">
|
||||
<button type="submit" class="form-btn" :disabled="loading || !isEmailValid">
|
||||
{{ loading ? 'Sending…' : 'Send reset link' }}
|
||||
<div class="form-group actions" style="margin-top: 0.4rem">
|
||||
<button type="submit" class="btn btn-primary" :disabled="loading || !isEmailValid">
|
||||
{{ loading ? 'Sending…' : 'Send Reset Link' }}
|
||||
</button>
|
||||
</div>
|
||||
|
||||
@@ -80,11 +80,7 @@
|
||||
import { ref, computed } from 'vue'
|
||||
import { useRouter } from 'vue-router'
|
||||
import { isEmailValid } from '@/common/api'
|
||||
import '@/assets/view-shared.css'
|
||||
import '@/assets/colors.css'
|
||||
import '@/assets/edit-forms.css'
|
||||
import '@/assets/actions-shared.css'
|
||||
import '@/assets/button-shared.css'
|
||||
import '@/assets/styles.css'
|
||||
|
||||
const router = useRouter()
|
||||
|
||||
@@ -142,8 +138,18 @@ async function goToLogin() {
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
:deep(.edit-view) {
|
||||
width: 400px;
|
||||
.view {
|
||||
max-width: 420px;
|
||||
margin: 0 auto;
|
||||
background: var(--edit-view-bg, #fff);
|
||||
border-radius: 14px;
|
||||
box-shadow: 0 4px 24px rgba(0, 0, 0, 0.08);
|
||||
padding: 2.2rem 2.2rem 1.5rem 2.2rem;
|
||||
}
|
||||
.view h2 {
|
||||
text-align: center;
|
||||
margin-bottom: 1.5rem;
|
||||
color: var(--form-heading);
|
||||
}
|
||||
|
||||
.forgot-form {
|
||||
@@ -153,14 +159,19 @@ async function goToLogin() {
|
||||
border: none;
|
||||
}
|
||||
|
||||
/* reuse edit-forms form-group styles */
|
||||
.form-group {
|
||||
margin-bottom: 1.5rem;
|
||||
}
|
||||
|
||||
.form-group label {
|
||||
display: block;
|
||||
margin-bottom: 0.45rem;
|
||||
color: var(--form-label, #444);
|
||||
font-weight: 600;
|
||||
}
|
||||
.form-group input,
|
||||
.form-group input[type='email'] {
|
||||
.form-group input[type='email'],
|
||||
.form-group input[type='password'] {
|
||||
display: block;
|
||||
width: 100%;
|
||||
margin-top: 0.4rem;
|
||||
@@ -172,16 +183,24 @@ async function goToLogin() {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.btn-link:disabled {
|
||||
text-decoration: none;
|
||||
cursor: default;
|
||||
opacity: 0.75;
|
||||
}
|
||||
|
||||
@media (max-width: 520px) {
|
||||
.forgot-form {
|
||||
padding: 1rem;
|
||||
border-radius: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.actions {
|
||||
display: flex;
|
||||
gap: 3rem;
|
||||
justify-content: center;
|
||||
margin-top: 0.5rem;
|
||||
margin-bottom: 0.4rem;
|
||||
}
|
||||
.actions .btn {
|
||||
padding: 1rem 2.2rem;
|
||||
font-weight: 700;
|
||||
font-size: 1.25rem;
|
||||
min-width: 120px;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div class="layout">
|
||||
<div class="edit-view">
|
||||
<div class="view">
|
||||
<form class="login-form" @submit.prevent="submitForm" novalidate>
|
||||
<h2>Sign in</h2>
|
||||
|
||||
@@ -36,9 +36,6 @@
|
||||
:class="{ 'input-error': submitAttempted && !password }"
|
||||
required
|
||||
/>
|
||||
<small v-if="submitAttempted && !password" class="error-message" aria-live="polite"
|
||||
>Password is required.</small
|
||||
>
|
||||
</div>
|
||||
|
||||
<!-- show server error message -->
|
||||
@@ -73,8 +70,8 @@
|
||||
{{ resendError }}
|
||||
</div>
|
||||
|
||||
<div class="form-group" style="margin-top: 0.4rem">
|
||||
<button type="submit" class="form-btn" :disabled="loading || !formValid">
|
||||
<div class="form-group actions" style="margin-top: 0.4rem">
|
||||
<button type="submit" class="btn btn-primary" :disabled="loading || !formValid">
|
||||
{{ loading ? 'Signing in…' : 'Sign in' }}
|
||||
</button>
|
||||
</div>
|
||||
@@ -139,11 +136,7 @@
|
||||
<script setup lang="ts">
|
||||
import { ref, computed } from 'vue'
|
||||
import { useRouter } from 'vue-router'
|
||||
import '@/assets/view-shared.css'
|
||||
import '@/assets/colors.css'
|
||||
import '@/assets/edit-forms.css'
|
||||
import '@/assets/actions-shared.css'
|
||||
import '@/assets/button-shared.css'
|
||||
import '@/assets/styles.css'
|
||||
import {
|
||||
MISSING_EMAIL_OR_PASSWORD,
|
||||
INVALID_CREDENTIALS,
|
||||
@@ -193,12 +186,14 @@ async function submitForm() {
|
||||
const { msg, code } = await parseErrorResponse(res)
|
||||
showResend.value = false
|
||||
let displayMsg = msg
|
||||
let shouldClearPassword = false
|
||||
switch (code) {
|
||||
case MISSING_EMAIL_OR_PASSWORD:
|
||||
displayMsg = 'Email and password are required.'
|
||||
break
|
||||
case INVALID_CREDENTIALS:
|
||||
displayMsg = 'The email and password combination is incorrect. Please try again.'
|
||||
shouldClearPassword = true
|
||||
break
|
||||
case NOT_VERIFIED:
|
||||
displayMsg =
|
||||
@@ -209,6 +204,9 @@ async function submitForm() {
|
||||
displayMsg = msg || `Login failed with status ${res.status}.`
|
||||
}
|
||||
loginError.value = displayMsg
|
||||
if (shouldClearPassword) {
|
||||
password.value = ''
|
||||
}
|
||||
return
|
||||
}
|
||||
|
||||
@@ -278,10 +276,19 @@ async function goToForgotPassword() {
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
:deep(.edit-view) {
|
||||
width: 400px;
|
||||
.view {
|
||||
max-width: 420px;
|
||||
margin: 0 auto;
|
||||
background: var(--edit-view-bg, #fff);
|
||||
border-radius: 14px;
|
||||
box-shadow: 0 4px 24px rgba(0, 0, 0, 0.08);
|
||||
padding: 2.2rem 2.2rem 1.5rem 2.2rem;
|
||||
}
|
||||
.view h2 {
|
||||
text-align: center;
|
||||
margin-bottom: 1.5rem;
|
||||
color: var(--form-heading);
|
||||
}
|
||||
|
||||
.login-form {
|
||||
background: transparent;
|
||||
box-shadow: none;
|
||||
@@ -290,9 +297,12 @@ async function goToForgotPassword() {
|
||||
}
|
||||
|
||||
/* reuse edit-forms form-group styles */
|
||||
.form-group {
|
||||
margin-bottom: 1.5rem;
|
||||
}
|
||||
|
||||
.form-group label {
|
||||
display: block;
|
||||
margin-bottom: 0.45rem;
|
||||
color: var(--form-label, #444);
|
||||
font-weight: 600;
|
||||
}
|
||||
@@ -310,17 +320,23 @@ async function goToForgotPassword() {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
/* also ensure disabled button doesn't show underline in browsers that style disabled anchors/buttons */
|
||||
.btn-link:disabled {
|
||||
text-decoration: none;
|
||||
cursor: default;
|
||||
opacity: 0.75;
|
||||
}
|
||||
|
||||
@media (max-width: 520px) {
|
||||
.login-form {
|
||||
padding: 1rem;
|
||||
border-radius: 10px;
|
||||
}
|
||||
}
|
||||
.actions {
|
||||
display: flex;
|
||||
gap: 3rem;
|
||||
justify-content: center;
|
||||
margin-top: 0.5rem;
|
||||
margin-bottom: 0.4rem;
|
||||
}
|
||||
.actions .btn {
|
||||
padding: 1rem 2.2rem;
|
||||
font-weight: 700;
|
||||
font-size: 1.25rem;
|
||||
min-width: 120px;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -64,7 +64,6 @@ import { ref, watch, onMounted } from 'vue'
|
||||
import { useRouter } from 'vue-router'
|
||||
import { logoutParent } from '@/stores/auth'
|
||||
import '@/assets/styles.css'
|
||||
import '@/assets/colors.css'
|
||||
|
||||
const step = ref(1)
|
||||
const loading = ref(false)
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div class="layout">
|
||||
<div class="edit-view">
|
||||
<div class="view">
|
||||
<form
|
||||
v-if="tokenChecked && tokenValid"
|
||||
class="reset-form"
|
||||
@@ -16,17 +16,10 @@
|
||||
type="password"
|
||||
autocomplete="new-password"
|
||||
v-model="password"
|
||||
:class="{ 'input-error': submitAttempted && !isPasswordStrong }"
|
||||
:class="{ 'input-error': password && (!isPasswordStrongRef || !passwordsMatch) }"
|
||||
required
|
||||
/>
|
||||
<small v-if="submitAttempted && !password" class="error-message" aria-live="polite">
|
||||
Password is required.
|
||||
</small>
|
||||
<small
|
||||
v-else-if="submitAttempted && !isPasswordStrong"
|
||||
class="error-message"
|
||||
aria-live="polite"
|
||||
>
|
||||
<small v-if="password && !isPasswordStrongRef" class="error-message" aria-live="polite">
|
||||
Password must be at least 8 characters and contain a letter and a number.
|
||||
</small>
|
||||
</div>
|
||||
@@ -38,21 +31,10 @@
|
||||
type="password"
|
||||
autocomplete="new-password"
|
||||
v-model="confirmPassword"
|
||||
:class="{ 'input-error': submitAttempted && !passwordsMatch }"
|
||||
:class="{ 'input-error': confirmPassword && !passwordsMatch }"
|
||||
required
|
||||
/>
|
||||
<small
|
||||
v-if="submitAttempted && !confirmPassword"
|
||||
class="error-message"
|
||||
aria-live="polite"
|
||||
>
|
||||
Please confirm your password.
|
||||
</small>
|
||||
<small
|
||||
v-else-if="submitAttempted && !passwordsMatch"
|
||||
class="error-message"
|
||||
aria-live="polite"
|
||||
>
|
||||
<small v-if="confirmPassword && !passwordsMatch" class="error-message" aria-live="polite">
|
||||
Passwords do not match.
|
||||
</small>
|
||||
</div>
|
||||
@@ -69,8 +51,8 @@
|
||||
{{ successMsg }}
|
||||
</div>
|
||||
|
||||
<div class="form-group" style="margin-top: 0.4rem">
|
||||
<button type="submit" class="form-btn" :disabled="loading || !formValid">
|
||||
<div class="form-group actions" style="margin-top: 0.4rem">
|
||||
<button type="submit" class="btn btn-primary" :disabled="loading || !formValid">
|
||||
{{ loading ? 'Resetting…' : 'Reset password' }}
|
||||
</button>
|
||||
</div>
|
||||
@@ -137,11 +119,7 @@
|
||||
import { ref, computed, onMounted } from 'vue'
|
||||
import { useRouter, useRoute } from 'vue-router'
|
||||
import { isPasswordStrong } from '@/common/api'
|
||||
import '@/assets/view-shared.css'
|
||||
import '@/assets/colors.css'
|
||||
import '@/assets/edit-forms.css'
|
||||
import '@/assets/actions-shared.css'
|
||||
import '@/assets/button-shared.css'
|
||||
import '@/assets/styles.css'
|
||||
|
||||
const router = useRouter()
|
||||
const route = useRoute()
|
||||
@@ -241,8 +219,18 @@ async function goToLogin() {
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
:deep(.edit-view) {
|
||||
width: 400px;
|
||||
.view {
|
||||
max-width: 420px;
|
||||
margin: 0 auto;
|
||||
background: var(--edit-view-bg, #fff);
|
||||
border-radius: 14px;
|
||||
box-shadow: 0 4px 24px rgba(0, 0, 0, 0.08);
|
||||
padding: 2.2rem 2.2rem 1.5rem 2.2rem;
|
||||
}
|
||||
.view h2 {
|
||||
text-align: center;
|
||||
margin-bottom: 1.5rem;
|
||||
color: var(--form-heading);
|
||||
}
|
||||
|
||||
.reset-form {
|
||||
@@ -252,13 +240,18 @@ async function goToLogin() {
|
||||
border: none;
|
||||
}
|
||||
|
||||
/* reuse edit-forms form-group styles */
|
||||
.form-group {
|
||||
margin-bottom: 1.5rem;
|
||||
}
|
||||
|
||||
.form-group label {
|
||||
display: block;
|
||||
margin-bottom: 0.45rem;
|
||||
color: var(--form-label, #444);
|
||||
font-weight: 600;
|
||||
}
|
||||
.form-group input,
|
||||
.form-group input[type='email'],
|
||||
.form-group input[type='password'] {
|
||||
display: block;
|
||||
width: 100%;
|
||||
@@ -271,16 +264,24 @@ async function goToLogin() {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.btn-link:disabled {
|
||||
text-decoration: none;
|
||||
cursor: default;
|
||||
opacity: 0.75;
|
||||
}
|
||||
|
||||
@media (max-width: 520px) {
|
||||
.reset-form {
|
||||
padding: 1rem;
|
||||
border-radius: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.actions {
|
||||
display: flex;
|
||||
gap: 3rem;
|
||||
justify-content: center;
|
||||
margin-top: 0.5rem;
|
||||
margin-bottom: 0.4rem;
|
||||
}
|
||||
.actions .btn {
|
||||
padding: 1rem 2.2rem;
|
||||
font-weight: 700;
|
||||
font-size: 1.25rem;
|
||||
min-width: 120px;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,12 +1,7 @@
|
||||
<template>
|
||||
<div class="layout">
|
||||
<div class="edit-view">
|
||||
<form
|
||||
v-if="!signupSuccess"
|
||||
@submit.prevent="submitForm"
|
||||
class="signup-form child-edit-view"
|
||||
novalidate
|
||||
>
|
||||
<div class="view">
|
||||
<form v-if="!signupSuccess" @submit.prevent="submitForm" class="signup-form view" novalidate>
|
||||
<h2>Sign up</h2>
|
||||
<div class="form-group">
|
||||
<label for="firstName">First name</label>
|
||||
@@ -17,9 +12,10 @@
|
||||
autofocus
|
||||
autocomplete="given-name"
|
||||
required
|
||||
:class="{ 'input-error': submitAttempted && !firstName }"
|
||||
@blur="firstNameTouched = true"
|
||||
:class="{ 'input-error': firstNameTouched && !firstName }"
|
||||
/>
|
||||
<small v-if="submitAttempted && !firstName" class="error-message" aria-live="polite"
|
||||
<small v-if="firstNameTouched && !firstName" class="error-message" aria-live="polite"
|
||||
>First name is required.</small
|
||||
>
|
||||
</div>
|
||||
@@ -32,9 +28,10 @@
|
||||
autocomplete="family-name"
|
||||
type="text"
|
||||
required
|
||||
:class="{ 'input-error': submitAttempted && !lastName }"
|
||||
@blur="lastNameTouched = true"
|
||||
:class="{ 'input-error': lastNameTouched && !lastName }"
|
||||
/>
|
||||
<small v-if="submitAttempted && !lastName" class="error-message" aria-live="polite"
|
||||
<small v-if="lastNameTouched && !lastName" class="error-message" aria-live="polite"
|
||||
>Last name is required.</small
|
||||
>
|
||||
</div>
|
||||
@@ -47,12 +44,13 @@
|
||||
autocomplete="email"
|
||||
type="email"
|
||||
required
|
||||
:class="{ 'input-error': submitAttempted && (!email || !isEmailValid) }"
|
||||
@blur="emailTouched = true"
|
||||
:class="{ 'input-error': emailTouched && (!email || !isEmailValidRef) }"
|
||||
/>
|
||||
<small v-if="submitAttempted && !email" class="error-message" aria-live="polite"
|
||||
<small v-if="emailTouched && !email" class="error-message" aria-live="polite"
|
||||
>Email is required.</small
|
||||
>
|
||||
<small v-else-if="submitAttempted && !isEmailValid" class="error-message"
|
||||
<small v-else-if="emailTouched && !isEmailValidRef" class="error-message"
|
||||
>Please enter a valid email address.</small
|
||||
>
|
||||
</div>
|
||||
@@ -66,10 +64,10 @@
|
||||
type="password"
|
||||
required
|
||||
@input="checkPasswordStrength"
|
||||
:class="{ 'input-error': (submitAttempted || passwordTouched) && !isPasswordStrong }"
|
||||
:class="{ 'input-error': passwordTouched && !isPasswordStrongRef }"
|
||||
/>
|
||||
<small
|
||||
v-if="(submitAttempted || passwordTouched) && !isPasswordStrong"
|
||||
v-if="passwordTouched && !isPasswordStrongRef"
|
||||
class="error-message"
|
||||
aria-live="polite"
|
||||
>Password must be at least 8 characters, include a number and a letter.</small
|
||||
@@ -84,19 +82,18 @@
|
||||
autocomplete="new-password"
|
||||
type="password"
|
||||
required
|
||||
:class="{ 'input-error': (submitAttempted || confirmTouched) && !passwordsMatch }"
|
||||
:class="{ 'input-error': confirmTouched && !passwordsMatch }"
|
||||
@blur="confirmTouched = true"
|
||||
/>
|
||||
<small
|
||||
v-if="(submitAttempted || confirmTouched) && !passwordsMatch"
|
||||
class="error-message"
|
||||
aria-live="polite"
|
||||
<small v-if="confirmTouched && !passwordsMatch" class="error-message" aria-live="polite"
|
||||
>Passwords do not match.</small
|
||||
>
|
||||
</div>
|
||||
|
||||
<div class="form-group" style="margin-top: 0.4rem">
|
||||
<button type="submit" class="form-btn" :disabled="!formValid || loading">Sign up</button>
|
||||
<div class="form-group actions" style="margin-top: 0.4rem">
|
||||
<button type="submit" class="btn btn-primary" :disabled="!formValid || loading">
|
||||
Sign up
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
@@ -153,17 +150,16 @@ import { ref, computed } from 'vue'
|
||||
import { useRouter } from 'vue-router'
|
||||
import { isEmailValid, isPasswordStrong } from '@/common/api'
|
||||
import { EMAIL_EXISTS, MISSING_FIELDS } from '@/common/errorCodes'
|
||||
import '@/assets/view-shared.css'
|
||||
import '@/assets/actions-shared.css'
|
||||
import '@/assets/button-shared.css'
|
||||
import '@/assets/colors.css'
|
||||
import '@/assets/edit-forms.css'
|
||||
import '@/assets/styles.css'
|
||||
|
||||
const router = useRouter()
|
||||
|
||||
const firstName = ref('')
|
||||
const lastName = ref('')
|
||||
const email = ref('')
|
||||
const firstNameTouched = ref(false)
|
||||
const lastNameTouched = ref(false)
|
||||
const emailTouched = ref(false)
|
||||
const password = ref('')
|
||||
const confirmPassword = ref('')
|
||||
const passwordTouched = ref(false)
|
||||
@@ -272,17 +268,28 @@ function clearFields() {
|
||||
confirmTouched.value = false
|
||||
submitAttempted.value = false
|
||||
signupError.value = ''
|
||||
firstNameTouched.value = false
|
||||
lastNameTouched.value = false
|
||||
emailTouched.value = false
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
:deep(.edit-view) {
|
||||
width: 400px;
|
||||
.view {
|
||||
max-width: 420px;
|
||||
margin: 0 auto;
|
||||
background: var(--edit-view-bg, #fff);
|
||||
border-radius: 14px;
|
||||
box-shadow: 0 4px 24px rgba(0, 0, 0, 0.08);
|
||||
padding: 2.2rem 2.2rem 1.5rem 2.2rem;
|
||||
}
|
||||
.view h2 {
|
||||
text-align: center;
|
||||
margin-bottom: 1.5rem;
|
||||
color: var(--form-heading);
|
||||
}
|
||||
|
||||
.signup-form {
|
||||
/* keep the edit-view / child-edit-view look from edit-forms.css,
|
||||
only adjust inputs for email/password types */
|
||||
background: transparent;
|
||||
box-shadow: none;
|
||||
padding: 0;
|
||||
@@ -324,10 +331,13 @@ function clearFields() {
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
/* Reuse existing input / label styles */
|
||||
/* reuse edit-forms form-group styles */
|
||||
.form-group {
|
||||
margin-bottom: 1.5rem;
|
||||
}
|
||||
|
||||
.form-group label {
|
||||
display: block;
|
||||
margin-bottom: 0.45rem;
|
||||
color: var(--form-label, #444);
|
||||
font-weight: 600;
|
||||
}
|
||||
@@ -344,26 +354,17 @@ function clearFields() {
|
||||
background: var(--form-input-bg, #fff);
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
/* Modal styles */
|
||||
.modal-backdrop {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
background: rgba(0, 0, 0, 0.35);
|
||||
.actions {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 3rem;
|
||||
justify-content: center;
|
||||
z-index: 1000;
|
||||
margin-top: 0.5rem;
|
||||
margin-bottom: 0.4rem;
|
||||
}
|
||||
.modal-dialog {
|
||||
background: #fff;
|
||||
padding: 2rem;
|
||||
border-radius: 12px;
|
||||
box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18);
|
||||
max-width: 340px;
|
||||
text-align: center;
|
||||
.actions .btn {
|
||||
padding: 1rem 2.2rem;
|
||||
font-weight: 700;
|
||||
font-size: 1.25rem;
|
||||
min-width: 120px;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div class="layout">
|
||||
<div class="edit-view">
|
||||
<div class="view">
|
||||
<div class="verify-container">
|
||||
<h2 v-if="verifyingLoading">Verifying…</h2>
|
||||
|
||||
@@ -155,9 +155,8 @@ import {
|
||||
USER_NOT_FOUND,
|
||||
ALREADY_VERIFIED,
|
||||
} from '@/common/errorCodes'
|
||||
import '@/assets/actions-shared.css'
|
||||
import '@/assets/button-shared.css'
|
||||
import { parseErrorResponse } from '@/common/api'
|
||||
import '@/assets/styles.css'
|
||||
|
||||
const router = useRouter()
|
||||
const route = useRoute()
|
||||
@@ -299,8 +298,13 @@ function goToLogin() {
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
:deep(.edit-view) {
|
||||
width: 400px;
|
||||
.view {
|
||||
max-width: 400px;
|
||||
margin: 0 auto;
|
||||
background: var(--form-bg);
|
||||
border-radius: 12px;
|
||||
box-shadow: 0 4px 24px var(--form-shadow);
|
||||
padding: 2rem 2.2rem 1.5rem 2.2rem;
|
||||
}
|
||||
|
||||
.verify-container {
|
||||
|
||||
Reference in New Issue
Block a user