您好,我想知道如何为多种配色方案(例如浅色、深色、暗淡色)设置颜色定义,类似于 Twitter 的工作方式。
我目前的问题:
我目前能够为自定义主题组件中未列出的默认浅色和深色(例如 primary-low)设置样式,但不知道如何将此自定义颜色模式添加到不同的配色方案中。
$dark-theme-ins: #1e2732;
$light-theme-ins: #e9e9e9;
$dim-theme-ins: #337733;
$ins: dark-light-choose($light-theme-ins, $dark-theme-ins);
:root {
--primary-100:#{$ins};
--primary-low:#{$ins};
}
Don
2
你好 
Discourse 支持两种配色方案:浅色(Light)和深色(Dark)。因此,当您将设备切换为深色模式时,它将默认使用 default dark mode color scheme id 站点设置。
您可以为 Discourse 设置更多自定义调色板。
您可以在 /admin/customize/colors 页面中设置新的调色板。
或者
例如,如果您使用自定义主题,则可以在 about.json 文件中设置这些内容。例如,我们在 FKB Pro 主题中就是这样做的。
在这种情况下,这些调色板将添加到 /admin/customize/colors 中。
当添加了这些调色板后,如果启用了该功能,用户可以在用户偏好设置界面中选择它们。
dark-light-choose()
dark-light-choose() 只能处理两种配色方案:浅色/深色,而不能处理调色板。我建议仅使用它来创建自定义颜色变量,而不是覆盖默认变量。要覆盖默认颜色变量,您可以按照上面所示进行操作。
如果用户在用户偏好设置界面中选择了不同于站点默认浅色/深色的其他调色板,那么它将使用您通过 dark-light-choose() 创建的颜色变量,应用于所有浅色或深色配色方案的调色板。
这也是我制作以下 Customization > Theme component 的原因之一。
在该主题组件中,您可以单独针对 color-scheme="id"。
因此,您可以这样做 
创建调色板(浅色、柔和、深色)
使用上述组件对柔和 color-scheme="id" 的颜色或其他内容进行修改,如有需要。