 |
ملخص | يتيح Discourse FontAwesome Pro استخدام أيقونات Font Awesome Pro في Discourse من خلال استخدام رمز حزمة NPM الخاصة بحسابك مع رخصة FontAwesome. |
 |
رابط المستودع | https://github.com/discourse/discourse-fontawesome-pro |
 |
دليل التثبيت | كيفية تثبيت الإضافات في Discourse |
الإعداد
يتطلب هذا بعض الخطوات الإضافية للتفعيل من إضافة عادية:
أولاً، ستحتاج إلى إعداد متغير بيئة إضافي يحتوي على رمز حزمة font awesome pro الخاصة بك (لاحظ أن هذا يختلف عن رمز API الخاص بك): DISCOURSE_FONTAWESOME_AUTH_TOKEN
يحتاج سكربت التثبيت أيضًا إلى الاستدعاء أثناء التهيئة، كخطاف “after_code” إضافي. يقوم هذا بتنزيل وإضافة ملفات SVG الخاصة بـ FontAwesome Pro أثناء البناء باستخدام رمز المصادقة الخاص بك. هذا كتلة إضافية منفصلة عن كتلة استنساخ الإضافة.
إليك مثال على التثبيت في app.yml:
env:
DISCOURSE_FONTAWESOME_AUTH_TOKEN: 123456
hooks:
after_code:
- exec:
cd: $home/plugins
cmd:
- git clone https://github.com/discourse/discourse-fontawesome-pro.git
- exec:
cd: $home/plugins/discourse-fontawesome-pro
raise_on_fail: false
cmd:
- $home/plugins/discourse-fontawesome-pro/scripts/install.sh
اختيار عائلة بديلة:
في إعدادات الإدارة، يمكنك تجاوز عائلة أيقونات Discourse الافتراضية:
اختيار نمط بديل:
يمكنك أيضًا تجاوز نمط الأيقونة الافتراضي:
ثنائي اللون (Duotone)
للحصول على تحكم كامل في دعم ثنائي اللون، ستحتاج إلى تجاوز CSS التالي (في موضوع أو بطريقة أخرى) واستبداله بمخطط ألوانك الخاص:
svg {
--fa-secondary-color: red;
--fa-secondary-opacity: 0.6;
}
لتلوين أيقونات فردية، اذكر معرف SVG الخاص بها:
#fad-search .fa-secondary {
--fa-secondary-color: red;
--fa-secondary-opacity: 0.6;
}
تحديث تنسيق ثنائي اللون
إذا كنت تستخدم محددات مبنية على الفئات مثل:.fa-secondary { color: red; }ستحتاج إلى تحديث تنسيقاتك لاستخدام خصائص CSS المخصصة (CSS custom properties) بدلاً من ذلك. لم تعد تجاوزات الألوان المبنية على الفئات تعمل لأنها تم إسقاطها في Font Awesome v7
تحت الغطاء، يستخدم هذا مستودع FontAwesome لتثبيت الخطوط في مجلد SVG الخاص بالإضافة، ويترك Discourse يلتقط الرموز من هناك.