Rails(带有资产管道)在CSS内部进行国际化的惯例是什么? [英] What is the convention in Rails (with asset pipeline) for internationalization inside CSS?

问题描述

我知道CSS不应该包含内容，但确实如此，就像下面的这个漂亮的框一样

I know CSS isn't supposed to have content, but it does, like this nice box (below) extracted from the Twitter Bootstrap documentation CSS:

/* Echo out a label for the example */
.bs-docs-example:after {
  content: "Example";
}

我不在乎示例"，我将类似的东西用作混合:

I don't care for "Example", I use something like that as a mixin:

.box (@legend) {
  /* Echo out a label for the example */
  &:after {
    content: @legend;
  }
}

然后，我不需要真正的动态CSS，我可以轻松地将mixin包含在类中，但是无需传递"Observation"，我需要传递t 'box.observation':

Then I don't need really dynamic CSS, I can easily include the mixin in a class, but instead of passing "Observation" I need to pass t 'box.observation':

.observation {
  .box("<%= t 'box.observation' =>");
}

Rails应该遵循配置约定，仅添加静态CSS/LESS/SCSS非常容易，并且它已经包含在所有缩小的CSS中.国际化CSS的约定是什么?例如，应该在哪里放置类似.observation的声明?

Rails is supposed to follow Conventions over Configuration, it is very easy to just add a static CSS/LESS/SCSS and it is already included in all pages in a single minified CSS. What is the convention for internationalized CSS? For example, where I am supposed to put declarations like that of .observation?

推荐答案

您无需为每个语言环境生成一个新的CSS文件-就会疯狂.为什么CSS关心网站的文本内容?

You don't need to generate a new CSS file for each locale - that borders on madness. Why does your CSS care about the text content of your website?

我认为您最好的选择是使用数据属性来获取价值...

I think your best bet would be to use a data-attribute to grab the value...

<div class='bs-docs-example' data-before-content='<%= t.css_example %>'>
  <!-- html here -->
</div>

然后在您的CSS中:

.bs-docs-example:after {
  content: attr(data-before-content);
}

您可能会找到一种将其提取到部分(或帮助器)中的方法，以便您的erb文件最终如下所示:

You could probably find a way to extract this into a partial (or helper), so that your erb file ends up like this:

<%= docs_example do %>
  <!-- html here -->
<% end %>

和一个辅助方法:

def docs_example
  content_tag(:div, class: "bs-docs-example", "data-before-content" => t.css_example) do
    yield
  end
end

这篇关于Rails(带有资产管道)在CSS内部进行国际化的惯例是什么?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！