Как использовать специальные таблицы стилей контроллера в Rails 3.2.1?

Question

Использование Rails 3.2.1

---

Я создал простой контроллер под названием Home с помощью команды:

rails g controller Home index 

И он создал новый контроллер и представление для меня:

Обратите внимание, что существуют две таблицы стилей, одно «приложение» и один «дом». Я не могу найти документацию для поддержки этого предположения, но я предполагаю, что вы ставите стили, которые будут применяться только к представлениям «Главная», в файле Home.css.scss, правильно?

Итак, в качестве теста я добавил в некоторые глобальные стили Application.css.scss.erb и запустил приложение.

Стили применяются, как ожидалось.

Далее я добавил некоторые правила в файл Home.css.scss, и я посетил представление «Главная/индекс», но стиль в этом файле не был присоединен ни как отдельная ссылка ссылки CSS, ни даже прилагается к одному файлу Application.css.scss. Это очень запутанным для меня, так как комментарии говорят:

// Place all the styles related to the Home controller here. 
// They will automatically be included in application.css. 
// You can use Sass (SCSS) here: http://sass-lang.com/ 

Почему правила, написанные в Home.css.scss не применяется на мой сайт?

Answer 1

Я не думаю, что это работает (Home.css применяется только к Home действиям контроллера). Разные файлы предназначены только для разделения, чтобы было более четким описание правил CSS. Вы можете прочитать это guide о конвейере активов. Я предполагаю, что вы изменили значение по умолчанию application.css.scss и удалили строку, импортирующую все файлы CSS, с app/assets/stylesheets.

Answer 2

Это может работать так, и Марек совершенно прав, ответ в руководстве. В introduction to section 2.1:

Например, если вы создаете ProjectsController, Rails также добавить новый файл в app/assets/javascripts/projects.js.coffee, а другой на app/assets/stylesheets/projects.css.scss. Вы должны поместить любой JavaScript или CSS уникальный в контроллер в своих соответствующих файлах активов, так как эти файлы могут быть загружены только для этих контроллеров с такими строками, как <%= javascript_include_tag params[:controller] %> или <%= stylesheet_link_tag params[:controller] %>.

Так, чтобы установить приложение, чтобы загрузить контроллер конкретных стилей:

Во-первых, отключить загрузку по умолчанию для всех таблиц стилей путем удаления каких-либо дополнительных требует в application.css манифеста.

Обычно вы увидите такую ​​запись:

*= require_tree . 

Если вы все еще хотите загрузить некоторые общие CSS-файлы, вы можете переместить их в подкаталог и сделать что-то вроде этого:

*= require_tree ./common 

Во-вторых, в макете вашего приложения добавить предложенный stylesheet_link_tag например

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

В этом Например, мы сначала загружаем файл приложения css, затем загружаем любой файл css, соответствующий текущему имени контроллера.

Answer 3

TL; DR:

Игнорировать комментарий, это не сделано Сасс. Но поставьте: @import "*"; в файл application.css.scss, и он автоматически импортирует все файлы scss-контроллера.

Полное чтение:

Отказ от ответственности: Это мое нынешнее понимание потока трубопровода активов с и без Сасс.

Я думаю, что этот комментарий написан стандартным трубопровод Rails Asset (звездочки), а не Sass:

// Place all the styles related to the Home controller here. 
// They will automatically be included in application.css. 
// You can use Sass (SCSS) here: http://sass-lang.com/ 

Стандартный трубопровод будет обрабатывать SCSS файлов, но не может позволить в application.css. scss файл. Но если вы создадите такой файл с Sass, то Sass скомпилирует его в файл application.css.

Если вы используете обычный трубопровод Рельсы активов, без Sass, то Звездочки бы загрузить файл CSS в application.css файл автоматически (если этот файл имеет *= require_tree . строку по умолчанию в нем).

Когда вы используете Sass, с application.css. scss файл, Sass скомпилирует этот файл в файл application.css. (Я предполагаю, что он будет перезаписываться или иметь приоритет над любым файлом application.css, который у вас уже был).

Чтобы получить home.css.scss файла (и другие файлы контроллер) автоматически включается, добавьте эту строку в ваш application.css.scss файла:

@import "*"; 

Для справки см это вопрос: Is it possible to import a whole directory in sass using @import?

Answer 4

Я решил эту проблему с помощью простого решения.Добавить в body имя контроллера, как класс, редактирование views/layouts/application.html.slim:

body class=controller.controller_name 

Или views/layouts/application.html.erb:

<body class="<%= controller.controller_name%>"> 

А потом в моей CSS я просто использовать body.controller_name как имен:

/* example for /users/ */ 

body.users { 
    color: #000; 
} 

body.users a { 
    text-decoration: none; 
} 

Для небольших проектов я думаю, что все в порядке.