Skip to content

Commit

Permalink
Scrollbar update auth
Browse files Browse the repository at this point in the history
  • Loading branch information
@atomjoy
atomjoy committed Jul 26, 2024
1 parent 5f85155 commit c2f4ad1
Show file tree
Hide file tree
Showing 7 changed files with 244 additions and 363 deletions.
61 changes: 27 additions & 34 deletions resources/js/views/auth/ActivateView.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -27,45 +27,38 @@ onMounted(() => {
<template>
<PageTitle :title="$t('message.activate_title')" />

<div id="page-wraper">
<div class="page-auth">
<div class="top-bar">
<AuthLogo />
<ChangeLocale />
<ChangeTheme />
</div>
<div class="form-wraper">
<form class="form-auth">
<h1 class="full">
{{ $t('activate.Activation') }}
</h1>
<div id="app__scrollbar" class="scrollbar-thin">
<div id="page-wraper">
<div class="page-auth">
<div class="top-bar">
<AuthLogo />
<ChangeLocale />
<ChangeTheme />
</div>
<div class="form-wraper">
<form class="form-auth">
<h1 class="full">
{{ $t('activate.Activation') }}
</h1>

<div
v-if="store.getMessage.value != null"
:class="[
store.getError.value ? 'alert-error' : 'alert-info',
'animate__animated animate__flipInX',
]">
{{ store.getMessage.value }}
</div>
<div v-if="store.getMessage.value != null" :class="[store.getError.value ? 'alert-error' : 'alert-info', 'animate__animated animate__flipInX']">
{{ store.getMessage.value }}
</div>

<div class="full">
<p class="alert-default">{{ $t('activate.Description') }}</p>
</div>
<div class="full">
<p class="alert-default">{{ $t('activate.Description') }}</p>
</div>

<div class="full mb">
<router-link to="/login" class="link-left">{{
$t('activate.Have_an_account')
}}</router-link>
<router-link to="/password" class="link-right">{{
$t('activate.Forgot_password')
}}</router-link>
</div>
</form>
<div class="full mb">
<router-link to="/login" class="link-left">{{ $t('activate.Have_an_account') }}</router-link>
<router-link to="/password" class="link-right">{{ $t('activate.Forgot_password') }}</router-link>
</div>
</form>
</div>
</div>
</div>

<PolicyBar />
<PolicyBar />
</div>
</div>
</template>

Expand Down
49 changes: 23 additions & 26 deletions resources/js/views/auth/EmailChangeView.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -27,36 +27,33 @@ onMounted(() => {
<template>
<PageTitle :title="$t('message.change_email_title')" />

<div id="page-wraper">
<div class="page-auth">
<div class="top-bar">
<AuthLogo />
<ChangeLocale />
<ChangeTheme />
</div>
<div class="form-wraper">
<form class="form-auth">
<h1 class="full">
{{ $t('change_email.Confirm') }}
</h1>
<div id="app__scrollbar" class="scrollbar-thin">
<div id="page-wraper">
<div class="page-auth">
<div class="top-bar">
<AuthLogo />
<ChangeLocale />
<ChangeTheme />
</div>
<div class="form-wraper">
<form class="form-auth">
<h1 class="full">
{{ $t('change_email.Confirm') }}
</h1>

<div
v-if="store.getMessage.value != null"
:class="[
store.getError.value ? 'alert-error' : 'alert-info',
'animate__animated animate__flipInX',
]">
{{ store.getMessage.value }}
</div>
<div v-if="store.getMessage.value != null" :class="[store.getError.value ? 'alert-error' : 'alert-info', 'animate__animated animate__flipInX']">
{{ store.getMessage.value }}
</div>

<div class="full mb">
<p class="alert-default">{{ $t('change_email.Description') }}</p>
</div>
</form>
<div class="full mb">
<p class="alert-default">{{ $t('change_email.Description') }}</p>
</div>
</form>
</div>
</div>
</div>

<PolicyBar />
<PolicyBar />
</div>
</div>
</template>

Expand Down
85 changes: 34 additions & 51 deletions resources/js/views/auth/LoginF2aView.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -36,65 +36,48 @@ function onSubmit(e) {
<template>
<PageTitle :title="$t('message.login_f2a_title')" />
<div id="page-wraper">
<div class="page-auth">
<div class="top-bar">
<AuthLogo />
<ChangeLocale />
<ChangeTheme />
</div>
<div class="form-wraper">
<form @submit.prevent="onSubmit" class="form-auth">
<h1 class="full">
{{ $t('login.F2a_Confirm') }}
</h1>
<div id="app__scrollbar" class="scrollbar-thin">
<div id="page-wraper">
<div class="page-auth">
<div class="top-bar">
<AuthLogo />
<ChangeLocale />
<ChangeTheme />
</div>
<div class="form-wraper">
<form @submit.prevent="onSubmit" class="form-auth">
<h1 class="full">
{{ $t('login.F2a_Confirm') }}
</h1>
<div
v-if="store?.getMessage?.value != null"
:class="[
store?.getError?.value ? 'alert-error' : 'alert-info',
'animate__animated animate__flipInX',
]">
{{ store?.getMessage?.value }}
</div>
<div v-if="store?.getMessage?.value != null" :class="[store?.getError?.value ? 'alert-error' : 'alert-info', 'animate__animated animate__flipInX']">
{{ store?.getMessage?.value }}
</div>
<Input
:focus="'true'"
type="text"
name="code"
v-model="code"
:placeholder="$t('login.F2a_code_eg')"
:label="$t('login.F2a_code')">
<i class="far fa-envelope"></i>
</Input>
<Input :focus="'true'" type="text" name="code" v-model="code" :placeholder="$t('login.F2a_code_eg')" :label="$t('login.F2a_code')">
<i class="far fa-envelope"></i>
</Input>
<input type="hidden" name="hash" v-model="hash" />
<input type="hidden" name="hash" v-model="hash" />
<div class="full">
<Checkbox
:label="$t('login.Remember_me')"
value="1"
v-model="remember_me"
name="remember_me" />
</div>
<div class="full">
<Checkbox :label="$t('login.Remember_me')" value="1" v-model="remember_me" name="remember_me" />
</div>
<button class="button" :title="$t('login.Login')" ref="button">
{{ $t('login.Login') }}
</button>
<button class="button" :title="$t('login.Login')" ref="button">
{{ $t('login.Login') }}
</button>
<div class="full">
<router-link to="/register" class="link-left">{{
$t('login.Dont_have_an_account')
}}</router-link>
<router-link to="/password" class="link-right">{{
$t('login.Forgot_password')
}}</router-link>
</div>
</form>
<div class="full">
<router-link to="/register" class="link-left">{{ $t('login.Dont_have_an_account') }}</router-link>
<router-link to="/password" class="link-right">{{ $t('login.Forgot_password') }}</router-link>
</div>
</form>
</div>
</div>
</div>
<PolicyBar />
<PolicyBar />
</div>
</div>
</template>
Expand Down
96 changes: 37 additions & 59 deletions resources/js/views/auth/LoginView.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -37,74 +37,52 @@ function onSubmit(e) {
<template>
<PageTitle :title="$t('message.login_title')" />

<div id="page-wraper">
<div class="page-auth">
<div class="top-bar">
<AuthLogo />
<ChangeLocale />
<ChangeTheme />
</div>
<div class="form-wraper">
<form @submit.prevent="onSubmit" class="form-auth">
<h1 class="full">
{{ $t('login.Sign_In') }}
</h1>
<div id="app__scrollbar" class="scrollbar-thin">
<div id="page-wraper">
<div class="page-auth">
<div class="top-bar">
<AuthLogo />
<ChangeLocale />
<ChangeTheme />
</div>
<div class="form-wraper">
<form @submit.prevent="onSubmit" class="form-auth">
<h1 class="full">
{{ $t('login.Sign_In') }}
</h1>

<SocialLogin />
<SocialLogin />

<div
v-if="store.getMessage.value != null"
:class="[
store.getError.value ? 'alert-error' : 'alert-info',
'animate__animated animate__flipInX',
]">
{{ store.getMessage.value }}
</div>
<div v-if="store.getMessage.value != null" :class="[store.getError.value ? 'alert-error' : 'alert-info', 'animate__animated animate__flipInX']">
{{ store.getMessage.value }}
</div>

<Input
:focus="'true'"
type="text"
name="email"
v-model="email"
:placeholder="$t('login.Email_address_eg')"
:label="$t('login.Email_address')">
<i class="far fa-envelope"></i>
</Input>
<Input :focus="'true'" type="text" name="email" v-model="email" :placeholder="$t('login.Email_address_eg')" :label="$t('login.Email_address')">
<i class="far fa-envelope"></i>
</Input>

<Password
type="password"
name="password"
v-model="password"
:placeholder="$t('login.Password_eg')"
:label="$t('login.Password')">
<i class="fa-solid fa-key"></i>
</Password>
<Password type="password" name="password" v-model="password" :placeholder="$t('login.Password_eg')" :label="$t('login.Password')">
<i class="fa-solid fa-key"></i>
</Password>

<div class="full">
<Checkbox
:label="$t('login.Remember_me')"
value="1"
v-model="remember_me"
name="remember_me" />
</div>
<div class="full">
<Checkbox :label="$t('login.Remember_me')" value="1" v-model="remember_me" name="remember_me" />
</div>

<button class="button" :title="$t('login.Login')" ref="button">
{{ $t('login.Login') }}
</button>
<button class="button" :title="$t('login.Login')" ref="button">
{{ $t('login.Login') }}
</button>

<div class="full">
<router-link to="/register" class="link-left">{{
$t('login.Dont_have_an_account')
}}</router-link>
<router-link to="/password" class="link-right">{{
$t('login.Forgot_password')
}}</router-link>
</div>
</form>
<div class="full">
<router-link to="/register" class="link-left">{{ $t('login.Dont_have_an_account') }}</router-link>
<router-link to="/password" class="link-right">{{ $t('login.Forgot_password') }}</router-link>
</div>
</form>
</div>
</div>
</div>

<PolicyBar />
<PolicyBar />
</div>
</div>
</template>

Expand Down
Loading

0 comments on commit c2f4ad1

Please sign in to comment.