2016-03-04 2 views
0

У меня есть приложение Rails, в котором есть несколько статических страниц, и я планирую иметь больше в будущем.Добавление определенной таблицы стилей на одну страницу Rails

Текущая структура файла:

.... 
/assets/stylesheets/static.scss 
.... 
/controllers/static_controller.rb 
.... 
/views/static/home.html.erb 
/views/static/feedback.html.erb 
.... 

Мой Gemfile содержит 'самозагрузки-Sass' драгоценный камень.

Я хочу home.html.erb вид иметь различный стиль от всех других «статичные» страницы, и в частности, следующие CSS:

html { 
    height: 100%; 
    background: url(assets/image.jpg) no-repeat center center; 
    background-size: cover; 
    font-family: Arial; 
} 

h1 { 
    color: black; 
    font-style: bold; 
    text-align: center; 
} 

Как/это должно быть достигнуто наиболее эффективно? Должен ли я создать другой контроллер/представление/таблицу стилей для home.html.erb?

КОД:

application.html.erb:

<!DOCTYPE html> 
<html> 
<head> 
    <title>Batuk</title> 
<%= Gon::Base.render_data({}) %> 
    <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true %> 
    <%= javascript_include_tag 'application', 'data-turbolinks-track' => true %> 
    <%= csrf_meta_tags %> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
</head> 
<body> 

<nav class="navbar navbar-default"> 
    <div class="container-fluid"> 
    <div class="navbar-header"> 
     <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar"> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
     </button> 
     <%= link_to 'BATUK', root_path, class: "navbar-brand" %> 
    </div> 

    <div class="collapse navbar-collapse" id="myNavbar"> 
     <ul class="nav navbar-nav"> 
     <li><%= link_to 'Summary', summary_path %></li> 
     <li><%= link_to 'Statement', statement_path %></li> 
     <li><%= link_to 'Balances', balances_path %></li> 
     <li><%= link_to 'Accounts', accounts_path %></li> 
     </ul> 

     <ul class="nav navbar-nav navbar-right"> 
     <li><%= link_to 'Feedback', feedback_path %></li> 
     <li><%= link_to 'Sign Out', root_path %></li> 
     </ul> 
    </div> 

    </div> 
</nav> 

<div class="container"> 
    <%= yield %> 
</div> 

<%= render 'layouts/footer' %> 

</body> 
</html> 
+0

Я думаю, что этот ответ, от этого так вопрос может помочь вам, http://stackoverflow.com/a/7676570/708807 – Chris

ответ

1

Один из способов будет ориентировать контроллера и действия с использованием классов CSS.

В вашем приложении/views/layouts/application.html.erb добавьте методы вызова controller_name и action_name для создания классов CSS.

<body class="<%= controller_name %> <%= action_name %>"> 

CSS

html { height: 100% } 

body.home { 
    height: 100%; 
    background: url('assets/image.jpg') no-repeat center center; 
    background-size: cover; 
    font-family: Arial; 
} 

.home h1 { 
    color: black; 
    font-style: bold; 
    text-align: center; 
} 
0

Создание макета с соответствием имени, для static_controller, имя шаблона должно быть static.html.erb. затем указать расположение в контроллере

class staticController < ApplicationController 
    layout 'static' 
end