Sass 如何制定scss子-父规则？

例如：

.root-selector .two-selector .other-selector .any-selector .gold .button{
    color:gold;
}

.root-selector .two-selector .other-selector .any-selector .black .button{
    color:#000;
}

.root-selector .two-selector .other-selector .any-selector .yellow .button{
    color:yellow;
}

.root-selector .two-selector .other-selector .any-selector .grey .button{
    color: rgb(100,100,100);
}

需要为该案例制定简单紧凑的scss规则。

它将是：

.root-selector {
    .two-selector {
        .other-selector {
            .any-selector {
                .gold {
                    .button {
                        color:gold;
                    }
                }
                .black {
                    .button {
                        color:#000;
                    }
                }
                .yellow {
                    .button {
                        color:yellow;
                    }
                }
            }
        }
    }
}

或：

或：

---

第一个选择器也可以是

。根选择器。两个选择器。其他选择器。任何选择器

，都不一定需要嵌套。是的，您可以添加类的完整路径

.root-selector {
    .gold {
        .button {
            color:gold;
        }
    }
    .black {
        .button {
            color:#000;
        }
    }
    .yellow {
        .button {
            color:yellow;
        }
    }
}

.root-selector {
    .gold > * {
        color:gold;
    }
    .black > * {
        color:#000;
    }
    .yellow > * {
        color:yellow;
    }
}