مكون تبديل السمة

[deprecated]

مرحبًا بمجتمع Discourse،

بعد العديد من الطلبات، أشارككم مكون تبديل السمة (Theme Switcher)، المستمد من سمة Alien Night.
حاليًا، عند الضغط على الزر، سيتم التبديل إلى سمة الوضع الليلي.

في المستقبل، ربما يمكنني تنفيذ صفحة إعدادات تتيح لك تحديد فئة CSS عالمية مخصصة تريد أن تتحول إليها سمتك.
أو ببساطة التبديل بين أول سمتين سمحت للمستخدمين باختيارهما…

التثبيت والتنزيل

https://github.com/B-iggy/discourse-theme-switcher

المعاينة

إذا كان لديك أي ملاحظات أو أسئلة، فلا تتردد في إخباري :slight_smile:

23 إعجابًا

You can let admins select which themes they want to use. We have two different themes and each theme has it own dark mode.

When we click the switch to change light to dark, this component below should have change the logo’s color to light as the opposite. Now it doesn’t work with this switch.

https://meta.discourse.org/t/alternative-logo-for-dark-themes/88502

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

Ok, I’m not advanced in Discourse modding but I try to implement it.
Help from professional guys are appreciated :smirk: @Johani

Hmm, good point. Not sure how I can make a cross-component-compatibility-mode.
I’ll think about it.
Thanks for the first feedback so far!

3 إعجابات

Defining the themes in the settings is possible, but will complicate things. The hamburger menu theme selector is a good working example of how you’d change the theme based on ID.

https://github.com/discourse/discourse-hamburger-theme-selector/blob/master/common/header.html

5 إعجابات

I had some time tonight, so I worked on modifying the hamburger theme selector to toggle between two themes: Header Theme Toggle. Thanks so much for inspiring this with your theme @B-iggy!

11 إعجابًا

Good Morning @awesomerobot ,
oh wow, that was quick :smile:
Much better than I could have done anyways.

I think this topic here is obsolete/redundant then :thinking:

5 إعجابات

Not necessarily, there are some benefits of switching the CSS rather than switching the entire theme. Everything’s self contained and you don’t need to fully refresh for all the changes to take effect.

7 إعجابات

Your component might be better with some improvements. I hope you continue to develop :handshake:

إعجابَين (2)

Awesome plugin! How can i force it to be in the first place (next to the search bar)?

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

Good Morning @szergely
glad to hear you like it :slight_smile:

Instead of changing the code on your end I think it makes sense to have it next to the search icon per default.
So I pushed this change now. Let me know if it’s fine :slight_smile:

3 إعجابات

Yes now its there! Thank you for the fast support, i really like this light/dark button! :heart_eyes:

3 إعجابات

Unfortunately I can’t edit my own post at the top :roll_eyes:

Hence the important notice that the preview link got updated:

I pushed a new version and the regular “Update to Latest” was broken, so I reinstalled it :roll_eyes:

إعجابَين (2)

Made it wiki, you should be able to update it now :hugs:

5 إعجابات

عند استخدام الوضع الداكن مع سمة سام البسيطة، يبدو الأمر هكذا:

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

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

إعجابَين (2)

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

هل يمكنني استخدام هذا أيضًا لموضوع Material Design؟

هل توجد طريقة لنقل الإضافة من الرأس إلى لوحة المستخدم المنسدلة؟

لا توجد طريقة تافهة؛ ستحتاج إلى مكون جديد.

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