اپلیکیشن

یک وب‌اپلیکیشن فارسی و راست‌به‌چپ با نام «صفات امام علی» بساز. هدف آن نمایش، جست‌وجو، ثبت و مدیریت صفات و فضائل امام علی(ع) است. قابلیت‌ها: - صفحه اصلی با هدر زیبا، معرفی کوتاه، جست‌وجوی سریع و کارت‌های صفات. - فهرست صفات با عنوان، توضیح، دسته‌بندی، منبع و تاریخ ثبت؛ امکان جست‌وجو و فیلتر بر اساس دسته‌بندی. - صفحه جزئیات هر صفت با متن کامل، منبع، تصویر اختیاری و دکمه بازگشت. - فرم «بارگذاری صفت» برای وارد کردن عنوان، متن، دسته‌بندی، منبع و تصویر اختیاری از دستگاه؛ اعتبارسنجی فیلدهای ضروری و نمایش پیام موفقیت. - پنل مدیریت داخل خود برنامه برای مشاهده صفات، جست‌وجو، ویرایش، حذف، تغییر دسته‌بندی و تأیید یا رد موارد ثبت‌شده. برای جلوگیری از پیچیدگی، ورود کاربری و سرور لازم نیست و پنل مدیریت در همین نسخه به‌صورت محلی در دسترس باشد. - داده‌ها و تصاویر انتخاب‌شده در ذخیره‌سازی محلی مرورگر/دستگاه باقی بمانند تا با بستن و باز کردن دوباره سایت حذف نشوند. امکان خروجی گرفتن و وارد کردن فایل JSON از داده‌ها هم اضافه کن تا کاربر بتواند نسخه پشتیبان بسازد. - چند دسته‌بندی پیش‌فرض مانند اخلاق، عدالت، شجاعت، دانش، عبادت و سخاوت داشته باشد و امکان افزودن دسته‌بندی جدید در پنل مدیریت فراهم باشد. - چون کاربر محتوای اولیه یا منبعی ارائه نکرده، با صفحه خالیِ راهنما و چند نمونه محتوای نمایشیِ مشخص‌شده به‌عنوان «نمونه» شروع کن و امکان حذف آن‌ها را بده؛ ادعای منبع تاریخی برای نمونه‌ها نداشته باش. ظاهر: محترمانه، فرهنگی و آرام؛ راست‌به‌چپ با ترکیب سرمه‌ای، طلایی و پس‌زمینه روشن، کارت‌های خوانا، تایپوگرافی فارسی مناسب، آیکون‌های ساده و بدون شلوغی. روی موبایل اولویت با خوانایی و دسترسی سریع به جست‌وجو و ثبت صفت باشد. نوار پایین یا منوی موبایلی برای دسترسی به خانه، فهرست، بارگذاری و مدیریت در نظر بگیر. الزامات فنی و واکنش‌گرایی: چیدمان کاملاً responsive و mobile-first باشد؛ از عرض ۳۶۰ پیکسل تا عرض کامل دسکتاپ بدون به‌هم‌ریختگی و بدون اسکرول افقی کار کند. از عرض ثابت پیکسلی و ارتفاع ثابت برای بخش‌های متنی استفاده نشود و چیدمان کشسان با flex یا grid، درصد و واحدهای نسبی به کار برود. دکمه‌ها و همه عناصر قابل لمس حداقل ۴۴×۴۴ پیکسل باشند و فاصله کافی داشته باشند. هیچ قابلیتی فقط با hover در دسترس نباشد. safe-area inset برای ناچ و نوار پایین رعایت شود، meta viewport استاندارد وجود داشته باشد، و در نمایشگرهای بزرگ محتوا با ستون‌بندی یا محدود کردن عرض متن استفاده شود نه کش‌آمدن یک ستون. طراحی باید روی گوشی اندروید و مرورگر دسکتاپ قابل استفاده باشد.