مدارک شناسایی
- کد ملی
- شناسنامه
- عکس پرسنلی
ثبت نام خودرو - فراغیب
بدون خلاصۀ ویرایش |
بدون خلاصۀ ویرایش |
||
| خط ۱: | خط ۱: | ||
== مدارک لازم برای ثبت نام خودرو | <html lang="fa" dir="rtl"> | ||
<head> | |||
<meta charset="UTF-8"> | |||
<meta name="viewport, content="width=device-width, initial-scale=1.0"> | |||
<title>لیست مدارک لازم برای ثبت نام خودرو</title> | |||
<meta name="description" content="مشاهده لیست مدارک لازم برای ثبت نام خودرو به صورت گرافیکی و آسان"> | |||
<!-- Tailwind CSS for Styling --> | |||
<script src="https://cdn.tailwindcss.com"></script> | |||
<!-- Font Awesome for Icons --> | |||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> | |||
<!-- Google Fonts (Vazirmatn for Persian) --> | |||
<link href="https://fonts.googleapis.com/css2?family=Vazirmatn:wght@400;700&display=swap" rel="stylesheet"> | |||
<style> | |||
body { | |||
font-family: 'Vazirmatn', sans-serif; | |||
background-color: #064e3b; /* Dark Green Background */ | |||
} | |||
.sun-yellow { | |||
background-color: #FFD700; /* Sun Yellow */ | |||
} | |||
/* Custom overlapping logic for Desktop */ | |||
@media (min-width: 1024px) { | |||
.tile-container { | |||
display: flex; | |||
justify-content: center; | |||
align-items: center; | |||
padding: 50px 0; | |||
} | |||
/* Tile 2 moves up and right to overlap Tile 1's bottom-left */ | |||
.tile-2 { | |||
margin-right: -4rem; | |||
z-index: 20; | |||
} | |||
/* Tile 3 moves up and right to overlap Tile 2's bottom-right */ | |||
/* Note: Since we are in RTL, we adjust the logic to match the visual direction */ | |||
.tile-3 { | |||
margin-right: -4rem; | |||
z-index: 10; | |||
} | |||
} | |||
.card-shadow { | |||
box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.3); | |||
} | |||
</style> | |||
</head> | |||
<body class="min-h-screen flex items-center justify-center p-6"> | |||
=== | <main class="container mx-auto"> | ||
<header class="text-center mb-12"> | |||
<h1 class="text-3xl md:text-4xl font-bold text-yellow-400">مدارک مورد نیاز ثبتنام</h1> | |||
<p class="text-emerald-100 mt-2">آمادهسازی سریع برای ثبتنام خودرو</p> | |||
</header> | |||
=== | <!-- Tiles Container --> | ||
<div class="tile-container flex flex-col lg:flex-row items-center gap-8 lg:gap-0"> | |||
---- | |||
<!-- Category 1: Identity --> | |||
<article class="tile-1 sun-yellow w-full max-w-sm p-8 rounded-[3rem] card-shadow text-emerald-900"> | |||
<div class="text-center mb-6"> | |||
<i class="fas fa-id-card text-4xl mb-3"></i> | |||
<h2 class="text-xl font-bold">مدارک شناسایی</h2> | |||
</div> | |||
<ul class="space-y-4"> | |||
<li class="flex items-center gap-3"> | |||
<i class="fas fa-fingerprint opacity-60"></i> | |||
<span>کد ملی</span> | |||
</li> | |||
<li class="flex items-center gap-3"> | |||
<i class="fas fa-address-card opacity-60"></i> | |||
<span>شناسنامه</span> | |||
</li> | |||
<li class="flex items-center gap-3"> | |||
<i class="fas fa-user-circle opacity-60"></i> | |||
<span>عکس پرسنلی</span> | |||
</li> | |||
</ul> | |||
</article> | |||
== مدارک | <!-- Category 2: Financial --> | ||
<article class="tile-2 sun-yellow w-full max-w-sm p-8 rounded-[3rem] card-shadow text-emerald-900"> | |||
<div class="text-center mb-6"> | |||
<i class="fas fa-wallet text-4xl mb-3"></i> | |||
<h2 class="text-xl font-bold">مدارک مالی</h2> | |||
</div> | |||
<ul class="space-y-4"> | |||
<li class="flex items-center gap-3"> | |||
<i class="fas fa-credit-card opacity-60"></i> | |||
<span>شماره کارت</span> | |||
</li> | |||
<li class="flex items-center gap-3"> | |||
<i class="fas fa-key opacity-60"></i> | |||
<span>سریال کارت</span> | |||
</li> | |||
<li class="flex items-center gap-3"> | |||
<i class="fas fa-file-invoice-dollar opacity-60"></i> | |||
<span>گواهی مالیاتی</span> | |||
</li> | |||
</ul> | |||
</article> | |||
<!-- Category 3: Conditional --> | |||
<article class="tile-3 sun-yellow w-full max-w-sm p-8 rounded-[3rem] card-shadow text-emerald-900"> | |||
<div class="text-center mb-6"> | |||
<i class="fas fa-file-signature text-4xl mb-3"></i> | |||
<h2 class="text-xl font-bold">شرایط خاص</h2> | |||
</div> | |||
<ul class="space-y-4"> | |||
<li class="flex items-center gap-3"> | |||
<i class="fas fa-briefcase opacity-60"></i> | |||
<span>گواهی اشتغال</span> | |||
</li> | |||
<li class="flex items-center gap-3"> | |||
<i class="fas fa-home opacity-60"></i> | |||
<span>سند مالکیت</span> | |||
</li> | |||
<li class="flex items-center gap-3"> | |||
<i class="fas fa-users opacity-60"></i> | |||
<span>مدارک تکفل</span> | |||
</li> | |||
</ul> | |||
</article> | |||
</div> | |||
</main> | |||
= | <footer class="fixed bottom-4 text-emerald-300 text-sm"> | ||
طراحی شده برای سهولت در ثبت نام | |||
</footer> | |||
</body> | |||
</html> | |||
نسخهٔ ۲۸ ژوئیهٔ ۲۰۲۶، ساعت ۱۴:۴۹
مدارک مورد نیاز ثبتنام
آمادهسازی سریع برای ثبتنام خودرو
مدارک مالی
- شماره کارت
- سریال کارت
- گواهی مالیاتی
شرایط خاص
- گواهی اشتغال
- سند مالکیت
- مدارک تکفل