Weihnachtsdekorationselement 🎄

Themenkomponente
1

Adding a bit of festive flair to your forum – I present a Christmas decoration component! :christmas_tree:

Screenshot 2020-12-21 at 11.48.08 PM
Screenshot 2020-12-21 at 11.48.08 PM3814×1334 365 KB

This component includes three flairs:

  1. Christmas Lights
  2. Christmas Hats
  3. Christmas Decoration Image

Each flair can be individually enabled/disabled via theme settings. For Christmas Decoration Image there is also a setting to invert color for forum with Dark theme.

Screenshot 2020-12-21 at 11.46.41 PM
Screenshot 2020-12-21 at 11.46.41 PM3810×1044 256 KB

The Christmas lights were inspired from @Canapin’s ideas here.

Merry Christmas! :santa:
:sunglasses: Preview Preview on theme creator
:link: Github Repo discourse-christmas-decorations
:hammer_and_wrench: Install Guide How to install a theme or theme component
47 „GefĂ€llt mir“
2

Very nice! One small thing - it doesn’t seem like the ‘enable decoration image’ is making any difference. I think it might need an if statement in the SCSS?

9 „GefĂ€llt mir“
3

Thanks for bringing this in my notice! I’ve pushed a fix now. :slight_smile:

7 „GefĂ€llt mir“
4

This is great, thanks. Much easier as a theme component than a theme.

The hats worked immediately but I had to fiddle around to get the lights to work - e.g. ticked the enable/disable boxes (though not sure that is what made it work) and restarted the iOS Hub app - but I guess that’s realistic for lights :slight_smile:

3 „GefĂ€llt mir“
5

Glad you liked it! :slight_smile:

That is weird. I just checked installing the component (again) on theme-creator and it worked on first try. Let me know if the issue persists.

2 „GefĂ€llt mir“
6

It’s all working now. Maybe it was something to do with caching - the avatars being updated sooner than the menu bar. “Caching” is a good catch-all excuse as I don’t understand it.

2 „GefĂ€llt mir“
7

Hmm, perhaps mods could enable this component here on meta to make sure it is working


1 „GefĂ€llt mir“
12

In my discourse, hat and light works fine, however the decoration image doesn’t shows. I have no idea why this will happen.

1 „GefĂ€llt mir“
13

If it helps, the decoration only shows up on desktop, on the top left and top right.

1 „GefĂ€llt mir“
14

Yes I know but there is nothing when I view in desktop.

1 „GefĂ€llt mir“
15

The decoration image shows up when the minimum screen width is 1450px. Are you viewing the site on a small monitor or a laptop?

1 „GefĂ€llt mir“
16

oh. I try that on my 2k display monitor so that works. Now I’m using my Lenovo Yoga Duet(kind of like Microsoft Surface) so that disappear. However is that possible to display it on small monitor or a laptop?

1 „GefĂ€llt mir“
17

It will be a shame that laptop user can’t see the bell
I love that. That stands for Christmas.

1 „GefĂ€llt mir“
18

You can fork the theme and tweak screen width settings.

1 „GefĂ€llt mir“
19

Cool! I will try that! Thanks for your help!

1 „GefĂ€llt mir“
20

If anyone have other components that shows up before the decorations, you could try to add this CSS to force lights to be first:


#main-container > * {
  display: flex;
  flex-direction: column;
  width: 100%;
}

#main-container .lightrope {
  order: -1;
}

(this might break other integrations, so test thoroughly )

4 „GefĂ€llt mir“
21

Can I change the colors of the lights?

2 „GefĂ€llt mir“
22

Hat not showing in posts.

2 „GefĂ€llt mir“
23

@meghna This is fantastic!

“Christmas Decoration Image” didn’t work for me.

Is there a way to change the light colors? I’m playing with the CSS, but not having any luck.

1 „GefĂ€llt mir“
24

Looks like it will add a 2nd hat on the emoji (at top right user menu) when the user set a user-status

image

2 „GefĂ€llt mir“