Theme:Twentynineteen//如何排除Cookie控制三角形并启动SVG,使其不被主题CSS“SVG{Fill:CurrentColor;}”覆盖

时间:2020-03-16 作者:Inge

我在我的网页上实施了civic Cookie控制https://ingereck.net. 除了ccc图标(三角形和星形)没有显示(我的页面右下角),其他一切都正常。

主题的css

svg{填充:currentColor;}

正在覆盖它。

我试过修复

svg:非(#三角形){填充:currentColor;}

但它要么不工作,要么选择器不正确。

有什么办法解决这个问题吗?

1 个回复
SO网友:Inge

以我的Twenty199Child主题的风格删除这行代码。css修复了该问题:

button#ccc-icon *:not(g) {
  fill: inherit;
}
说明:

第6353行,样式。二十世纪十九(父)主题的css,即。

svg {
transition: fill 120ms ease-in-out;
fill: currentColor;
}
覆盖打开和关闭模块的按钮的cookie控制模块css。所讨论的html是:

<button id="ccc-icon" aria-label="Cookie Control" aria-controls="ccc-module" accesskey="c">
    <svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" viewBox="0 0 72.5 72.5" enable-background="new 0 0 72.5 72.5" xml:space="preserve">
        <title>Cookie Control Icon</title>
        <g id="triangle">
            <path d="M72.5,72.5H0L72.5,0V72.5z"></path>
        </g>
        <g id="star">
            <path d="here goes the code of the svg icon"></path>
        </g>
    </svg>
</button>
请注意,这种行为不会在二十个主题处于活动状态时发生(这是一个示例,我没有测试任何其他主题)。

我注意到,当将cookie控制模块的初始状态设置为“打开”时,这会导致性能下降(WebGetTest lighthouse)约6%。初始状态可以在WordPress插件目录中的配置文件或插件设置中设置(请不要与可设置为“开”和“关”的初始同意状态混淆)。

相关推荐

可以在块编辑器样式表中使用POST-TYPE作为css选择器的一部分吗?

我正在为块编辑器编写一个编辑器样式表,以更好地反映编辑器中我的主题的布局,并且我需要能够在其中处理不同的帖子类型。在前端,有body_class() 函数,其中插入一个类,该类用于标识post类型,并可在组合选择器中使用,以仅在特定post类型中寻址某些元素。post type类位于body 显示编辑器的页面标记,但样式表中的编辑器CSS显然是以一种“隔离”的方式应用的–组合选择器,包括body 标记在编辑器中不起作用。因此,我正在寻找类似的东西,它将在块编辑器中工作,以便我可以在组合选择器中使用它,该选