كيفية إخفاء العلامات بعد N وإظهار "+X المزيد" مثل الفئات

مرحباً بالجميع،

أنا أعمل مع مواضيع تحصل أحيانًا على الكثير من العلامات (العديد منها تم إنشاؤه آليًا من موجز ICS). في واجهة Discourse، تستمر العلامات في الالتفاف، مما يجعل قوائم المواضيع طويلة جدًا ويصعب مسحها ضوئيًا.

أود أن أفعل شيئًا مشابهًا لكيفية عرض الفئات في قوائم المواضيع:

  • عرض القليل الأول (لنقل 5)
  • ثم طي الباقي خلف مؤشر “+X المزيد”

ما جربته:

  • يمكن لـ CSS إخفاء العلامات بعد عدد معين، وحتى إضافة علامة “…” ثابتة، على سبيل المثال:
/* إخفاء جميع العلامات بعد الخامسة */
.topic-list .discourse-tags a:nth-of-type(n+6) {
  display: none;
}

/* إضافة ... بعد الخامسة */
.topic-list .discourse-tags a:nth-of-type(5)::after {
  content: " …";
}

هذا يعمل للإخفاء، ولكن لا يمكن لـ CSS حساب عدد العلامات المخفية ديناميكيًا، لذلك لا يمكنني الحصول على “+3 المزيد”.

سؤالي:

  • هل هناك طريقة مدمجة لتحديد عدد العلامات المعروضة لكل موضوع؟
  • إذا لم يكن الأمر كذلك، فهل هناك مقتطف مثال (ربما من عرض الفئات) يمكنني تكييفه في مكون سمة لإضافة منطق “+X المزيد” للعلامات؟

شكراً مقدماً!

إعجاب واحد (1)

هل تمكنت من حل هذا؟ إنه غير مدعوم في منصة Discourse الأساسية على الرغم من أنه يمكنك على الأرجح القيام بذلك باستخدام مكون سمة.

هناك إعداد افتراضي max tags per topic والذي يبلغ افتراضياً 20، وأعتقد أنه إعداد معقول ولا يؤدي إلى الكثير من التفاف النص. أفترض أنه من النادر أن ترغب في هذا العدد الكبير من العلامات على أي حال.

:eyes:
20؟

نعم، أنت على حق! لقد قمت بزيادتها إلى 20 على موقعي. الافتراضي هو 5 وهو أمر طبيعي تمامًا.

عينك الصقرية لا تتوقف عن إبهاري.

إعجاب واحد (1)

نعم، يحتوي برنامج الاستيراد النصي الخاص بي بالفعل على إنشاء علامات معرف فريد مختصر معطلاً، حيث إنه ينشئ علامة معرف فريد مخفية بتنسيق HTML.

تم إغلاق هذا الموضوع تلقائيًا بعد 14 يومًا من آخر رد. لم يعد يُسمح بالردود الجديدة.