使用常量编辑器 TYPO3 更改 css 颜色变量答案

【问题标题】：Change css color variable with constant editor TYPO3使用常量编辑器 TYPO3 更改 css 颜色变量
【发布时间】：2021-12-27 19:56:08
【问题描述】：

我目前在typo3上有多个站点，我想建立一个系统来通过常量编辑器更改每个站点的颜色。

为此，我在 CSS 文件中创建了颜色变量，例如：

root {
  --first: # 007bff;
  --second: # 6610f2;
}

我是这样设置的：

我的常量文件：

skin {

    # customsubcategory = site = Param Site
    site {
        # cat = skin / site / 1; type = string; label = title detail news
        newsSuffixHeadTitle = Poppy

        # cat = skin / site / 2 type = color; label = first color
        firstcolor = var (--first)

         # cat = skin / site / 3 type = color; label = second color
         secondcolor = var (--second)
    }

我的设置文件：

page.cssInline.10 = TEXT
page.cssInline.10.value (
.theme1 .container-nav .content-nav .theme1 .container-nav .menu-responsive {background: {$ skin.site.firstcolor}}

.theme1 .container-carousel-communes .b-title-item h3 {color: $ skin.site.secondcolor})

在常量编辑器上，我使用 var (--first) 和 var (--second) 在 css 上应用我的颜色，但我认为这不是一个好方法

我希望我可以直接通过常量编辑器选择颜色，但是我对此了解不多，请问您有什么想法吗？

谢谢

【问题讨论】：

标签： php css typo3

【解决方案1】：

您不能从 TYPO3 常量访问 CSS 常量。 CSS 常量实际上仅适用于 SCSS 或 SASS 等扩展，并且仅在将扩展 CSS 编译为 CSS 时使用。

直接将您的值分配给 TYPO3 常量，如下所示：

skin {    
    # customsubcategory = site = Param Site
    site {
        # cat = skin / site / 2 type = color; label = first color
        firstcolor =  #007bff;

         # cat = skin / site / 3 type = color; label = second color
         secondcolor = #6610f2;
    }

我猜#后面应该没有空格。

【讨论】：