sass - 如何使用sass在Bootstrap 4中创建一组新的颜色样式

我开始浏览精彩的Bootstrap 4，并且想知道如何向_custom.scss添加全新的元素颜色集

示例:现在，您有btn-danger，text-danger等...如何使用随机名称创建示例:“crisp”设置...因此您将拥有btn-crisp，text-crisp等...

我的猜测是从添加变量开始

$brand-crisp: #color !default;

但是，那又怎样呢？谢谢!我感谢您的帮助。

最佳答案

没有全包的颜色混合器，所以我认为您需要单独使用混合器...

.btn-custom {
    @include button-variant(#cece19, #222222, #cece19);
}

.btn-custom-outline {
    @include button-outline-variant(#222222);
}

.card-custom {
    @include card-variant(#aa9999, #997777)
}

http://www.codeply.com/go/MKGQCrLwDs

更新:在Bootstrap 4中，您现在可以按照my answer here中的说明创建新的自定义“主题颜色”。这将允许您在任何地方使用颜色，例如btn-custom，text-custom，bg-custom等。

更新Bootstrap 4.1

按钮混合已略有变化，现在需要添加参数...

.btn-custom {
    @include button-variant(#cece19, #222222, #cece19, #cece19, #cece19, #cece19);
}

.btn-custom-outline {
    @include button-outline-variant(#222222, #cece19, #222222, #cece19);
}

@import "bootstrap";