عنصر ثيمة الثلج في الشتاء ❄

This theme component adds some animated snow to your forum.

:christmas_tree: Warning: the animations will increase browser CPU usage :santa:

:eye: Demo

:link: Repository

Javascript mode (shared by @cjk77 here):

CSS Mode (adapted from here)

37 إعجابًا

Thanks - now with snow :smiley:

Installation:

Go to: /admin/customize/themes
Choose Compontes - add Install.
Paste in the link: https://github.com/davidtaylorhq/discourse-snow-theme.git
Go back to admin/customize/themes and find your theme.
Click it and you can customize your theme.
Scroll down
Add the new component to your theme.

And your have :snowflake:

10 إعجابات

I’ve got a couple of users using Firefox and Opera where this isn’t working (configured with js-mode), but the codepen example of the code does work. Works fine in Chrome. Any ideas?

ETA: Both users have confirmed that css mode works for them

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

It seems to be a Chrome-only component. On Firefox, with JS-mode, there’s nothing, and with CSS mode there’s a wall of jerky snow flakes that covers the screen, so it’s not really usable.

3 إعجابات

It is now updated so that js-mode works for Firefox. I haven’t tested Opera, but I suspect the same fix will help there as well.

14 إعجابًا

Can confirm it’s now working for both of my users, Firefox and Opera. Thanks for the fix.

5 إعجابات

I use Opera,

looked great but as David noted

image

image
the CPU is too much,

1% without up to 39% with,

Sadly had to go :pensive:

6 إعجابات

is there a way to make this have random fireworks instead of snow?

and my CPU never increased with the snow, used it on desktops and phones, my entire forum loved it, and not one complaint about CPU usage

10 إعجابات

Hi! I love this, it’s adorable and really brings things to life. I’m wondering, however, if it’s possible to make it appear only to the right and left/in the unused space beside the board (or go behind it)? That way it doesn’t snow all over the text and make reading difficult.

4 إعجابات

Seems to work fine with the latest discourse release…

إعجابَين (2)

أحببت مكون السمة هذا كثيرًا، ولكن هل هناك طريقة لتغيير “النقطة” (أو هل يجب أن أقول “النقطة”؟) إلى أيقونة ثلج حقيقية؟

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

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

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

هل تستخدم إصدار CSS أم إصدار JS؟

تم التبديل من JS إلى CSS! ولكن يمكننا تجربة أي منهما، أيهما أسهل. @famousamos.1 للعلم

3 إعجابات

@dennisjbr يتولى الأمر نيابة عني - كان ينبغي أن أسأله أولاً، لكن قائمة مهامي ضخمة. إنه يساعدنا في موقعنا.

3 إعجابات

إصدار CSS أسهل في التغيير، ولكن هذا ليس نفس التأثير. :thinking:

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

#snow {
    animation: snow 60s linear infinite;
}
6 إعجابات

شكرا جزيلا لك

3 إعجابات