核心中现已提供暗/光模式切换

深色/浅色模式切换主题组件已合并到 Discourse 核心中,可以通过 interface color selector 站点设置进行启用,该组件添加了一个切换按钮,允许用户轻松地在浅色和深色模式之间切换。

除了各种错误修复和改进之外,核心版本与原始主题组件略有不同,它增加了一个第三个“自动”选项,该选项使站点的颜色模式与用户设备的系统偏好设置匹配。

可以通过 interface color selector 站点设置配置颜色选择器,使其显示在站点标题中搜索图标旁边,或显示在侧边栏页脚中。

这是它在侧边栏页脚中的截图:

这是它在标题中的截图:

主题组件的现有用户

我们已弃用该主题组件,并发布了最终更新,使其能够检测核心版本是否可用,并提醒管理员删除它并启用核心版本。这是管理员警报的截图:

启用核心版本后,该主题组件将不再对您的站点产生影响。但是,您仍应将其完全删除,以防止将来可能出现的故障,因为我们不再对该主题组件进行任何维护。

43 个赞

您好,感谢您推出这项新功能,但我注意到切换到深色模式时,按钮上的文本和图标仍然是黑色的,而不是变成白色。如何才能让深色模式激活时,按钮上的文本和图标变成白色?谢谢。

3 个赞

您能分享一张您看到的这个问题的截图吗?

5 个赞

这是一个例子:当我将 Discourse 切换到暗黑模式时,一些按钮文本仍然是黑色的。我认为将文本改为白色会更有意义。但是,我找到了一个使用 CSS 的解决方案,我认为它能很好地解决这个问题。

$button-text-color: dark-light-choose(#ffffff, $primary);

:root {
  --button-text-color: #{$button-text-color};
}

.btn-primary {
  color: var(--button-text-color) !important;
  
  .d-icon {
    color: var(--button-text-color) !important;
  }
}
3 个赞

这是我们有意为之的设计决策,针对主要按钮(在默认调色板中具有蓝色背景的按钮),因此我们不会为所有人更改它。话虽如此,Discourse 非常灵活,并有一个主题系统可以覆盖核心 CSS。

7 个赞

我已经进行了设置,但无法看到该选项。您能解释一下原因吗?

4 个赞

您是否在 /my/preferences/interface 的偏好设置中选择了浅色和深色主题?仅当同时选择了浅色和深色主题时,切换按钮才会出现:

4 个赞

您好,我在偏好设置中看不到该颜色选项,只有“主题”和“夜间模式”:

3 个赞

我相信,如果您启用“暗模式”复选框(我假设“Mode sombre”在法语中表示暗模式),那么切换开关就会出现。您可以试试吗?

我之前帖子中的“配色方案”偏好设置,如果您的网站有多个暗配色方案供用户选择,就会显示出来。如果只有一个配色方案可用,则下拉菜单将被您看到的复选框替换。

3 个赞

非常抱歉……在哪里可以找到开启此功能的设置?
它不需要安装吗?
有了新的管理员界面,我有点晕头转向。

1 个赞

在手机/iPhone上不显示
在桌面上:完美。
我记得之前的版本(组件版本)显示了。

仅显示某些 iPhone 和论坛有效。

它在核心中……这意味着我猜它应该在尝试安全模式时显示出来。如果发生这种情况,则与其他组件、主题或插件存在冲突。

否则

  • Discourse 不够新
  • 切换未在站点设置中启用
  • 深色模式未在站点级别或用户设置中启用

几天前它还能正常工作,这很奇怪

我过几天再回来看看。
谢谢。

1 个赞

我没有这两个选项……只有常规的……

明白了!不过这有点难 :slight_smile:
这是混合了多种设置和个人偏好… 我认为我们应该让主题更容易地提供两种配色方案(深色和浅色)。

5 个赞

嗯,它没有出现在侧边栏页脚。

2 个赞

[引用=“Andrew Rowe,第10帖,话题:350991,完整内容,用户名:Andrew_Rowe”]
非常抱歉……开启此功能的设置在哪里?
不需要安装吗?
随着新的管理员界面,我有点迷糊。
[/引用]

如果你访问你网站的 /admin/site_settings/category/all_results?filter=interface_color_selector,应该能看到对应的设置。

[引用=“Patrick EMIN,第17帖,话题:350991,用户名:patrickemin”]
不,不会出现在侧边栏的页脚里。
[/引用]

如果你在手机/电脑上将系统偏好从亮模式切换到暗模式(或反之),你的 discourse 界面会自动匹配系统偏好吗,还是保持不变(在亮或暗模式下)?

鉴于这里核心选择器正常工作,而且许多其他站点也正常,肯定是在你那边有配置问题,导致选择器没有显示出来。你能分享在登录你的账户时,在浏览器控制台运行以下命令的输出吗?

(({dark_scheme_id, color_scheme_id}) => { return {dark_scheme_id, color_scheme_id} })((await (await fetch(`/u/${Discourse.User.current().username}.json`)).json()).user.user_option)
Discourse.SiteSettings.default_dark_mode_color_scheme_id

我的设置是好的(侧边栏底部)。如果我在手机或电脑上切换到暗黑模式,它没有任何变化,至于控制台,我不知道如何使用它,抱歉 :grimacing:

但是,您的系统设置和/或个人设置中的深色主题设置可能不正确。

1 个赞

嗯,可能吧,我一直对那种设置类型感到困难,但这并不那么重要,我就那样留着了,谢谢你试图帮忙。

3 个赞