2010-06-12 4 views
7

При использовании HAML на Ruby On Rails, тоВ HAML на Ruby on Rails, как использовать фильтр sass?

:sass 
    #someDiv 
    border: 3px dashed orange 

не будет иметь никакого <style> тег вокруг них.

, а затем

:css 
    :sass 
    #someDiv 
     border: 3px dashed orange 

не пинать на :sass фильтр, но

:css 
:sass 
    #someDiv 
    border: 3px dashed orange 

будет удар на :sass фильтр, но он находится за пределами <style> тега. Итак, как можно использовать фильтр :sass? Мы можем вручную обернуть вокруг него <style>, но не часто используется то, что мы хотим генерировать css из sass, но не внутри тега <style> в файле HAML.

ответ

12

Документация по вашему вопросу: here на haml-lang.com и более подробное объяснение по адресу sass-lang.com.

Я считаю, что вам не хватает, что sass не следует использовать в ваших файлах haml. Они должны быть размещены в public/stylesheets/sass с расширением .sass. Они будут скомпилированы в файл .css в общедоступном/stylesheets, который затем вы укажете в свой макет.

Из ссылки sas-lang.com:

Например, общественное/стилей/Sass/main.scss будет скомпилирован для общественности/стилей/main.css.

Вы бы затем использовать stylesheet_link_tag помощника (или связать таблицы стилей вручную):

<%= style_sheet_link_tag 'main' %> 

Если вам действительно нужно использовать дерзость в Haml, here ответ. Вы не можете вложить фильтры в haml. Вы, видимо, нужно сделать что-то вроде этого:

%style(type="text/css") 
    :sass 
    div 
     color: red 

Я считаю, что this был оригинальный ответ от Haml Google групп.

+4

гм ... если дерзость не следует использовать в файле Haml, то не существовало если дерзость фильтр? –

+0

У этого есть свои применения, но использование внешней таблицы стилей имеет тенденцию быть более удобным и сухим. Ссылка: http://stackoverflow.com/questions/1127927/is-using-the-style-attribute-frowned-upon – Awgy

+0

Фильтр Sass/scss был бы полезен, например, для 404, 422 и 500 в качестве страниц с раздельной компоновкой и кеширование включено, поэтому развертывание вы просто запрашиваете страницы, чтобы получить статические html-файлы. Мне просто не нравится писать простые css. – tig

2

Вы также можете создать собственный фильтр для создания тега стиля.

Приведенный ниже пример определяет новый фильтр: csass.

require "haml/filters" 
module Haml::Filters::Csass 
    include Haml::Filters::Base 
    include Haml::Filters::Sass 
    lazy_require 'sass/plugin' 
    def render(text) 
    src = super 
    "<style>#{src}</style>" 
    end 
end 

Таким образом, вы можете сделать это так :)

:csass 
    #someDiv 
    border: 3px dashed orange 
10

Since 4.0.0,

:sass фильтр теперь оборачивает свой вывод в стиле тега, как это делают новый :less и :scss фильтры.

До 4.0.0, просто обернуть его в %style:

%style 
    :sass 
    // so sassy! ;)