centering auth page fix

This commit is contained in:
Čarodej
2022-05-31 15:38:08 +02:00
parent 7659cc7221
commit 05f58e1468
9 changed files with 28 additions and 28 deletions

View File

@@ -11,7 +11,7 @@
<span v-if="description" class="block text-xs leading-4 dark:text-gray-500 text-gray-500" v-html="description"></span>
<!--Input Description-->
<span v-if="error" class="error-message">
<span v-if="error" class="text-left text-xs text-red-600">
{{ error }}
</span>
</div>

View File

@@ -1,5 +1,5 @@
<template>
<div v-if="isVisible" class="w-full max-w-xl text-center">
<div v-if="isVisible" class="w-full max-w-xl text-center m-auto py-6">
<slot />
</div>
</template>

View File

@@ -1,5 +1,5 @@
<template>
<div class="flex items-center justify-center px-2.5 md:px-6">
<div class="flex px-2.5 md:px-6">
<slot />
</div>
</template>

View File

@@ -58,7 +58,7 @@
<!--Member list-->
<ValidationProvider tag="div" mode="passive" name="Members" rules="required" v-slot="{ errors }">
<AppInputText :title="$t('your_members')" :error="errors[0]" :is-last="true">
<span v-if="errors[0]" class="error-message" style="margin-top: -5px">
<span v-if="errors[0]" class="text-left text-xs text-red-600" style="margin-top: -5px">
{{ $t('add_at_least_one_member') }}
</span>

View File

@@ -39,7 +39,7 @@
<!--Member list-->
<ValidationProvider tag="div" mode="passive" name="Members" v-slot="{ errors }">
<label class="input-label">{{ $t('your_members') }}:</label>
<span v-if="errors[0]" class="error-message" style="margin-top: -5px">{{
<span v-if="errors[0]" class="text-left text-xs text-red-600" style="margin-top: -5px">{{
$t('add_at_least_one_member')
}}</span>
<TeamList v-model="members" />

View File

@@ -45,7 +45,7 @@
:class="{ '!border-rose-600': errors[0] }"
class="focus-border-theme input-dark"
/>
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
<span class="text-left text-xs text-red-600" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
</div>
@@ -65,7 +65,7 @@
:class="{ '!border-rose-600': errors[0] }"
class="focus-border-theme input-dark"
></textarea>
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
<span class="text-left text-xs text-red-600" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
</div>
</div>
@@ -111,7 +111,7 @@
:class="{ '!border-rose-600': errors[0] }"
class="focus-border-theme input-dark"
/>
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
<span class="text-left text-xs text-red-600" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
</div>
@@ -133,7 +133,7 @@
:class="{ '!border-rose-600': errors[0] }"
class="focus-border-theme input-dark"
></textarea>
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
<span class="text-left text-xs text-red-600" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
</div>
</div>
@@ -185,7 +185,7 @@
:class="{ '!border-rose-600': errors[0] }"
class="focus-border-theme input-dark"
/>
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
<span class="text-left text-xs text-red-600" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
</div>
<div class="block-wrapper">
@@ -210,7 +210,7 @@
:class="{ '!border-rose-600': errors[0] }"
class="focus-border-theme input-dark"
></textarea>
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
<span class="text-left text-xs text-red-600" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
</div>
<div class="block-wrapper">
@@ -229,7 +229,7 @@
:class="{ '!border-rose-600': errors[0] }"
class="focus-border-theme input-dark"
/>
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
<span class="text-left text-xs text-red-600" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
</div>
<div class="block-wrapper">
@@ -254,7 +254,7 @@
:class="{ '!border-rose-600': errors[0] }"
class="focus-border-theme input-dark"
></textarea>
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
<span class="text-left text-xs text-red-600" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
</div>
<div class="block-wrapper">
@@ -273,7 +273,7 @@
:class="{ '!border-rose-600': errors[0] }"
class="focus-border-theme input-dark"
/>
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
<span class="text-left text-xs text-red-600" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
</div>
<div class="block-wrapper">
@@ -298,7 +298,7 @@
:class="{ '!border-rose-600': errors[0] }"
class="focus-border-theme input-dark"
></textarea>
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
<span class="text-left text-xs text-red-600" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
</div>
</div>
@@ -354,7 +354,7 @@
:class="{ '!border-rose-600': errors[0] }"
class="focus-border-theme input-dark"
/>
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
<span class="text-left text-xs text-red-600" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
</div>
@@ -376,7 +376,7 @@
:class="{ '!border-rose-600': errors[0] }"
class="focus-border-theme input-dark"
></textarea>
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
<span class="text-left text-xs text-red-600" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
</div>
</div>
@@ -428,7 +428,7 @@
:class="{ '!border-rose-600': errors[0] }"
class="focus-border-theme input-dark"
/>
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
<span class="text-left text-xs text-red-600" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
</div>
@@ -454,7 +454,7 @@
:class="{ '!border-rose-600': errors[0] }"
class="focus-border-theme input-dark"
></textarea>
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
<span class="text-left text-xs text-red-600" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
</div>
</div>
@@ -480,7 +480,7 @@
:class="{ '!border-rose-600': errors[0] }"
class="focus-border-theme input-dark"
/>
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
<span class="text-left text-xs text-red-600" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
</div>
</div>

View File

@@ -1,5 +1,5 @@
<template>
<AuthContentWrapper ref="auth">
<AuthContentWrapper ref="auth" class="h-screen">
<!--Create new password-->
<AuthContent name="create-new-password" :visible="true">
<Headline :title="$t('page_create_password.title')" :description="$t('page_create_password.subtitle')" />
@@ -30,7 +30,7 @@
class="dark:placeholder:text-gray-600 focus-border-theme w-full appearance-none rounded-lg border border-transparent bg-light-background px-5 py-3.5 font-bold dark:bg-2x-dark-foreground"
:class="{ '!border-rose-600': errors[0] }"
/>
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
<span class="text-left text-xs text-red-600" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
</div>
@@ -53,7 +53,7 @@
class="dark:placeholder:text-gray-600 focus-border-theme w-full appearance-none rounded-lg border border-transparent bg-light-background px-5 py-3.5 font-bold dark:bg-2x-dark-foreground"
:class="{ '!border-rose-600': errors[0] }"
/>
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
<span class="text-left text-xs text-red-600" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
</div>
@@ -76,7 +76,7 @@
class="dark:placeholder:text-gray-600 focus-border-theme w-full appearance-none rounded-lg border border-transparent bg-light-background px-5 py-3.5 font-bold dark:bg-2x-dark-foreground"
:class="{ '!border-rose-600': errors[0] }"
/>
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
<span class="text-left text-xs text-red-600" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
</div>

View File

@@ -1,7 +1,7 @@
<template>
<AuthContentWrapper ref="auth">
<AuthContentWrapper ref="auth" class="h-screen">
<!--Registration-->
<AuthContent name="sign-up" :visible="true" class="mt-4 mb-12">
<AuthContent name="sign-up" :visible="true">
<Headline :title="$t('page_registration.title')" :description="$t('page_registration.subtitle')" />
<ValidationObserver

View File

@@ -30,7 +30,7 @@
class="focus-border-theme input-dark"
:class="{ '!border-rose-600': errors[0] }"
/>
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
<span class="text-left text-xs text-red-600" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
</div>
@@ -44,7 +44,7 @@
class="focus-border-theme input-dark"
:class="{ '!border-rose-600': errors[0] }"
></textarea>
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
<span class="text-left text-xs text-red-600" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
</div>