用一个深度定制的深色主题制作浅色主题的最简单方法是什么

[hipp0]

我正在使用 Foundation 主题，并使用深色调色板，我用 CSS 对其进行了大量自定义。

我想知道最简单的方法是创建一个浅色版本，它遵循所有相同的 CSS 规则。

[Moin]

您可以为主题添加浅色调色板

您可以根据使用浅色主题还是深色主题来更新颜色：

@awesomerobot

因此，在 color_definitions.scss 中，您可以这样做：

$my-theme-color: dark-light-choose($primary, red);

:root {
  --my-theme-color: #{$my-theme-color};
}

然后您就可以在主题中使用新的深色/浅色更改自定义属性了：

body {
  color: var(--my-theme-color);
}

[hipp0]

好的，我需要调整每一个与深色或浅色（我使用的是默认的深色/浅色）相关的更改。

[Moin]

这取决于情况。只有当您使用了硬编码的颜色时，才需要这样做。只要您引用像 var(--primary-300) 或 var(--danger) 这样的颜色，它们就会根据调色板自动更改。