Как я могу настроить SASS для компиляции конкретных таблиц стилей в отдельную настольную и мобильную версию?

Question

Я использую Rails 3.1 вместе с Sass. Теперь мне нужно разбить мои таблицы стилей на мобильную и настольную версии. По умолчанию sass-rails сжимает каждый файл .scss в моих ресурсах / stylesheets / path в один файл application.css.

Вместо этого я бы хотел явно указать Sass скомпилированный файл scss X в mobile.css и файлы Y & Z в desktop.css

Это достигается через значение config.sass? Я действительно ценю помощь в этом.

Answer 1

Используйте дизайн ответа вместо проверок на стороне сервера!Более прогрессивный / лучший подход.Кроме того, ваши http запросы будут вам благодарны!

http://css -tricks.com / snippets / css / media-query-for-standard-devices /

Илинаписать метод, который проверяет пользовательский агент (который, я полагаю, вы уже сделали) и обусловить «загрузку вашего стиля»

Answer 2

Обычно вы <% = stylesheet_link_tag: application%>

И application.scss выглядит следующим образом:

*= require_self
*= require_tree

Вместо манифеста звездочки для требуемых файлов используйте включения sass.Чтобы по-прежнему использовать application.scss, удалите строку *= require_tree

Итак <% = stylesheet_link_tag: mobile%>

/ app / assets / stylesheets / mobile.scss

@import "bootstrap/bootstrap.scss";
@import "typography.scss";
body {
  padding-top: 60px;
}

И вы бы сделали то же самое для desktop.scss.Примечание: вам нужно будет вручную добавить каждый файл, который вы хотите импортировать.