changed back to shop button style

This commit is contained in:
Mamalizz
2025-04-21 23:33:07 +03:30
parent e2f951581f
commit 28d774892a
+20 -34
View File
@@ -39,10 +39,7 @@ const formRules = computed(() => {
return {
phone: {
required: helpers.withMessage("Phone is required", required),
phoneValidator: helpers.withMessage(
"شماره تلفن وارد شده معتبر نمی باشد",
helpers.regex(/^[1-9][0-9]{9}$/)
),
phoneValidator: helpers.withMessage("شماره تلفن وارد شده معتبر نمی باشد", helpers.regex(/^[1-9][0-9]{9}$/)),
},
};
});
@@ -63,11 +60,7 @@ const {
});
const { mutateAsync: sendOtp, isPending: sendOtpIsPending } = useOtp();
const {
mutateAsync: signIn,
isPending: signInIsPending,
status: signInStatus,
} = useSignIn();
const { mutateAsync: signIn, isPending: signInIsPending, status: signInStatus } = useSignIn();
// computed
@@ -152,9 +145,7 @@ const resetForm = () => {
<template>
<div class="w-full flex h-svh items-center relative container">
<div class="pattern -z-10 size-full fixed inset-0" />
<div
class="flex items-center justify-center flex-col size-full translate-y-[-100px]"
>
<div class="flex items-center justify-center flex-col size-full translate-y-[-100px]">
<img
class="aspect-square w-[250px] sm:w-[325px] translate-y-[90px] sm:translate-y-[120px] animate-fade-in"
src="/img/heymlz/heymlz-signin.gif"
@@ -166,11 +157,12 @@ const resetForm = () => {
<div
class="max-w-[600px] w-full p-6 h-[350px] sm:h-[400px] flex flex-col items-center bg-white border shadow-black/10 justify-center border-slate-300 rounded-3xl"
>
<h1 class="typo-h-6 sm:typo-h-5 mt-8">
شماره خود را وارد کنید
</h1>
<h1 class="typo-h-6 sm:typo-h-5 mt-8">شماره خود را وارد کنید</h1>
<form @submit.prevent class="max-w-[500px] w-full mt-12">
<form
@submit.prevent
class="max-w-[500px] w-full mt-12"
>
<Input
v-if="!showOtp"
class="w-full tracking-[3px] persian-number"
@@ -186,9 +178,7 @@ const resetForm = () => {
name="twemoji:flag-iran"
size="24"
/>
<span class="text-slate-500 typo-label-sm">
+۹۸
</span>
<span class="text-slate-500 typo-label-sm"> +۹۸ </span>
</div>
</template>
</Input>
@@ -196,13 +186,7 @@ const resetForm = () => {
<OtpInput
v-else
v-model="otpCode"
:status="
signInStatus === 'success'
? 'success'
: signInStatus === 'error'
? 'error'
: 'idle'
"
:status="signInStatus === 'success' ? 'success' : signInStatus === 'error' ? 'error' : 'idle'"
:disabled="signInIsPending || sendOtpIsPending"
:autofocus="true"
@complete="handleLogin"
@@ -220,7 +204,10 @@ const resetForm = () => {
ارسال کد
</Button>
<div v-else class="flex items-center w-full gap-4 mt-4">
<div
v-else
class="flex items-center w-full gap-4 mt-4"
>
<Button
class="rounded-full w-full mt-4 max-sm:h-[45px]"
type="button"
@@ -235,11 +222,7 @@ const resetForm = () => {
type="submit"
@click="resendOtp"
:loading="signInIsPending || sendOtpIsPending"
:disabled="
signInIsPending ||
isResendOtpBlocked ||
sendOtpIsPending
"
:disabled="signInIsPending || isResendOtpBlocked || sendOtpIsPending"
>
ارسال مجدد کد
{{ isResendOtpBlocked ? otpBlockerTimePassed : "" }}
@@ -250,8 +233,11 @@ const resetForm = () => {
to="/"
class="flex items-center gap-2 justify-center mt-6"
>
<span> بازگشت به فروشگاه </span>
<Icon name="ci:left-rotation" size="24" />
<Icon
name="ci:left-rotation"
class="lg:text-xl"
/>
<span class="text-xs lg:text-sm"> بازگشت به فروشگاه </span>
</NuxtLink>
</form>
</div>