dev.css؛ یه فریمورک کلاسلس ۴.۸ کیلوبایتی
فرانتاندClaude Sonnet 4.6خلاصهٔ کاملتر
به گفتهٔ سازنده، dev.css یه فریمورک CSS کوچیک و ساده و کلاسلسه که از پروژهٔ new.css الهام گرفته. ایدهٔ اصلیش اینه که هر فایل HTML معمولی رو بدون اینکه لازم باشه حتی یه کلاس بهش بدی، مدرن و ریسپانسیو کنه؛ کافیه استایلشیتش رو لود کنی و خود المانهای HTML خام استایل میگیرن.
نکتهٔ جذابش حجمشه: نسخهٔ مینیفایشده فقط حدود ۴.۸ کیلوباته. تو این مقاله اومده که برای استفاده دو راه داری؛ یا مستقیم لینک استایلشیت رو از CDN (مثل jsDelivr) تو بخش صفحه میذاری، یا پکیج @intergrav/dev.css رو با npm یا pnpm به پروژهت اضافه میکنی.
این فریمورک رو المانهای سمنتیک HTML حساب باز کرده. یعنی اگه ساختار درست رو رعایت کنی — مثلاً محتوای اصلی رو تو بپیچی و از و و استفاده کنی — خروجی تمیزی میگیری. سازنده تأکید میکنه که نذاشتن محتوا تو ممکنه بعضی قابلیتها رو خراب کنه.
یکی از امکانات اضافهش سایدباره. با تگ که بالای قرار میگیره میتونی تا دو تا سایدبار داشته باشی و حتی با تاشو (collapsible) بشن. این برای مثلاً ناوبری پیچیدهٔ یه سایت داکیومنت بهدرد میخوره که جا تو هدر نمیشه.
بخش اددونهاش هم چندتا اسنیپت کوچیک CSS یا JS هستن که بعد از خود dev.css لود میشن: header-oneline که هدر رو تو صفحههای باریک جمعوجور میکنه، header-sticky که هدرو بالای صفحه میچسبونه، scroll-to-top.js که یه دکمهٔ برگشت به بالا اضافه میکنه، و responsive-sidebar.js که سایدبارها رو سر یه بریکپوینت خودکار باز و بسته میکنه.
برای ظاهر هم تمپذیره. به گفتهٔ نویسنده تمهای آمادهای مثل night و day، یه سری تم Catppuccin و یه تم terminal داره که بعد از استایل اصلی اعمالشون میکنی. این تمها رو حتی میشه از طریق مدیر یوزراستایل مثل Stylus نصب کرد تا روی هر سایتی که از dev.css استفاده میکنه اعمال بشن.
سازنده شفاف میگه که dev.css برای سایتهای خیلی پیچیده ساخته نشده؛ گزینهٔ خوبیه برای یه بلاگ ساده، صفحهٔ «دربارهٔ من»، جمع کردن لینکهای پرکاربردت یا پروتوتایپ کردن سریع HTML خام. اگه چیز پیچیدهتری خواستی، میتونی همین استایلشیت رو پایه بگیری و تغییرش بدی.
نکات کلیدی:
- یه فریمورک CSS کلاسلس و خیلی سبک (حدود ۴.۸ کیلوبایت مینیفایشده)
- HTML خام رو بدون نوشتن کلاس، مدرن و ریسپانسیو میکنه
- نصب از طریق CDN (jsDelivr) یا پکیج npm/pnpm به اسم @intergrav/dev.css
- روی المانهای سمنتیک HTML مثل ، و سواره
- سایدبار اختیاری، چندتا اددون و تمهایی مثل Catppuccin و terminal داره
- مناسب بلاگ ساده و پروتوتایپ، نه سایتهای پیچیده
