Discourse 持久横幅

[NateDhaliwal]

	摘要	在每个页面顶部显示一个持久性横幅，只能由管理员隐藏。
	预览	Theme Creator
	仓库	GitHub - NateDhaliwal/discourse-persistent-banner: A theme component for Discourse that cannot be closed by the user.
	安装指南	如何安装主题或主题组件
	不熟悉 Discourse 主题？	Discourse 主题使用入门指南

安装此主题组件

此组件会在每个页面顶部显示一个横幅。可以使用任何有效的 CSS 颜色。如果您打算使用 discourse 主题变量，请将它们包装在 var() 中，这样您就会得到类似 var(--tertiary-very-low) 的内容。

有 7 个设置可控制横幅。

1. banner_background_color 更改横幅的背景颜色。
2. banner_text_color 更改横幅的文本颜色。
3. banner_border_color 更改横幅的边框颜色。
4. banner_border_thickness 更改横幅的边框粗细。
5. banner_text_content 更改横幅的文本。如果文本超过一行，它将在横幅中换行。
6. banner_visible 更改横幅的可见性。show 显示横幅，hide 隐藏横幅。
7. banner_location 将横幅放置在 4 个插槽之一：above-site-header、below-site-header、above-main-container 和 before-topic-list。

特别感谢 @Lilly 帮助整理文件！

[hoangphuctran93 (Hoàng Phúc Trần)]

我觉得它与主题组件“通知横幅”非常相似，并且具有更多的自定义功能。

[NateDhaliwal]

是的，但这样横幅就会一直存在（有人问过关闭横幅后如何让它重新出现）。

[Lilly (Lillian Louis)]

干得好，Nate。
我喜欢它的简洁性

我认为主题创建者预览不起作用。

有几点建议供您参考：

• 桌面模式下存在一些布局问题，特别是如果用户使用宽屏/全屏显示器。

• 如果能控制边框大小和颜色就好了。

• 也许可以提供一些布局选项，配合不同的插件出口，例如 below-site-header 和 above-main-containter？

• 虽然使用枚举列表而不是文本输入来选择颜色很方便，但这也限制了管理员使用与深色/浅色模式兼容的颜色变量，或者在十六进制颜色值方面不够灵活。

• 我建议将横幅字符串设置为文本输入设置，并添加 textarea: true 属性，这样您就可以得到一个用户可以扩展的多行文本框。这样可以更容易地做到这一点：

[NateDhaliwal]

@Lilly

在桌面模式下，尤其是在使用宽屏/全屏时，放置上存在一些问题。

我会调整横幅的放置位置，并尝试解决这个问题。

@Lilly

能够控制边框的大小和颜色会很好。

这应该不是什么大问题，我会添加这个功能。

@Lilly

也许可以为插件的不同出口提供放置选项，例如 below-site-header 和 above-main-containter？

明白了。我大概有个实现这个功能的想法。

@Lilly

虽然使用枚举列表而不是文本输入来选择颜色很方便，但它也限制了管理员使用与深色/浅色模式兼容的颜色变量，或者更精细地设置十六进制颜色值。

我认为我可以实现这个功能。

@Lilly

我建议将横幅字符串文本输入设置为 textarea-true 属性，这样用户就可以得到一个可以扩展的多行文本框。

明白了，我会添加这个功能。

[NateDhaliwal]

@Lilly

textarea-true

@Lilly 确认一下，我应该把它添加到 settings.yml 中吗？

[Lilly (Lillian Louis)]

是的，您可以在此处的通用横幅组件中看到它：

settings.yml

在组件设置中显示结果：

[NateDhaliwal]

@Lilly

也许可以提供不同的插件插槽位置选项，例如 below-site-header 和 above-main-container？

已实现。

@Lilly

能够控制边框大小和颜色会很好。

已完成。

@Lilly

它还限制了管理员使用与深色/浅色模式配合使用的调色板变量，或者更精细地使用十六进制颜色值。

您现在可以使用十六进制值（包括 #）、有效的 CSS 颜色或主题变量（var(–var-name)）。

@Lilly

我建议将横幅字符串文本输入设置为 textarea: true

也已完成。

@Lilly

在桌面模式下，尤其是在使用宽屏/全屏时，放置存在一些问题。

我认为已修复。您能否在您那边试一下？

[Lilly (Lillian Louis)]

@NateDhaliwal

我认为已修复。您能否在您那边试一下？

已分配给 Lilly ​

这绝对修好了。干得好。

我的宽屏桌面视图截图

[NateDhaliwal]

更新：
我已将检查横幅文本是否为空以及横幅可见性的 if 语句移至 .scss 文件，从而简化了 .gjs 文件。