48 lines
3.3 KiB
Vue
48 lines
3.3 KiB
Vue
<script setup>
|
||
import { Inertia } from '@inertiajs/inertia'
|
||
import UiButton from '../ui/UiButton.vue'
|
||
|
||
defineProps({
|
||
user: {
|
||
type: Object,
|
||
default: null
|
||
}
|
||
})
|
||
</script>
|
||
|
||
<template>
|
||
<section class="bg-white pb-20 lg:pb-28">
|
||
<div class="container max-w-7xl px-4 sm:px-6">
|
||
<div class="landing-reveal relative overflow-hidden rounded-[36px] bg-dark px-6 py-16 sm:px-12 lg:px-20 lg:py-20 grid lg:grid-cols-[1.3fr_1fr] gap-10 items-center">
|
||
<svg class="absolute -bottom-16 -left-10 w-72 h-72 text-white/[0.04] pointer-events-none" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
|
||
<path d="M8.35 3c1.18-.17 2.43 1.12 2.79 2.9.36 1.77-.29 3.35-1.47 3.53-1.17.18-2.43-1.11-2.8-2.89-.36-1.77.3-3.35 1.48-3.54zm7.3 0c1.18.19 1.84 1.77 1.48 3.54-.37 1.78-1.63 3.07-2.8 2.89-1.18-.18-1.83-1.76-1.47-3.53.36-1.78 1.61-3.07 2.79-2.9zM3 7.6c1.14-.49 2.72.38 3.53 1.95.81 1.56.55 3.22-.58 3.71-1.14.48-2.72-.39-3.53-1.95C1.61 9.75 1.87 8.09 3 7.6zm18 0c1.13.49 1.39 2.15.58 3.71-.81 1.56-2.39 2.43-3.53 1.95-1.13-.49-1.39-2.15-.58-3.71.81-1.57 2.39-2.44 3.53-1.95zM12 12c2.8 0 5.6 3.2 6.2 6.2.4 2-.8 3.8-3 3.8-1.2 0-2.2-.7-3.2-.7s-2 .7-3.2.7c-2.2 0-3.4-1.8-3-3.8C6.4 15.2 9.2 12 12 12z" />
|
||
</svg>
|
||
|
||
<div class="relative">
|
||
<h2 class="text-2xl sm:text-3xl lg:text-[2.6rem] font-black leading-[1.45] text-white">
|
||
اولین پرونده‌ی پت‌تان را
|
||
<span class="text-dominant-300">همین امروز</span>
|
||
باز کنید
|
||
</h2>
|
||
<p class="mt-5 max-w-lg text-base leading-8 text-white/60">
|
||
ثبت‌نام فقط با شماره موبایل و در کمتر از یک دقیقه. تا وقتی درخواستی ثبت نکنید، هزینه‌ای در کار نیست.
|
||
</p>
|
||
<div class="mt-8 flex flex-wrap items-center gap-4">
|
||
<UiButton v-if="user" label="رفتن به پنل کاربری" severity="secondary" size="large" @click="Inertia.visit(route('dashboard.index'))" />
|
||
<UiButton v-else label="ثبت‌نام به‌عنوان سرپرست" severity="secondary" size="large" @click="Inertia.visit(route('register.chooseType'))" />
|
||
<span class="text-xs text-white/40">بدون نیاز به کارت بانکی</span>
|
||
</div>
|
||
</div>
|
||
|
||
<ul class="relative space-y-3" aria-hidden="true">
|
||
<li v-for="(item, i) in ['ساخت پروفایل پت', 'آپلود تصاویر', 'انتخاب رادیولوژیست', 'دریافت گزارش']" :key="item" class="flex items-center gap-3 rounded-2xl bg-white/5 border border-white/10 px-4 py-3 text-sm text-white/80">
|
||
<span :class="i < 3 ? 'bg-success text-white' : 'bg-white/10 text-white/50'" class="w-6 h-6 rounded-full flex items-center justify-center text-[10px]"><i class="fi fi-rr-check leading-none"></i></span>
|
||
{{ item }}
|
||
<span v-if="i === 3" class="mr-auto text-[10px] text-dominant-300">پیامک ↓</span>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
</template>
|