العناوين من المستوى الرابع ينقصها مستوى مسافة بادئة واحد

لقد واجهت مشكلة أثناء استخدام مكون DiscoTOC:
تبدو العناوين من المستوى الرابع في شريط التمرير الأيمن وكأنها تفتقر إلى مستوى واحد من المسافة البادئة مقارنة بالعناوين من المستوى الثالث.

لقد قمت بالفعل بمراجعة النص الأصلي ولم أجد أي أخطاء في بناء الجملة.
image

هل يمكن لأحد أن يشرح السبب المحتمل وراء ذلك؟ بالإضافة إلى ذلك، أتساءل عما إذا كان هناك حل متاح لهذه المشكلة؟

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

أعتقد أنه مقصود عدم تصغير العناوين كثيرًا في جدول المحتويات عندما يكون هناك الكثير من المسافات البادئة.
الطريقة الأسهل لتحقيق مسافة بادئة تدريجية ستكون استهداف إما \u003cli\u003e أو \u003ca\u003e بالداخل (باستخدام فئاتهما لأن لديهما فئات متعلقة بمستوى العنوان الخاص بهما) وإضافة مسافة بادئة لليسار.

شكراً على ردك!

ولكن، ألن يتطلب تطبيق هذا الحل تعديل كود HTML؟ هل يمكنك تقديم إرشادات أكثر تحديداً حول معالجة هذه المشكلة؟

أولاً، لا يمكن طي العناوين من <h3> إلى <h5> في جدول المحتويات. يجب إجراء تغيير على المكون للسماح بهذا السلوك. يتم تجاهل <h6> بواسطة المكون.

ولكن بما أنك تتحدث فقط عن التداخل، فإن هذا SCSS يجب أن يكون كافياً لما تريده:

.d-toc-main #d-toc li.d-toc-item {
    .d-toc-h4 {
        padding-left: 1.25em;
    }
    .d-toc-h5 {        
        padding-left: 2em;
    }
}

إعجابَين (2)

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.