Tailwind v4 وملف الإعداد الذي حذفته
رموز التصميم داخل CSS، ولماذا يستحق oklch غرابته
نقل Tailwind v4 الإعدادات من JavaScript إلى CSS. توقعت أن يكون ذلك تغييراً شكلياً ومسألة نقل ملف لا أكثر. تبيّن أنه غيّر طريقة تفكيري في السمات، ويعود ذلك أساساً إلى أن الرمز المعرَّف في CSS شيء يعرفه المتصفح أثناء التشغيل، بينما الرمز المعرَّف في ملف إعداد لم يكن يوماً سوى شيء تعرفه خطوة البناء.
01الإعدادات انتقلت إلى ورقة الأنماط
الإعداد القديم كان ملف JavaScript تقرأه خطوة البناء لتوليد أصناف المنافع. الألوان والمسافات وأنصاف الأقطار ونقاط التوقف كانت كلها قيماً في كائن، ولم يكن لدى أي شيء في المتصفح أدنى فكرة عن وجودها. أما الإعداد الجديد فيصرّح عنها كخصائص مخصّصة داخل كتلة سمة في ورقة الأنماط، ويولّد Tailwind المنافع من تلك التصريحات. والفرق العملي المباشر هو أن كل رمز تصميم صار أيضاً متغيّر CSS حياً. أستطيع قراءة واحد منها في نمط سطري داخل مكوّن، وإدراجه في تدرّج لوني، وتسليمه إلى خلفية canvas أو WebGL لتتطابق ألوانها المتحركة مع السمة، وتغييره أثناء التشغيل دون إعادة بناء. في هذا الموقع يُلوَّن شريط التحميل أعلى الصفحة بالإشارة إلى الرمز الأساسي مباشرة، ما يعني أنه يتتبّع أي تغيير مستقبلي في لوحة الألوان دون لمس سطر واحد. والفرق الثاني أن هناك مكاناً واحداً تنظر فيه. قرارات التصميم تعيش في ورقة الأنماط بجوار الطبقة الأساسية التي تستعملها، بدل ملف إعداد في جذر المشروع تفتحه مرتين في الشهر وتحتاج إعادة توجيه نفسك داخله في كل مرة.
02لماذا انتقلت إلى oklch
كل لون في هذا الموقع مصرَّح بـ oklch، وهو يبدو غريباً ليوم واحد ثم يصعب التخلي عنه. والسبب أن قناة الإضاءة فيه منتظمة إدراكياً. لونان بالقيمة نفسها للإضاءة يبدوان فعلاً بالسطوع نفسه للعين البشرية، وهذا غير صحيح في hsl، حيث قد يختلف أصفر وأزرق بالقيمة المعلنة نفسها اختلافاً هائلاً في السطوع المُدرَك. هذه الخاصية وحدها تجعل بناء السمة عملاً آلياً لا حدسياً. توليد حالة تمرير الفأرة تعديل بسيط في الإضاءة. وبناء النسخة الداكنة مسألة عكس الإضاءة مع إبقاء الصبغة والتشبّع، فتبقى النتيجة متماسكة بدل أن تصبح موحلة في الدرجات الوسطى. وفحص التباين يصير شيئاً تستطيع الاستدلال عليه من الأرقام قبل أن تفتح أداة فحص. وهناك كلفة حقيقية، وهي أن قراءة لون وتخيّله تحتاج تمريناً، ومعظم الأدوات ما زالت تتحدث بالنظام الست عشري. أحتفظ بتعليق فيه المكافئ الست عشري بجانب الرموز التي أحرّرها كثيراً، وهذا يغطي تسعين بالمئة من الحالات دون التخلي عن الفوائد.
03التسمية بالدور لا بالقيمة
طبقة الرموز مقسومة إلى اثنتين، وهذا هو الجزء الذي يجعل السمات تعمل فعلاً. الطبقة الأولى قيم خام تحت أسماء دلالية: خلفية، ومقدّمة، وأساسي، وباهت، وحدّ، وهكذا. والطبقة الثانية تربط تلك بفضاء أسماء الألوان في Tailwind، وهو ما يولّد أصناف المنافع. والمكوّنات لا تشير أبداً إلا إلى الاسم الدلالي. لا شيء في شجرة المكوّنات يعرف رمزاً ست عشرياً أو ثلاثية oklch. وعندها يصبح الوضع الداكن مسألة إعادة تعريف الأسماء الدلالية نفسها تحت محدِّد داكن، فيتبع كل مكوّن دون تعديل لأن أياً منها لم يشر يوماً إلى لون حرفي. يبدو هذا بديهياً حين يُكتب، ومن السهل جداً مخالفته تحت ضغط الوقت. ما زلت أملك حفنة مكوّنات فيها ألوان حرفية، زخارف تدرّج غالباً، وهي بالضبط المكوّنات التي تبدو خاطئة قليلاً في إحدى السمتين. وهذا التلازم ليس مصادفة. كل لون حرفي موضعٌ لا ينطبق فيه نظام السمات، وتجدها ببساطة بتبديل السمة والبحث عمّا لم يتغيّر.
04ما كسرته الترقية
أمران أوقعاني، وكلاهما عادي. أسماء منافع التدرّج تغيّرت، فالأصناف المكتوبة bg-gradient-to-r صارت bg-linear-to-r، ولأن صنف المنفعة المجهول لا ينتج خطأً ولا نمطاً، يكون الفشل صامتاً. التدرّج يتوقف عن الوجود ببساطة ويُعرض العنصر بخلفية مسطّحة تبدو مقصودة بما يكفي لتمرّ أمامك دون انتباه. عثرت على آخر ما تبقى عندي بالبحث النصي لا بالنظر. والثاني كان الصيغة المخصّصة للوضع الداكن، التي صارت تحتاج تصريحاً صريحاً في ورقة الأنماط بدل مفتاح في ملف الإعداد. أهملها فلا يفعل الوضع الداكن شيئاً على الإطلاق، وهذا على الأقل يفشل بصوت عالٍ. والدرس الأوسع يتعلق بصنف من العلل لا بأي من الحالتين. في إطار عمل قائم على المنافع، الخطأ المطبعي في اسم صنف ليس خطأً نحوياً. لا ينتج تحذيراً ولا مخرجاً في الطرفية ولا حالة خطأ بصرية، بل عنصراً يفتقر بصمت إلى نمط. وهذا يستحق إضافة محرِّر تتحقق من أسماء الأصناف، ويستحق قراءة فروقات الترقية بتمعّن بدل الثقة بأن البناء الناجح يعني صفحة ناجحة.
الخلاصة
نقل الإعدادات إلى CSS حوّل رموز التصميم من ثوابت في وقت البناء إلى قيم أثناء التشغيل، وهذا أتاح أكثر مما يوحي به مجرد نقل ملف. عرّف الرموز بالدور لا بالقيمة، واستعمل فضاء لون منتظماً إدراكياً كي تنضبط حسابات السمة، وتذكّر أن صنف المنفعة المكتوب خطأً يفشل بصمت.