在scss文件中使用config.rb中定义的变量
是否可以在整个SCSS文件中使用罗盘项目的config.rb文件中定义的变量?
在config.rb文件中添加自定义模块:
module Sass::Script::Functions def custom_color(value) rgb = options[:custom][:custom_colors][value.to_s].scan(/^#?(..?)(..?)(..?)$/).first.map {|a| a.ljust(2, a).to_i(16)} Sass::Script::Color.new(rgb) end end
然后设置变量(再次,在config.rb文件中):
sass_options = {:custom => { :custom_colors => {"main" => "#ff1122"} } }
然后在scss文件中,您可以使用custom_color()
函数:
body { background-color: custom_color(main); }
您还可以编写另一个自定义函数,通过传入字符串,然后返回相应的类实例,返回其他类型(如字体大小,度量等)。
有趣的是,这将允许您将环境变量传递到罗盘命令行,这将产生不同的结果。
所以如果你sass_options是:
sass_options = {:custom => { :custom_colors => {"main" => ENV["MAIN_COLOR"]} } }
你运行指南针:
MAIN_COLOR=#dd1122 bundle exec compass compile
然后,在命令行中传入的任何颜色都将出现在生成的css中。 如果你正在使用Heroku,你可以使用heroku config:set MAIN_COLOR=#224411
并能够使用相同的scss文件在每个应用程序的基础上设置模板颜色。