ينتهي الأمر بكل إطار عمل للواجهات بتقديم نفس الوعود: الاتساق وسرعة التطوير ومظهر متماسك. الفرق يكمن في كيفية حل كل إطار عمل للتوتر بين المرونة (الأدوات المساعدة) والدلالة (المكونات الجاهزة). يحاول Cerne الجمع بين الاثنين.
الرموز كمصدر وحيد للحقيقة
تعيش الألوان والمسافات والطباعة والانحناءات والظلال كمتغيرات CSS (--cerne-color-primary، --cerne-space-4...)، يتم توليدها من خرائط Sass. هذا يعني أن المكونات والأدوات المساعدة — وحتى هذا التوثيق نفسه — تقرأ من نفس القيم. التبديل من الوضع الفاتح إلى الداكن هو مجرد تبديل مجموعة المتغيرات في :root.
إذا كان التوثيق و CSS قد يختلفان، فسيختلفان عاجلاً أم آجلاً. لهذا السبب تقرأ صفحة الرموز القيم المحسوبة مباشرة، بدلاً من أرقام منسوخة يدويًا.
الطبقات مرتبة حسب الخصوصية
نتبع نسخة من ITCSS: إعدادات وأدوات Sass أولاً (دون توليد CSS)، ثم:
!important.
- إعادة الضبط والعناصر الأساسية
- كائنات التخطيط (الشبكة، هيكل التطبيق، stack/cluster)
- المكونات الدلالية (الأزرار، البطاقات، النوافذ المنبثقة...)
- الأدوات المساعدة، أخيرًا — لتتمكن دائمًا من الكتابة فوق غيرها
| الطبقة | الخصوصية | مثال |
|---|---|---|
| العناصر | منخفضة | a، table |
| المكونات | متوسطة | .btn-primary |
| الأدوات المساعدة | عالية (مقصودة) | .mt-4 |
المكون الناقص: الحجز
لا يأتي أي من أطر العمل الشائعة بجدول مواعيد جاهز. بالنسبة لأنظمة حجز القاعات، هذا هو المكون الأساسي — لذا بنينا واحدًا باستخدام CSS Grid خالص وجافاسكريبت دون اعتماديات، مع قياس الارتفاع الفعلي للخلية في DOM لتحديد مواضع الأحداث.
باختصار
بدون اعتماديات وقت التشغيل: لا jQuery ولا Popper ولا Chart.js — فقط CSS وجافاسكريبت خالصان، مُجمَّعان في ملف واحد لكل منهما.
هيكل التطبيق والحجز وجدول البيانات الأصلية تغطي العناصر الأساسية الناقصة في كل من Bootstrap و Tailwind الخالص لبناء لوحة تحكم حقيقية.
الوضع الداكن ودعم RTL وإمكانية الوصول AA ليست حزمة منفصلة — إنها السلوك الافتراضي لكل مكون، منذ أول commit.
يقرأ التوثيق الرموز مباشرة من CSS المُجمَّع، لذا لا يوجد أبدًا جدول ألوان قديم.
النتيجة هي إطار عمل يخدم بنفس الكفاءة لوحة تحكم إدارية، أو بيئة تعليمية، أو — كما هذا المقال — مدونة.