مرحبًا!
أود عرض صور الفئات في قائمة الفئات بنفس الطريقة التي تُعرض بها صور المستخدمين في عرض “المشاهدة الأخيرة” الفئات - ميتا ديسكورش .
تمكنتُ من الحصول على النتيجة التي أريدها إلى حد ما من خلال التجريب في وضع فحص كروم.
هل تعتقد أن هذا ممكن تحقيقه باستخدام CSS أم أنني بحاجة إلى تعديل قوالب HTML؟
الموقع حي على APF - Auberge du Pixel Fringant (apfcommu.ga) إذا أردت رؤيته حيًا.
شكرًا لوقتك
Benjamin_D
(Benjamin Decotte)
3 أغسطس 2021، 6:57م
2
مرحبًا!
أعتقد أن ذلك مرجح جدًا، ويبدو أنك قد وجدت الحل بالفعل من خلال التجربة في متصفح كروم. لذا، إذا كان سؤالك أكثر تحديدًا حول “أين يجب تطبيق تعديلاتي؟”، فستجد مثالًا هنا:
You’re adding category logos that already include descriptions. They force the text-based Discourse descriptions to be rendered out of view - because the category logos are so wide.
[image]
Even when they’re out of view, they will still affect the layout of their sibling elements.
Can you try adding this CSS to your theme under desktop > CSS
.category-list {
.category-description {
display: none;
}
.category-logo.aspect-image {
margin-bottom: 0;
}
}
like so
[image]
والمزيد من الأمثلة هنا: Search results for 'category-list' - Discourse Meta
إعجاب واحد (1)
ليس حقًا، لقد غششت عن طريق نقل بعض عناصر HTML.
في المثال، نجحوا في ذلك عن طريق إزالة أوصاف الفئات وإضافة الأوصاف مباشرة إلى الصور. أفضل تجنب فعل ذلك.
Benjamin_D
(Benjamin Decotte)
3 أغسطس 2021، 8:30م
4
أوه، فهمت الآن، عذراً مني
لذا، وبما أنني لست ماهراً في CSS ولا أعتقد أنه يجب عليك اتباع مسار position: relative، فإنك في حال قررت إعادة ترتيب العناصر عبر HTML، فستجد هذا أكثر فائدة:
وهناك أيضاً: https://github.com/discourse/discourse/blob/main/app/assets/javascripts/discourse/app/templates/navigation/category.hbs
ولكن لإجراء بعض التعديلات على: discourse/app/views/categories/index.html.erb at main · discourse/discourse · GitHub
فستحتاج على الأرجح إلى إضافة (plugin).
إعجاب واحد (1)
أنا أيضًا لست جيدًا جدًا في CSS.
شكرًا على الموارد، سأحاول الاطلاع عليها عندما يتوفر لدي المزيد من الوقت.
من المرجح أن أحتاج إلى اتباع مسار الإضافات..
إعجاب واحد (1)
manuel
(Manuel Kostka)
4 أغسطس 2021، 8:39ص
6
سأستخدم هذا المكون الجديد:
Contribute to discourse/discourse-minimal-category-boxes development by creating an account on GitHub.
سيمنحك هيكلاً نظيفاً لـ CSS، وسيبدو متطابقاً على سطح المكتب والجوال مع استخدام محددات فئات متشابهة جداً.
4 إعجابات