تخطَّ إلى المحتوى

مقدمة

ما هو كود المنصات، وصلته بنظام التصميم الموحد (DGA)، وما الموجود في السجل اليوم.

الإصدار 0.2.0 ·

كود المنصات هو سجل shadcn لـنظام التصميم الموحد (DGA) (منصات الكود الموحد، Platforms Code). تثبّت المكوّنات عبر سطر أوامر shadcn، فتُنسخ الشيفرة المصدرية إلى مشروعك لتتمكن من تعديلها.

رموز DGA في صفحة خدمة
الاتجاه
السمة
حجم العرض

المبادئ

  • Figma هو المرجع. كل رمز (token) مأخوذ من ملف الأساسيات الخاص بـ DGA في Figma. وعند اختلاف CSS المنشور في الموقع عن Figma، يُعتمد Figma.
  • صحيح افتراضيًا. كل زوج لوني في الأساسيات يحقق WCAG 2.1 AA في الوضعين الفاتح والداكن. وحيث تقصّر قيم DGA عن ذلك، نصحّحها ونسجّل التغيير في صفحة الاختلافات عن DGA.
  • العربية أولًا. تستخدم التخطيطات الخصائص المنطقية فقط (ms-* وpe-* وstart-*)، فيعمل المكوّن الواحد من اليمين إلى اليسار ومن اليسار إلى اليمين.
  • نمط shadcn الحالي. المكوّنات مبنية على Base UI وتستخدم أصنافًا دلالية ثابتة (cn-button وcn-button-variant-*). ويربط النمط dga هذه الأصناف برموز DGA وقت البناء.

ما يتضمنه السجل

dga-styleالرموز (الفاتح والداكن والمتجاوب)، وسمة Tailwind v4، وربط متغيرات shadcn، وخط IBM Plex Sans Arabic.
الأساسياتالألوان والخطوط والمسافات والزوايا والظلال والأيقونات.
المكوّناتButton وLink وBadge وTag وStatus Tag وAvatar وFeatured Icon وSpinner وSkeleton وDivider. النماذج والنوافذ المنبثقة والتنقل تأتي لاحقًا في خارطة الطريق.

الحالة

كود المنصات مشروع مستقل وليس منتجًا رسميًا لـ DGA. يتبع إرشادات DGA العامة وملفات Figma المنشورة، ويسرد كل موضع يختلف فيه عنها.