XF 2.3 تثبيت شريط أدوات محرر XenForo أثناء التمرير

[ناصر]

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

اليوم أود أن أشارك مقتطفا بسيطا ولكنه مفيد.

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

باستخدام هذا الرمز، يمكنك إبقاء شريط أدوات المحرر ثابتا في أعلى الصفحة أثناء التمرير، دون الاعتماد على أي إضافات تابعة لجهات خارجية. هذا يعني أنك لم تعد مضطرا إلى التمرير مرة أخرى إلى أعلى المحرر للوصول إلى خيارات التنسيق مثل Bold و Irtalic و Insert Link و Insert Media وأدوات المحرر الأخرى.

المميزات:

• يستخدم موضع CSS: خاصية لزجة.
• يحترم تلقائيا ارتفاع رأس XenForo.
• يستخدم خصائص نمط XenForo (@xf-contentAltBg، @xf-borderColor، وما إلى ذلك)، مما يضمن توافقا سلسا للموضوع.
• يعمل في جميع المتصفحات الحديثة التي تدعم ميزة تحديد المواقع اللاصقة.
• يطبق ظلا خفيا على شريط الأدوات عندما يصبح لزجا لتحسين الفصل البصري.

<xf:comment> /*############################ EDITOR STICKY TOOLBAR ############################*/ </xf:comment>

@_sticky-editorOffset: (@header-navHeight);

.fr-box.fr-basic
{

    .fr-toolbar.fr-top
    {
        background: @xf-contentAltBg;
        border-bottom: @xf-borderSize solid @xf-borderColor;

        @supports (position: sticky) or (position: -webkit-sticky)
        {
            position: -webkit-sticky;
            position: sticky;
            top: @_sticky-editorOffset;
            .m-dropShadow(0, 2px, 4px, 0, 0.05);
        }
    }
}

لتركيب الكود:

• Admin Control Panel → Appearance → Styles → (Your Active Style) → Templates → extra.less
• الصق الرمز أعلاه في قالب extra.less واحفظ تغييراتك.

ملاحظات:

• يشير الرمز إلى ارتفاع التنقل في XenForo (@header-navHeight)، مما يجعله متوافقا مع تخطيط XenForo الافتراضي.
• إذا كان نمطك يستخدم رأسا لاصقا مخصصا أو ارتفاع تنقل مختلف، فيمكنك ضبط قيمة @_sticky-editorOffset لتتناسب مع المظهر الخاص بك.
• هذا الرمز يجعل شريط أدوات المحرر لزجا فقط؛ فهو لا يعدل أو يتداخل مع منطقة محتوى المحرر.

آمل أن تجده مفيدا. إذا كان لديك أي اقتراحات للتحسينات أو واجهت مشكلات في سيناريوهات مختلفة، فلا تتردد في مشاركة ملاحظاتك في التعليقات.

بالتوفيق للجميع


الموضوع منقول من:

Keep the XenForo Editor Toolbar Sticky While Scrolling

Hello everyone, Today I'd like to share a simple yet useful LESS snippet. If you've ever wanted the editor toolbar to remain visible while writing or editing long posts, this small LESS snippet does exactly that. With this code, you can keep...

xenforo.com