فقاعات الرسائل الشخصية

:exclamation: تمت إضافة وظيفة هذا المكون إلى نواة Discourse بدءًا من الإصدار 2.8.0 هنا. لن تحقق أي فائدة إذا استمررت في استخدامه بعد الترقية إلى إصدار أحدث!

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

الإعدادات:

  • تعيين لون خلفية الفقاعة إلى الألوان الأساسية أو الثانوية أو الثالثية لسمتك، أو اختيار من بين مجموعة من الألوان الشائعة الأخرى.
  • اختيار ألوان مختلفة للمساعدة في تمييز الرسائل التي ترسلها عن الرسائل المرسلة إليك.
  • تعيين شفافية خلفية الفقاعة - كلما زادت النسبة المئوية، أصبح اللون أعمق.
  • اختيار ما إذا كان سيتم عرض فقاعة الرسالة مع ظل للصندوق.
  • إضافة نص اختياري إلى زر رد الرسالة لتمييزه عن زر رد الموضوع.

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

تثبيت هذا المكون السمة

70 إعجابًا

This is soooooo cool, @Rhidian!!!

I’m curious about something because I’ve never messed with plugins before…

Is it possible to allow a hex code with opacity, instead of just allowing system colors? No problem if that’s a bunch of extra work. Just curious.

What if I wanted to change the styling? of the shadow or other CSS. I’m not super savvy with Github and how all of that works, but I looked in your .git repository before copying it into my theme components. I do know how to write CSS. Can I make a copy of your plugin and then tweak the CSS file that you have and then upload this a new theme component with the styling that I want?

If you could point me to any instruction on how to modify a plugin that would be awesome. Or, I suppose I could just do a CSS override, on the front end. Is one option better than the other in terms of performance?

Again… Thank you so much for this… it’s just the solution I was looking for to differentiate DM’s from regular topics!

4 إعجابات

Thank you @jord8on . It’s great to get feedback like this.

I’ll make Drop shadow customisable as a setting option.

Regarding creating/editing you own CSS it’s easy. Load the component then click the Custom CSS/HTML section on the component settings.

Simplly edit the CSS sheet and click save. These are your own customisations. If you want to share them and incorporate them into the component for everyone to benefit you can simply post up the CSS to this topic in discourse meta - or as a longer term objective learn how to do pull requests in Github and/or fork the repository if you are making making more substantial changes.

3 إعجابات

Thank you @Rhidian!!!

:gift:

This is such a simple solution to make DM’s significantly distinguished from the standard topics on our forum.

I just asked a member what they thought of it and they were soooo happy to have it. They complimented the idea and the execution, so I’m just passing that along to you!!

6 إعجابات

I have updated this theme component so you can now enter your own colors using either

  • html color names ( black, white, maroon, red, purple, green, lime, olive, yellow, navy, blue, teal, aqua)
  • html color codes (#000000 black, #FFFFFF white etc. or short codes e.g. #CCC)
  • theme color names (primary, secondary, tertiary)

You can also enter your own message text colors in the same way to contrast with the bubble color.

The opacity setting allows you to blend the bubble color with the background, so that the color will change with your theme color settings - e.g. for Light and Dark themes.

This update is backwards compatible. To access this feature use the Check for Updates button on your theme settings.

9 إعجابات

Fantastic work on this @Rhidian! clapping

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

تعطلت الحدود باستخدام CSS مخصص، وقمت بإجراء تغيير طفيف في اللون فقط، وهو ما يبدو جميلاً. سيكون رائعًا لو كان هناك خيار لتعديل الحدود أو مجرد مفتاح تشغيل/إيقاف.

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

مرحبًا @ggurbet، هل يمكنك من فضلك نشر لقطة شاشة ومشاركة CSS التي قمت بتغييرها؟

@Rhidian، كانت الحدود مشتتة جدًا لذا قمت بإزالتها. تجاهل ألواني :slight_smile:

لقطة شاشة للنمط الفاتح:

لقطة شاشة للنمط الداكن:

لقد أضفت هذا إلى Common > CSS:

// مكون فقاعة الرسالة الخاصة - بدون حدود
.archetype-private_message .topic-body .contents {
    border: none !important;
}
3 إعجابات

أعجبني هذا!

طلب

  • هل يمكن أيضًا جعل اللون الرباعي متاحًا؟
  • لاحظت خطأ إملائيًا في التعليمات. كلمة Tertiary مكتوبة بشكل خاطئ teriary

Screenshot of Google Chrome (3-8-21, 10-19-25 AM)

إعجابَين (2)

رائع جداً. يعجبني :grin:

لقد أضفت خيار إزالة الحدود، وخيار الرباعي، وأصلحت تهجئة الثلاثي.

شكرًا لك @ggurbet @debryc

Shaun The Sheep Movie Ok GIF

7 إعجابات

كان ذلك سريعًا، شكرًا لك!

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

أيضًا، اقتراح صغير: تسمح بإضافة نص في نهاية زر الرد، ولكن في بعض اللغات (مثل التركية)، يُفضل إضافة النص في البداية لأن الفعل يأتي في نهاية الجمل فيها.

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

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

لا، ليس كذلك. فبعض التعديلات البسيطة على CSS تكفي.

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

يبدو لي هذا مشكلة. أنا أفضل الاحتفاظ بالقدرة على تعديل السمات في مكانها. فهذا بالتأكيد يساعد في تطوير السمات والمكونات.

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

لدي مكوّن محلي يُسمّى “الموضوع الفرعي المشترك” أقوم فيه بإجراء تعديلات للمكوّنات الأخرى. أستهدف فئات وعناصر المكوّنات الأخرى ضمن هذا الموضوع الفرعي. طالما لم يقم مؤلف المكوّن بتغيير أسماء الفئات أو المعرفات (IDs) وما إلى ذلك، فإنني بخير ويعمل هذا بنجاح. في الوقت الحالي، وبما أنك قد أدرجت إزالة الحدود أيضًا، فلا أحتاج إلى أي تعديلات في موضوعي الفرعي لمكوّن فقاعات الرسائل الشخصية، بالمناسبة.

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

مرحبًا وشكرًا على هذا المكوّن الرائع للموضوع. :trophy:

خطأ محتمل: يبدو أن خيار “النص المضاف” يتضمن مسافة قبل السلسلة في أسفل موضوع الرسالة، لكنه لا يتضمنها في نافذة المحرر. انظر أدناه:

إعجابَين (2)

@Rhidian، هل يمكنك أيضًا إضافة خيار لإضافة نص قبل زر الرد؟ في بعض اللغات (مثل التركية)، سيكون من المنطقي إضافة بعض النص في بداية الفعل.

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

مكون رائع! هل لدينا شيء مشابه للمشاركات الفعلية في المواضيع؟ أقصد مكونًا يجعل المشاركات تبدو مثل فقاعات الرسائل!

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

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