پایه‌ها

معرفی

همه‌ی ظاهر پرتو از یک لایه‌ی توکن CSS می‌آید. یک @import کافی است و از آن به بعد هر کلاس Tailwind که به کار می‌برید به همان توکن‌ها می‌رسد:

/* app/globals.css */
@import 'tailwindcss';
@import '@partodata/ui/tailwind.css';

تم تاریک پیش‌فرضِ :root است و تم روشن با data-theme="light" صریحاً فعال می‌شود. هیچ‌جا رنگ خام نمی‌نویسید.

راهنمای انتخاب

دسته‌بندی

نکات مشترک

پنج محدودیت ترکیب‌بندی روی هر صفحه‌ی این بخش حاکم‌اند و در قرارداد مصرف کامل توضیح داده شده‌اند. خلاصه‌شان:

• رنگ فقط از توکن سمانتیک — نه hex، نه پالت خام Tailwind، نه hsl() دور یک توکن
• هر رنگ پس‌زمینه‌ی برند/وضعیت، جفت text-on-* خودش را دارد؛ text-white جواب نیست
• اندازه‌ی متن از مقیاس نام‌دار می‌آید، نه مقدار دلخواه
• شعاع گوشه و عرض کانتینر از توکن، نه عدد px
• فاصله و جهت با ویژگی‌های منطقی — ms/me/ps/pe و start/end

روی همهٔ این‌ها، ساختار صفحه از ترکیب می‌آید نه از رنگ: هر بلوک محصور روی یک ظرف (پرکننده + مرز + شعاع + سایه) و هر صفحه با لایهٔ کم — گرامر بصری.