Как управлять элементами таблицы стилей CSS в Rails 3.1?

Я просто изучаю новый конвейер активов в Rails 3.1. Одна конкретная проблема, с которой я столкнулась, заключается в том, что Sprockets просто сбрасывает все найденные таблицы стилей CSS в одну массивную таблицу стилей. Я понимаю, почему это выгодно для ручного слияния таблиц стилей и минимизации для производства. Но я хочу иметь возможность выборочно каскадировать таблицы стилей вместо того, чтобы все правила были объединены вместе. Например, я хочу:

master.css

для загрузки всех страниц в приложении Rails, но я хочу

admin.css только для загрузки страниц/представлений в разделе admin/namespace.

Как я могу воспользоваться отличным способом, которым Rails 3.1 объединяет таблицы стилей и минимизирует их для производства, но также имеет прежнюю гибкость в том, что вы можете загружать только определенные комбинации таблиц стилей для каждого макета?

Или это должно быть сделано путем добавления тегов body в макеты -

body class= "admin"

И затем, при необходимости, настройте правила стиля. Использование селекторов SASS может быть разумным решением.

Ответ 1

Вот как я решил проблему стилизации: (извините Haml)

%div{:id => "#{params[:controller].parameterize} #{params[:view]}"}
    = yield

Таким образом, я запускаю все страницы .css.sass с помощью

#post
  /* Controller specific code here */
  &#index
    /* View specific code here */
  &#new
  &#edit
  &#show

Таким образом, вы можете легко избежать любых столкновений.

Надеюсь, это помогло кому-то.

Ответ 2

У меня есть сообщение об этом на моем сайте: Использование Rails 3.1, SCSS и конвейер активов для дифференциации таблиц стилей

И проверить этот ответ на другой вопрос: Использование конвейера активов Rails 3.1 для условного использования определенных css

Надеюсь, что это поможет.

С уважением, Лассе

Ответ 3

@nathanvda: уверенный...

Мы используем несколько файлов макета. Поэтому в наших приложениях/представлениях/макетах вместо того, чтобы иметь только application.html.haml(мы используем HAML), мы фактически игнорируем макет приложения и используем 3 пользовательских макета:

admin.html.haml(только для разделов раздела)

registered.html.haml(зарегистрированный/подписанный только для пользователей)

unregistered.html.haml(незарегистрированный/неподписанный только для пользователей)

Итак, в верхней части моего файла admin.html.haml у меня будут теги ссылок на таблицу стилей для отдельного манифеста admin.scss(мы используем SCSS). Этот манифест загрузит любые необходимые таблицы подстатей только для раздела admin. Это позволяет нам указывать правила только для раздела admin, а также использовать общие стили. Например, мы используем jquery-ui на всем сайте, поэтому стили, связанные с jquery-ui, размещаются в их собственной таблице стилей, и мы включаем их в манифесты для всех файлов css-манифеста css.

Это решение не дает вам одного CSS файла, который можно кэшировать, но он дает вам 3 файла CSS, каждый из которых может быть кэширован. Это позволяет сочетать производительность и некоторую гибкость при организации правил CSS, поэтому нам не нужно беспокоиться о столкновении с CSS.

Ответ 4

То, как я это делал до сих пор, состоит в том, чтобы иметь две отдельные папки a/и u/where a/для просмотра admin и u/для просмотра пользователем. Затем в макете я указываю на соответствующее application.css с активами /u/application.css(js). Немного боли, которая должна каждый раз перемещать автоматически сгенерированные файлы, но намного меньше, чем необходимость каждого файла в манифесте отдельно.

Ответ 5

Я использую что-то вроде

application.html.erb " >

show.html.erb

content_for: body_id do page_specific_body_id конец