ruby-on-rails - 使用 SASS 切换用户主题 - Ruby on Rails

Question

所以我有一个 Rails 管理系统，允许用户选择一个主题，基本上是一组 SASS 颜色变量，这些变量将使用新颜色重新编译 application.css.scss。当用户从下拉列表中选择并提交时，最好的改变方式是什么？我阅读了一些关于缓存和重新编译的一些问题，但我并不完全清楚如何设置它。

目前我有..

应用程序.css.scss

@import "themes/whatever_theme";
@import "common";
@import "reset";
@import "base";

主题/_whatever_theme

$theme_sprite_path: '/images/sprite_theme_name.png';
$main_color:#009DDD;
$secondary_color:#b3d929;
$light_background:#f2f2f2;
$border_line:#e6e6e6;
$off_white:#f9f9f9;
$white:#ffffff;
$font_body:#565b59;
$font_headers:#363a36;

假设我有 5 个不同的主题供用户切换，最好在 Rails 中为每个主题设置变量名，然后将它们传递给 SASS 并即时更改它们并重新编译。这是解决此问题的最佳方法吗？

Answer 1

3 个简单步骤:

1. 在部署时将所有主题编译成不同的文件。这将处理时间戳、压缩等。

2. 使用默认主题渲染页面。

3. 使用 javascript 加载备用主题 CSS。

不需要搞乱动态编译等等。

要动态加载 CSS，您可以使用这样的方法:

function loadCSS(url) {
  var cssfile = document.createElement("link");
  cssfile.setAttribute("rel", "stylesheet");
  cssfile.setAttribute("type", "text/css");
  cssfile.setAttribute("href", url);
}