css - 使用 bootstrap gem 时包含特定的 Bootstrap less 文件

Question

我正在使用:

gem 'less-rails'
gem 'less-rails-bootstrap', '~> 3.3'

我想根据 Bootstrap 现有的警报警告制作自定义 CSS 警报类。

深入研究 bootstrap 的 alerts.less，我看到警报是通过以下方式定义的:

.alert-warning {
  .alert-variant(@alert-warning-bg; @alert-warning-border; @alert-warning-text);
}

所以理想情况下我想做这样的事情:

.my-warning {
  .alert-variant(red; @alert-warning-border; @alert-warning-text);
}

然而，要做到这一点，我需要通过@include 引入 alerts.less 和 variables.less。

如果我正在使用 gem，我该怎么做？

Answer 1

关于 https://github.com/metaskills/less-rails-bootstrap你可以阅读:

Please see the less-rails-bootstrap-test repo for examples that customize the CSS output by using LESS. The "CSS Tests Suites" section of the README and code is what you want to focus on. Also, check out the LESS syntax.

然后你会发现:https://github.com/metaskills/less-rails-bootstrap-test#basic-less-bootstrap .所以在你的情况下:

/*
 *= require basic_less/index
*/


@import "twitter/bootstrap";

.my-warning {
  .alert-variant(red; @alert-warning-border; @alert-warning-text);
}