شريط علامات التبويب في Discours للجوال

GitHub repository:

Screenshots


Installation

Follow the instructions in this howto topic:

Customization

See the readme file in the theme’s GitHub repository.

Ideas to improve this theme are very welcome :slightly_smiling_face:


Update 24/12/2018:

You no longer need to overwrite any code in order to customize this theme. It’s now shipped with theme settings that allow customization for each of the 6 tabs with ability to disable any tab. See the readme file for details.

77 إعجابًا

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

هل هناك طريقة للقيام بذلك؟ ربما شيء مثل

body:not(.logged-in) .d-tab-bar-theme {
    display: block
}
إعجاب واحد (1)

مرحبًا بن،

يتوقع كود JavaScript الخاص بالمكون في عدة أماكن وجود مستخدم مسجل الدخول، لذا لن يكون استخدام CSS كافيًا لإظهار الشريط للمستخدمين المجهولين. توصيتي هنا هي أن تقوم بفرع المكون وتعديله ليظهر للمستخدمين المجهولين.

4 إعجابات

كيفية إضافة زر منشور جديد + إلى الشريط؟

مرحبًا بيتر،

يحتوي نواة Discourse على مسار أنيق هو /new-topic، وهدفه تمكين فتح محرر الرسائل عبر رابط URL. لذا، كل ما عليك فعله هو استخدام هذا المسار كرابط URL للعلامة التي ستفتح المحرر.

13 إعجابًا

هذا المكوّن مفيد جدًا، ويحبه مستخدمو المنتدى حقًا.

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

هل يسمح واجهة برمجة تطبيقات جافا سكريبت الخاصة بـ Discourse لنا بفعل ذلك؟

7 إعجابات

مرحبًا نيلدارار،

يسعدني أن مجتمعك يستمتع بهذا المكوّن ويجده مفيدًا، شكرًا لك! أنا مؤيد لإضافة هذه الميزة إلى المكوّن، لكنني لا أستطيع تنفيذها حاليًا (ربما بعد بضعة أشهر). ومع ذلك، إذا أراد شخص آخر العمل على هذه الميزة في هذه الأثناء، فسأكون سعيدًا تمامًا بدمج طلب سحب (pull request) يتضمن هذه الميزة.

نعم، البيانات المطلوبة معروضة في كائن currentUser ويمكن الوصول إليها بسهولة. معظم العمل المطلوب لهذه الميزة هو 1) تحديد التبويب (أو التبويبات) التي سيتم عرض الشارات عليها، و2) تحديد موقع الشارات بشكل صحيح باستخدام CSS.

8 إعجابات

شكرًا لك @Osama
بناءً على توجيهاتك، وجدت هذه الكائنات.

<script type="text/discourse-plugin" version="0.8">
    let currentUser = api.getCurrentUser();
    console.log(currentUser);
</script>

// unread_high_priority_notifications: 2
// unread_notifications: 7
// unread_private_messages: 2

هل توجد طريقة لتسجيل دالة في حدث، أم يجب أن نكتشف ذلك من خلال الحيلة التالية؟

$('.header-dropdown-toggle current-user').bind('DOMSubtreeModified', function(){
  console.log('changed');
});
5 إعجابات

نعم، هذه هي الخصائص الصحيحة التي نحتاج إلى استهلاكها، ولكن نظرًا لأن Discourse هو تطبيق Ember، فإننا عادةً لا نرصد أحداث DOM لتحديث واجهة المستخدم. بدلاً من ذلك، يجب أن نستخدم ما يسميه Ember بـ ‘الخصائص المحسوبة’.

يُعرّف المكون بالفعل خاصية محسوبة هنا، لذا يمكنك استخدامها كمثال. بمجرد تعريف الخاصية المحسوبة التي تحدد ما إذا كان يجب عرض شارة الإشعارات أم لا (بناءً على خصائص مثل currentUser.unread_high_priority_notifications وما إلى ذلك)، ستحتاج إلى استخدام هذه الخاصية المحسوبة في قالب Handlebars في نفس الرابط في الأسفل.

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

8 إعجابات

شكرًا لك، دعني أجرب :wink::+1:

6 إعجابات

شريط التبويب يظهر بخلفية بيضاء حتى في الوضع الداكن. لقد قمت بالتحديث من النسخة التجريبية 2.7.0 بيتا 1 إلى النسخة التجريبية 2.7.0 بيتا 3، وبعد ذلك بدأ ظهور الخلفية البيضاء. قبل ذلك، كان كل شيء يعمل بشكل ممتاز. حاولت أيضًا إزالة جميع مكونات السمة الأخرى وإزالة جميع التخصيصات للتأكد من عدم وجود أي شيء يتسبب في هذه المشكلة مع شريط التبويب. ولكن حتى في نسخة Discourse الأساسية، يظهر شريط التبويب بخلفية بيضاء في الوضع الداكن. هل يمكن لأحد النظر في هذا الأمر من فضلك؟

5 إعجابات

لقد دفعتُ إصلاحًا لهذه المشكلة. شكرًا لإخباري!

9 إعجابات

يبدو أن هذا التبويب يتسبب في تغطية شريط تقدم الموضوع لزر الرد في بعض الحالات (على سبيل المثال، يمكنني تكرار هذه المشكلة باستخدام Chrome لمحاكاة iPhone SE)

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

4 إعجابات

لدي مشكلة مماثلة. زر “جدول المحتويات” لا يظهر عند تفعيل شريط التنقل الجوال. سيكون من الرائع ألا نضطر للاختيار بين الميزتين لأننا نحب كليهما!

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

@haroldfy لا أستطيع إعادة إنتاج هذه المشكلة هنا في Meta أو منشئ السمات. ربما لديك سمات أو تخصيصات أخرى تتداخل؟ يمكنني إلقاء نظرة إذا كان موقعك عامًا.

@littleviolette أحاول تجنب إضافة كود يستهدف عناصر مكون آخر قدر الإمكان. في هذه الحالة، يمكنك إنشاء مكون منفصل يحتوي على هذا CSS لدفع زر ToC فوق الشريط:

html:not(.anon) .d-toc-toggle {
  margin-bottom: 55px;
}
8 إعجابات

شكرًا لك على متابعتك لهذا الأمر. الموقع خاص، وسأحاول تعطيل التخصيصات الأخرى والتصحيح من هناك.

4 إعجابات

أعتقد أنني اكتشفت خطأً، ولا يمكنني إنتاجه إلا في إصدار PWA من موقعي على iOS (يبدو أنه يعمل بشكل جيد على Android وعلى Safari في iOS).

من المفترض أن يكون شريط التبويب مقفلاً دائمًا، أليس كذلك؟ هذا هو شكله عندما يكون صحيحًا:

ثم أقوم بإلغاء قفل شاشتي، وأنتقل إلى وضع الأفقي، ثم أعود إلى الوضع العمودي، ثم أتمرّر قليلاً للأعلى، وعندها يحدث هذا:

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

واجهتُ نفس المشكلة @haroldfy @littleviolette. يمكنك إصلاحها باستخدام:

html:not(.anon) #topic-progress-wrapper.docked{
margin-bottom:0!important;
}
7 إعجابات

شريط التبويب يتعارض أيضًا مع ميزة تصفية المنشورات الأساسية التي تضع تذييلًا ثابتًا (posts-filtered-notice) عند التصفية.

على أي حال، شكرًا لك على هذا الإصدار الرائع من TC :slight_smile:

5 إعجابات

مكون سمة رائع، شكرًا لك

لديّ طلب وأود التحقق مما إذا كان هناك اهتمام بميزة ‘التمرير للإخفاء’؟

بشكل أساسي، يختفي الشريط السفلي تلقائيًا عندما يقوم المستخدم بالتمرير لأسفل، ثم يظهر مرة أخرى عندما يتمرر للأعلى

مثال وجدته هنا

ستوفر هذه الميزة بحكمة مساحة شاشة ثمينة على الأجهزة المحمولة، وتجربة استهلاك المحتوى أفضل مع مساحة أكبر

9 إعجابات