帖子通知可见性控制

主题组件
,
1
:information_source: 摘要 自定义帖子通知的可见性和样式，按类型和时效区分
:hammer_and_wrench: 代码库 GitHub - moin-Jana/post-notice-visibility-control: Customize visibility and style of post notices by type and age
:question: 安装指南 如何安装主题或主题组件
:open_book: Discourse 主题新手？ Discourse 主题使用入门指南

安装此主题组件

此组件可让您控制每种类型的帖子通知（新用户、回访用户和官方）在新帖子和旧帖子上的显示方式。您可以选择它们是突出显示、可见还是隐藏 - 并为每种类型独立设置自定义高亮颜色。

屏幕截图显示了不同类型的通知在（左侧）新帖子和（右侧）旧帖子上的外观示例：

左侧显示带有红色背景的官方通知，带有绿色背景的新用户通知，以及带有灰色背景的回访用户通知。右侧，官方通知仍为红色背景，新用户通知没有背景，回访用户通知不可见
左侧显示带有红色背景的官方通知，带有绿色背景的新用户通知，以及带有灰色背景的回访用户通知。右侧，官方通知仍为红色背景，新用户通知没有背景，回访用户通知不可见1372×746 39.7 KB

配置示例 1 
"custom_new": "highlighted"
"custom_old": "highlighted"
"custom_highlight_color": "var(--danger-low-mid)"

"new_user_new": "highlighted"
"new_user_old": "visible"
"new_user_highlight_color": "var(--success-low)"

"returning_user_new": "highlighted"
"returning_user_old": "hidden"
"returning_user_highlight_color": "var(--primary-200)"

左侧显示带有金色背景的官方通知，没有背景的新用户通知，以及没有背景的回访用户通知。右侧，官方通知没有背景，新用户通知和回访用户通知不可见
左侧显示带有金色背景的官方通知，没有背景的新用户通知，以及没有背景的回访用户通知。右侧，官方通知没有背景，新用户通知和回访用户通知不可见1372×746 42 KB

配置示例 2 
"custom_new": "highlighted"
"custom_old": "visible"
"custom_highlight_color": "var(--gold)"

"new_user_new": "visible"
"new_user_old": "hidden"
"new_user_highlight_color": "var(--tertiary-low)"

"returning_user_new": "visible"
"returning_user_old": "hidden"
"returning_user_highlight_color": "var(--tertiary-low)"

对于每种通知类型和时效组合，您可以选择通知是突出显示、可见（无高亮）还是隐藏。如果选择“突出显示”，您可以选择性地定义自定义背景颜色。

我建议使用颜色变量，如 var(--quaternary-low)。这些变量引用活动颜色调色板中的颜色，因此当用户在不同调色板（例如，浅色和深色模式）之间切换时，它们会自动适应。这使得它们比硬编码的颜色更具灵活性。虽然大多数颜色调色板只显示几种基本颜色，但 Discourse 会生成这些颜色的不同色调供您使用。您可以使用 styleguide 探索许多可用的颜色变量，该指南可通过 styleguide enabled 站点设置启用。或者，您也可以在浏览器中检查您的站点 - 打开开发者工具，转到“样式”选项卡，然后滚动到底部以查看所有可用的颜色变量。

您也可以使用十六进制值，如 #EE8888，RGB 值，如 rgb(255, 200, 200)，或命名颜色，如 red。

如果未提供颜色，则组件将回退到 var(--tertiary-low)。组件的默认设置复制了标准的 Discourse 行为 - 因此，仅启用它不会改变任何内容，直到您进行配置。

帖子通知被视为“旧”之前的定义天数由 old post notice days 站点设置定义。这适用于所有三种类型的通知。
:warning: 重要提示： 时效是基于帖子创建的时间 - 而不是通知添加的时间。
您可以将值暂时设置为 0，以轻松预览通知将如何显示其“旧”状态。

12 个赞
2

Discourse 的最新版本不再渲染旧帖子通知，这意味着无法通过 CSS 对其进行样式设置。因此，所有 _old 设置均不再生效。

3

随着 Discourse 的最新更新，该组件曾用于为新旧通知应用不同样式的 old 类已被移除。新用户和回访用户的帖子通知将在 old post notice days（旧帖子通知天数）设置后自动移除，而官方通知将永久可见并高亮显示。

因此，该组件已基本过时。唯一剩余的自定义选项与帖子通知的常规颜色设置有关。这些可以通过 CSS 轻松调整，如下所示：

.post-notice.custom {
    background-color: var(--danger-low-mid);
}
.post-notice.new-user {
    background-color: var(--success-low);
}
.post-notice.returning-user {
    background-color: var(--primary-200);
}

如果您希望移除特定通知类型的背景高亮，只需使用 background-color: unset;。

2 个赞