مشكلة بسيطة جدًا: في قائمة المواضيع، يمكن أن يكون مؤشر الرسائل الجديدة في سطر منفصل بمفرده

مثال:

4 إعجابات

تم إصلاح هذا هنا:

3 إعجابات

هل أنت متأكد من ذلك؟ :thinking:

image

2.9.0.beta2

(f9e1ba4f8f)

على Chrome Desktop، ونفس الشيء مع الوضع الآمن.

كود HTML للصف:

<div class="top-row">
    <!-- -->
    <a href="/t/nouveau-champagne-edition-1978/42061" role="heading" aria-level="2" class="title" data-topic-id="42061">Nouveau Champagne Edition 1978</a><!-- --><span> id="ember309" class="topic-post-badges ember-view">
    <!-- -->  &nbsp;<a href="/t/nouveau-champagne-edition-1978/42061" title="nouveau sujet" class="badge badge-notification new-topic">nouveau</a>
</span>
</div>

<a> CSS:

.topic-list-main-link a.title, .topic-list .main-link a.title, .latest-topic-list-item .main-link a.title {
    padding: 15px 0;
    word-break: break-word;
    color: var(--primary);
}

Post badge CSS:

.topic-post-badges {
    white-space: nowrap;
    align-self: center;
    line-height: var(--line-height-medium);
}

أيضًا، سؤال: ما قصة نص “nouveau” (“جديد”) هذا؟ إنه موجود في DOM، ويشغل مساحة، ولكنه لا يملك أي نمط/خاصية مطبقة عليه:

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

أيضًا، مظهر النقطة يختلف أحيانًا قليلاً من سطر موضوع لآخر.

لديهم نفس خصائص CSS بالضبط. الأبعاد المحسوبة لكلا النقطتين هي 5.219 بكسل. لكنها تبدو مختلفة:

في الصورة التي نشرتها في منشوري السابق، تبدو أطول:
image

تتفاوت “استدارتها” اعتمادًا على تكبير المتصفح.
أنا متأكد تمامًا من أن هذه الاختلافات في الاستدارة ناتجة عن قيم العرض والارتفاع النهائية المستديرة (لا أقصد التورية) نظرًا لأنها أرقام عشرية (وحدة أبعادها هي em وليست px). إذا قمت بتعيينها جميعًا على 5 بكسل، تختفي المشكلة. لكنني أتفهم أن أبعادها يفترض أن تكون مرتبطة بحجم الخط أو أي شيء آخر للاتساق البصري.

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

إذا لم أكن مخطئًا، فقد قمت بتحديث ملف CSS للنقطة لحجم ثابت (أو قيمة محسوبة مستديرة). يبدو أفضل بكثير، سواء هنا أو في المنتدى الخاص بي الذي أعدت بناءه هذا الصباح. عمل رائع :+1: