在 SCSS 中访问类别颜色

支持
5

@tjot,

可以通过 ::after 伪元素的边框来实现您想要的效果的 CSS 技巧。

.category-list tbody .category {
    border-left: none;
    position: relative;
    padding-left: 50px;

    > h3:first-child {
        border-width: 0;
        border-style: solid;
        border-color: inherit;
        
        &::after {
            content: "";
            width: 0px;
            height: 70%;
            position: absolute;
            border-radius: 20px;
            border-width: 10px;
            border-style: solid;
            border-color: inherit;
            top: 50%;
            transform: translateY(-50%);
            left: 10px;
        }        
    }
}

image
image1080×738 130 KB

请注意，我已将样式直接应用于标题的 h3 元素，因为它是在应用了内联样式的 td 的直接子元素。因此，如果模板将来移除它，您将不得不调整您的 CSS。

但是，您可以跳过覆盖 components/parent-category-row，正如您想要的。