قائمة مواضيع ديسكورس: المؤلفون والناشرون

:information_source: الملخص يضيف مؤلف الموضوع إلى العمود الأيسر في صفحات قوائم المواضيع، بالإضافة إلى خيار لعرض آخر ناشر فقط في عمود الناشرين الافتراضي. يمكن أيضًا تحديد حجم وشكل صورة مؤلف الموضوع.
:eyeglasses: معاينة https://discourse.theme-creator.io/theme/Lilly/discourse-topic-list-author-posters
:hammer_and_wrench: المستودع https://github.com/Lillinator/discourse-topic-list-author-posters
:question: دليل التثبيت كيفية تثبيت سمة أو مكون سمة

تثبيت هذا المكون من السمات

:woman_technologist:t2: نظرة عامة

يضيف هذا المكون من سمات Discourse صورة مؤلف الموضوع إلى العمود الأول في جميع مسارات قوائم المواضيع، ويحتوي على إعدادات تسمح للمسؤول بتحديد شكل وحجم الصورة. كما لن تظهر صورة مؤلف الموضوع كأول صورة في قائمة الناشرين.

هناك أيضًا إعداد لعرض عمود صور الناشرين ليظهر فقط آخر ناشر (الأحدث)، ولكن فقط إذا كان هناك أكثر من مشارك واحد في الموضوع. وبالتالي، ستظهر صورة المؤلف فقط إذا كان هناك ناشر آخرون في الموضوع.

بالإضافة إلى ذلك، يمكن للمسؤولين اختيار عرض مؤلف الموضوع في صفحة التصنيف عندما تكون عروض قائمة المواضيع الأخيرة مفعلة (أي: «التصنيفات مع أحدث المواضيع»)؛ كما تتوفر خيارات لحجم وشكل الصورة.

هناك أيضًا خيار لتغيير محاذاة محتوى الصفوف عموديًا إلى الأعلى أو المنتصف.

في عرض الشاشة الصغيرة (حجم الهاتف المحمول)، سيظهر المؤلف حيث تظهر صورة الناشر الأخير.

يعمل هذا المكون بشكل جيد مع ملخصات قائمة المواضيع وملخصات الذكاء الاصطناعي في Discourse.

:gear: الإعدادات

لقطة شاشة للإعدادات مع الخيارات الافتراضية في صفحة إدارة المكون

الإعدادات الوصف
Topic list author avatar size حجم الصور في عمود صورة مؤلف الموضوع في مسارات صفحة قائمة المواضيع - small، medium، أو large.
Topic list author avatar border radius تقريب حواف الصورة في مسارات صفحة قائمة المواضيع: 0% = مربع → 50% = دائرة. tab_style = حواف يسرى مستديرة
Topic list show last poster only عرض صورة الناشر الأخير فقط في عمود الناشرين، ولكن فقط إذا كان هناك أكثر من مشارك واحد في الموضوع.
Vertically align row top خيار لمحاذاة الصفوف إلى الأعلى أو المنتصف
Show author on categories page عرض صورة المؤلف بدلاً من الناشر الأخير في قوائم المواضيع في صفحة التصنيف.
Category page topic avatar size حجم الصور في عمود صورة مؤلف الموضوع في قوائم المواضيع بصفحة التصنيف - small، medium، أو large.
Category page avatar border radius تقريب حواف الصورة في صفحة التصنيف: 0% = مربع → 50% = دائرة. tab_style = حواف يسرى مستديرة

:camera_flash: لقطات الشاشة

إليك بعض لقطات الشاشة مع إعدادات مختلفة لحجم وشكل الصورة، مع إظهار ملخصات الذكاء الاصطناعي الموسعة أيضًا.

لقطات شاشة لصفحات مختلفة من قوائم المواضيع مع تفعيل إعدادات المكون المختلفة، مما يعرض كلًا من وضعي الملخصات المضغوطة والموسعة، والشريط الجانبي الموسع/المغلق

مع الإعدادات الافتراضية:

شكل صورة tab_style كبير مع توسيع ملخصات الذكاء الاصطناعي:

صور صغيرة مع شكل نصف قطر حدود 15% وتفعيل Topic_list_show_last_poster_only:

صور متوسطة الحجم مع نصف قطر حدود 0% (مربع) وتفعيل Topic_list_show_last_poster_only، مع توسيع ملخصات الذكاء الاصطناعي:

لقطات شاشة لصفحة التصنيف تعرض حدين مختلفين للحجم والشكل للصورة مع المؤلف أو الناشر الأخير.

الإعدادات الافتراضية للمكون، مع صور دائرية متوسطة الحجم وتفعيل Show_author_on_categories_page:

صور كبيرة الحجم بنمط tab_style وتعطيل Show_author_on_categories_page:

لقطة شاشة للعرض بحجم الهاتف المحمول

مع صور المؤلف بنمط tab_style:


:backhand_index_pointing_right:t3: ملاحظات

  • يضيف صورة المؤلف ويغير عمود الناشرين حيث هو متوقع في علامات التبويب في صفحة الملف الشخصي.
  • سلوك الهاتف المحمول مطابق للسلوك الافتراضي في قوائم تذييل الموضوع (المقترحة/ذات الصلة) وفي صفحات علامات التبويب للملف الشخصي والبريد الوارد.
  • غير متوافق تمامًا مع سمة Horizon. :slight_smile:

:bulb: مهام مستقبلية محتملة

  • إضافة خيار تعطيل للهاتف المحمول؟
  • استثناءات التصنيفات والوسوم؟
  • دعم الاتجاه من اليسار إلى اليمين؟
  • تشكيل صور الناشرين؟

:hugs: كما هو معتاد، شكرًا جزيلاً لـ @Moin على الفكرة، والتغذية الراجعة، ومساعدة تصحيح الأخطاء.


اطلع على أعمالي الأخرى في Discourse
13 إعجابًا

شكرًا لك على صنع هذا، لقد حل مشكلة محتملة بالنسبة لي على الفور!

ربما تم التخطيط لهذا بالفعل، أردت أن أذكر أنني لاحظت أن الحشو والمحاذاة لعمود صورة الملف الشخصي للمُرسِل على اليسار به مسافة بادئة غريبة (غير موجودة على الهاتف المحمول عند تعطيل المكون، للمقارنة). يبدو أن السمة text-align الخاصة بـ td.posters تؤثر على الصورة أيضًا.
كما يتغير محاذاة قائمة صور الملف الشخصي للمُرسِلين عند تمكينها، ويبدو أن محاذاة td.topic-list-data تتجاوز الإعداد الافتراضي. من السهل إجراء تغييرات على نمط أوراق الأنماط من جهتي إذا كنت راضيًا عن هذه الأمور بخلاف ذلك.
مكون رائع، شكرًا لك مرة أخرى.

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

شكراً على التقرير، لقد دفعت للتو إصلاحاً. قم بتحديث المكون وأخبرني إذا كان ذلك يساعد.

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

محاذاة الصورة الرمزية إلى اليسار أفضل على سطح المكتب. أضفت هذا الـ CSS لضبط عمود الملصق الأوسط حسب تفضيلاتي:

td.posters.topic-list-data {
    vertical-align: middle !important;
}

أعتقد أن تعطيل الهاتف المحمول المستقبلي سيساعد أيضًا، لأن التصميم يستخدم مساحة بيضاء أكثر من اللازم.

المحاذاة العمودية العلوية مقصودة لتكون متسقة مع بقية بطاقة الموضوع ولن يتم تغييرها.
لم أقم بإجراء أي تغييرات على الهاتف المحمول ولكني سألقي نظرة.

قد يكون المحاذاة الرأسية قد تم تطبيقها على نطاق واسع جدًا في ملف CSS الخاص بك، ومن المحتمل أنها تحتاج فقط إلى استهداف custom-author-column حيث تستخدم td.topic-list-data. أظن أن تغيير الهدف إلى td.custom-author-column.topic-list-data سيحل المشكلة ويزيل الحاجة إلى تصميم مخصص للإصلاح من جهتي.

لا، لقد قصدت أن يكون عمود الملصقات (posters) محاذيًا رأسيًا إلى الأعلى مع جميع عناصر الصف الأخرى. يبدو غير مكانه عند محاذاته للوسط (خاصة إذا قمت بتمكين المقتطفات أو الملخصات الذكية)، ولكن أفترض أنه مسألة ذوق، لذا يمكنك التعديل كما تفضل.

لقد دفعت تغييرًا صغيرًا للجوال.

3 إعجابات

بما أن منتدى لا يستخدم مقتطفات أو مقتطفات برمجية (gists) أو ملخصات الذكاء الاصطناعي، فإن المظهر الافتراضي لـ Discourse هو المفضل. يبدو لي أن هذا التغيير منطقي أكثر في مكون سمة مخصص، لكننا نختلف، وقد أصلحته من جهتي، فلا ضغينة.

المظهر على الهاتف المحمول أفضل قليلاً، شكراً!

@jordanjay29 بعد التفكير في هذا الأمر أكثر، قررت إضافة تبديل للمحاذاة (كان الأمر سهلاً بما فيه الكفاية).

تفضل :slight_smile:

يوجد إعداد جديد محاذاة الصف عمودياً للأعلى يمكنك تعطيله للحصول على الوضع الافتراضي في المنتصف. أخبرني إذا كان هذا يعمل معك.


4 إعجابات