圣诞装饰组件 🎄

主题组件
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 个赞
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 个赞
3

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

7 个赞
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 个赞
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 个赞
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 个赞
7

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

1 个赞
12

在我的讨论中，帽子和灯都可以正常工作，但是装饰图像不显示。我不知道为什么会这样。

1 个赞
13

如果这有帮助的话，装饰仅在桌面顶部左侧和顶部右侧显示。

1 个赞
14

是的，我知道，但我在桌面视图中看不到任何内容。

1 个赞
15

装饰图像在最小屏幕宽度为 1450px 时显示。您是在小显示器或笔记本电脑上查看该网站吗？

1 个赞
16

哦。我在我的 2k 显示器上尝试了它，它能正常工作。现在我正在使用我的联想 Yoga Duet（有点像微软 Surface），它消失了。但是，是否可以在小显示器或笔记本电脑上显示它？

1 个赞
17

笔记本电脑用户看不到铃铛会很可惜……我喜欢它。它代表圣诞节。

1 个赞
18

您可以 fork 该主题并 调整屏幕宽度设置。

1 个赞
19

太棒了！我会试试的！谢谢你的帮助！

1 个赞
20

如果有人有在装饰品之前出现的其他组件，您可以尝试添加此 CSS 来强制灯光排在最前面：

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

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

（这可能会破坏其他集成，因此请彻底测试）

4 个赞
21

我能更改灯光的颜色吗？

2 个赞
22

帽子未在帖子中显示。

2 个赞
23

@meghna 这太棒了！

“圣诞装饰图片”对我来说不起作用。

有什么方法可以更改灯的颜色吗？我正在尝试修改 CSS，但没有成功。

1 个赞
24

看起来它会在用户设置了 user-status 时，在表情符号（右上角用户菜单）上添加第二个帽子。

image
image120×106 8.01 KB

2 个赞