新手问题 有谁在 Rails 项目中使用过 bootswatch 么?

machixian · 2013年04月25日 · 最后由 machixian 回复于 2013年04月25日 · 4718 次阅读

我做了几次不同的尝试都没有成功。

第一种是使用twitter-bootstrap-rails,然后在 bootswatch.com 下载某个 theme 的 variables.less 和 bootswatch.less 文件加入到 stylesheets 目录中,再在bootstrap_and_overrides.css.less最开始加入

@import "variables";
@import "bootswatch";

但是最后会报错:

.box-shadow is undefined
  (in /Projects/my/app/assets/stylesheets/bootswatch.less)

另外一个尝试是使用twitter-bootswatch-rails,加入 gems 之后安装的步骤是

rails g bootswatch:install simplex
rails g bootswatch:import simplex
rails g bootswatch:layout application
rails g bootswatch:themed items

这样做完之后访问 localhost:3000/items 还是报跟上面一样的错误。

.box-shadow is undefined
  (in /Projects/my/app/assets/stylesheets/bootswatch.less)

我的目的很简单,就是使用 bootswatch 的其中一个 theme,不需要做到能切换的,在整个项目的页面都默认使用这个 theme 就行。

有谁对使用 bootswatch 比较熟悉的麻烦指点一下。

@import "variables";
@import "bootswatch";

加 bootstrap_and_overrides.css.less 底部试试。

https://github.com/yesmeck/vim-tips.org/blob/master/app/assets/stylesheets/bootstrap_and_overrides.css.less

#1 楼 @yesmeck 感谢你提供的代码,试了一下关键不是 import 两个文件的位置,而是需要在 bootswatch.less 中增加

@import "twitter/bootstrap/bootstrap";
@import "variables";

不过我还是不明白这些东西的处理顺序是什么,为什么要这么加。

可以参考这个项目,用的是 anjlab-bootstrap-rails,模板是 United

gem 'anjlab-bootstrap-rails', '>= 2.0', :require => 'bootstrap-rails'

关键代码还有示例站点

感谢楼上回复。

看来问题的关键还是在于 application.css 里面的require_tree .,这东西会造成 stylesheets 里面的各种 css 重复加载,从而导致错误的产生。

在这里找到一个说明Customizing Twitter Bootstrap On Rails 3

需要 登录 后方可回复, 如果你还没有账号请 注册新账号