الانتقال إلى المحتوى
الأقسام
اللغة، حاليًا العربية
نظام تصميم Rastrillo

الأيقونات

12 من الـ slug، مرفقة بصيغة SVG مضمّنة ومترجَمة داخل الملف التنفيذي: بلا خطوة بناء، وبلا أصل ثانٍ، وتعمل من دون شبكة إطلاقًا. يأخذ كلٌّ منها حجمه من النص المجاور بحسب قاعدة .icon في tokens.css نفسها، وهو الحجم الذي تراه هنا. وslug لا يجيب عنه شيء لا يرسم شيئًا، فيكلّفك الخطأ المطبعي أيقونة ناقصة لا صفحة ماتت في منتصف استجابتها.

  • alert-triangle{{icon "alert-triangle"}}lucide.dev/icons/triangle-alert
  • check{{icon "check"}}lucide.dev/icons/check
  • check-circle{{icon "check-circle"}}lucide.dev/icons/circle-check
  • chevron-down{{icon "chevron-down"}}lucide.dev/icons/chevron-down
  • help-circle{{icon "help-circle"}}lucide.dev/icons/circle-help
  • info{{icon "info"}}lucide.dev/icons/info
  • kebab{{icon "kebab"}}lucide.dev/icons/ellipsis-vertical
  • menu{{icon "menu"}}lucide.dev/icons/menu
  • plus{{icon "plus"}}lucide.dev/icons/plus
  • x{{icon "x"}}lucide.dev/icons/x
  • x-circle{{icon "x-circle"}}lucide.dev/icons/circle-x

الأسماء أسماء rastrillo نفسه

يختلف 5 من أصل 12 عن الاسم الذي ينشره lucide.dev، حتى إن مجموعة Lucide نفسها تحمل ترجمةً خاصة بها. وحيثما لا يكرّر السطر الأخير تحت الأيقونة اسمَها، فتلك إحداها. والمكسب أن الاستدعاء الواحد يعني الرسم نفسه أيًّا كانت المجموعة التي يولّدها التطبيق، وأن الأجزاء المرفقة لا تتغيّر أبدًا حين تتغيّر المجموعة.

‏kebab وmenu هما الزوج الجدير بألّا يختلط عليك: kebab هي النقاط الثلاث التي تعني «إجراءات أخرى على هذا الصف»، وmenu هي الخطوط الثلاثة التي تعني التنقّل. وتستخدم الأصداف menu حين تنطوي.

من أين تأتي الرسوم

‏Lucide، مرفقة برخصة ISC ومثبَّتة في الشيفرة لا مجلوبة وقت التشغيل. أما rastrillo new --icons=font-awesome فيولّد Font Awesome Free بدلًا منها: مصدرٌ يمكن للتطبيق أن ينهل منه، لا اعتماديةٌ يحملها إطار العمل هذا. لا شيء هنا يجلبها، وPro منتج مدفوع لا يستطيع rastrillo أن يرفقه نيابةً عنك.

المجموعة كاملةً على lucide.dev (يُفتح في علامة تبويب جديدة).

أيقونة لا يوفّرها إطار العمل

حزمة icons التي يكتبها rastrillo new شيفرةٌ يملكها التطبيق: أضف الرسم هناك واستدعِه كأي رسم آخر. مرّر Icon وAssets الخاصين بها إلى ui.Pages باسم icon وiconAssets، فتقف مجموعتك أمام مجموعة إطار العمل نفسه.

Funcs: template.FuncMap{"icon": icons.Icon, "iconAssets": icons.Assets, "asset": assets.Path},

مرّر كليهما دائمًا. فبتمرير icon وحده يبقى iconAssets على افتراضي إطار العمل، ويتعطّل التسليم عبر cdn أو js دون أي خطأ.