إضافات MD Composer

مكون السمة
41

لقد فعلت كما اقترحت وأخفيت الأزرار غير المرغوب فيها بهذا الشكل:

// يخفي الأزرار غير الضرورية من شريط أدوات إضافات MD Composer
.d-editor-button-bar {
    .superscript_button,.subscript_button, .align_center_button,.align_right_button, .align_justify_button {
        display: none;
    }
}

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

لقد حاولت القيام بذلك ولكنه كان يتجاوز مهاراتي المتواضعة؛ لم أتمكن من جعل كل جزء مشروطًا بالإعداد ذي الصلة.

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

مرحباً ستيفن# مكون لطيف جداً ولكنني وجدت خطأ بسيطاً. النص العلوي به خطأ بسيط. انظر أدناه.

Screenshots_2023-01-16-06-18-41
Screenshots_2023-01-16-06-18-41806×703 30.8 KB

الإغلاق باستخدام /sub بدلاً من /sup

إعجابَين (2)
43

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

أي تبديل إذا كنت تستخدم مكون bbcode وكلاهما يمكن أن يكون لديه خيارات لإخفاء الأزرار أو إضافة أزرار إلى الشريط. مع نفس الشيء إذا أراد المسؤولون استبعاد الخيارات في القائمة المنسدلة :gear:.

ما زلت أخضر جدًا في تعلم CSS. ومع ذلك، يمكن على الأرجح إنشاء مكون تكميلي لمزيد من التزيين لتنظيم القائمة المنسدلة مع قائمة منسدلة متتالية..

أي قائمة منسدلة رئيسية للترس مع منتقي خيارات الألوان.

:gear: .
إدراج استطلاع
إدراج جدول
لون النص. > أحمر
أخضر
أزرق
برتقالي

قد يتمكن المرء من تجميع خيارات التنسيق الأخرى في القائمة المنسدلة و/أو شريط الأدوات للحصول على قائمة لاختيار خيار تنسيق.

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

شكرًا، لقد دفعت إصلاحًا لهذه المشكلة.

إعجابَين (2)
45

على الرحب والسعة وشكراً جزيلاً لك على الاستجابة السريعة والإصلاح! :vulcan_salute::smiling_face_with_sunglasses::handshake:

46

أوصي بتحديث منشورك الأصلي (Op Post) ليشمل كيفية استخدام التثبيت الاختياري للفرع (branch install). لقد وجدت بدائل الفرع “color” و “simple”.

في فرع color الخاص بك، أجريت تغييرًا طفيفًا على bbcode_color

في “Desktop\Head” - السطر 65 و “Mobile\Head” - السطر 96

من “[color=##233]” إلى “[color=name]” حيث سأقوم بإنشاء دليل لموقع WiP الخاص بي حول تغيير الاسم إلى اسم اللون.

القيمة السداسية عشرية ليست القيمة التي كانت لديك. فقط ضعها كمرجع لما كانت عليه تقريبًا.

ما زلت مبتدئًا في الأمور وسأحتاج إلى إنشاء حساب github وتعلم كيفية تقديم طلبات السحب (pull requests) في وقت ما.

47

شكراً جزيلاً على هذه المكونات سهلة الاستخدام والغنية بالميزات! نقدر ذلك كثيراً.

واقتراح صغير، هل من الممكن استخدام اصطلاح Markdown لـ ~~هذا~~ لشطب النص بدلاً من اصطلاح <s></s> الأكثر تفصيلاً؟

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

أشارك في هذا الأمر :slight_smile:

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

حتى الآن، قمت بإخفائه عن طريق إضافة body:not(.staff) إلى كود ناثان:

// يخفي الأزرار غير الضرورية من إضافات MD Composer للمستخدمين غير الموظفين
body:not(.staff) .d-editor-button-bar {
    .superscript_button,.subscript_button, .align_center_button,.align_right_button, .align_justify_button {
        display: none;
    }
}

المستوى التالي سيكون إعداد إذن لكل زر فردي. :drooling_face:

إعجابَين (2)
49

@jrgong يمكنك القيام بذلك عن طريق إضافة هذا المكون وبعض CSS

يمكنك الاطلاع على أقسام قائمة تنقل مجموعتي TC كمثال لـ CSS - الرابط في بطاقة المستخدم الخاصة بي.

5 إعجابات
50

كيف لا يوجد هذا في الإصدار الأساسي بعد؟ :smiley: شكراً على المشاركة، أقدر ذلك حقًا.

3 إعجابات
51

هل لا يزال هذا هو الحال بالنسبة لـ Plugin الذي يتمتع بمزايا على مكون السمة هذا؟

52

ما زلت أعتقد أن المكون الإضافي أفضل، ولكن إذا كانت الخيارات المعروضة هنا تناسبك، فلا بأس.

إعجابَين (2)
53

شكرا على الرد السريع. هل يمكنك شرح السبب؟

54

مجرد رأي شخصي، أعتقد أننا أضفنا الكثير من الأزرار في المكون.

يركز المكون الإضافي بشكل أكبر على الوظائف الأساسية، كما أن نظام bbcode أسهل أيضًا ([center] بدلاً من [wrap="center"]) ولكن من الواضح أن المكون أسهل في التثبيت.

4 إعجابات
55

في حال لم تكن قد رأيت هذا:

image

3 إعجابات
56

لقد قدمت طلب سحب :+1:

https://github.com/MonDiscourse/md-composer-extras/pull/12

إعجابَين (2)
57

هل سيكون من الممكن إضافة فئة CSS md-composer-extras إلى جميع الأزرار؟ هدفي هو إخفاءها جميعًا مرة واحدة للمستخدمين غير الموظفين وسيؤدي ذلك إلى تبسيط استهداف CSS بشكل كبير.

58

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

api.onToolbarCreate(toolbar => {
  toolbar.addButton({
    id: 'pop-text',
    group: 'extras',
    icon: 'bolt',
    action: 'makeItPop',
    title: 'pop_format.title'
  });
});
60

يتم تطبيق فئة staff على العنصر <body>.

لذلك، يمكنك استهداف أي أزرار مثل:

body:not(.staff) .d-editor-button-bar {
    /* يخفي كل شيء
     * (الأزرار المرئية، بما في ذلك زر القائمة المنبثقة)
     */
    button,
    .toolbar-popup-menu-options {
        display: none;
    }
}

body:not(.staff) .d-editor-button-bar {
    /* إخفاء أزرار محددة */
    button {
        /* أزرار مضمنة */
        &.align_justify_button,
        &.align_right_button
        /* ... */
        {
            display: none;
        }

        /* قائمة منبثقة */
        &.toolbar-popup-menu-options {
            [data-name="Float left"],
            /* ... */ {
                display: none;
            }
        }
    }
}

هل سيساعد ذلك؟

على صعيد آخر، قد تكون مهتمًا بهذه المكونات:

61

أهلاً Arkshine! هذا يساعد بالتأكيد! ومع ذلك، في رأيي المتواضع، سيكون نهجًا أكثر كفاءة لإضافة فئة CSS md-composer-extras إلى كل زر من الأزرار. بهذه الطريقة، يكون ترميز CSS لإخفاء جميع العناصر بسيطًا للغاية :slight_smile:

شكرًا! نحن نستخدمه بالفعل :wink: