rails 5引导4(单控制器)中索引动作的不同css

Question

我正在为我的应用程序使用一个特定的引导4模板。此模板(cover.css)特定于主页，因为所有其他页面都将使用不同的样式。

如何仅将cover.css用于索引操作？

在我的application.css中，我添加了@import "cover"，我可以只将它应用于索引操作吗？

我尝试创建两个布局：application.html.erb用于应用程序，第二个布局home.html.erb仅用于主页。如何将cover.css与index操作相关联，并为应用程序的其余部分提供仪表板布局和css？

我使用的是rails 5和引导4 alpha。

Answer 1

要做到这一点，有几种方法。

您可以创建包含cover.css资产的布局，然后只为索引操作应用布局，如本文所述Rails layouts per action?

class MyController < ApplicationController
  layout :resolve_layout

  # ...

  private

  def resolve_layout
    case action_name
    when "new", "create"
      "some_layout"
    when "index"
      "other_layout"
    else
      "application"
    end
  end
end

另一种选择是使用单个布局并对样式进行范围调整。

在views/layouts/application.html.erb中，body标记上的类设置如下

当<body class="<%= controller_name %> <%= action_name %>">呈现时，它将输出<body class="home index">

然后，在您的cover.css范围内，您的样式到.home.index选择器。

body.home.index h1{
    /* this style is only applied on the home/index page */
}

Answer 2

像这样的东西会有用的。

<%= stylesheet_link_tag    "application", :media => "all" %>
<%= stylesheet_link_tag params[:controller] %>

参见这里的第三个答案：How do I use Controller specific stylesheets in Rails 3.2.1?