0

我正在使用 node-sass 并尝试构建一组易于重新主题的样式，这意味着例如，更改一种颜色将更新其他各种颜色。

我有一个函数，它采用颜色（背景颜色），确定亮度，并输出预设的深色或浅色用作文本颜色。我以前用过同样的功能，效果很好。它包含在 sass 文件中，并且已经测试过它可以工作。

@function color-contrast($color) {
  @if (lightness($color) > 50) {
    @return $color-text-dark; //if the background is more than 50 lightness, return the dark colour
  }
 @else {
   @return $color-text-light; //if not, return the light colour
 }
}

但是，我现在尝试在变量声明中使用此函数。所以我有

$contentbox-text-color: color-contrast($bg-color) ;

（$bg-color、$color-text- 等在工作表的前面设置）

问题是，无论我在哪里使用 $contentbox-text-color，我都将其视为颜色值

color-contrast(blue);

（其中“蓝色”是 $bg-color 值）——而不是我希望看到的函数的结果。我试过插值如下所示的函数，但结果是一样的

$contentbox-text-color: #{color-contrast($bg-color)} ;

我需要通过变量访问此函数，因为然后我使用变量（/结果颜色）作为 mixin 的参数，以及在其他各种地方。

有谁知道有什么方法可以实现我想要做的事情？我找不到有关在变量中使用函数的任何信息，所以我不知道这是否是不可能的，或者我只是缺少一些可以使其正常工作的语法！

谢谢 ：）

快速更新：如果我直接调用函数作为 mixin 中的参数，这将正确编译，但理想情况下，我希望能够简单地使用变量名，以便可以在整个过程中使用相同的变量（如果由于某种原因它改变了，这是可能的，不得不去每个 mixin 并更新参数而不是简单地依赖变量会很痛苦！）

4

0 回答 0