ВАЖНО. Для сущностей у которых не указано название, не будут созданы css классы из методологии БЭМ.
Позволяет создавать модификаторы по методологии БЭМ.
Действуют такие же правила трансформации для символов нижнего подчеркивания в символы тире как и у хелпера bem_mix
.
bem_mods
принимает название блока, название элемента (которые не могут быть ''
, false
или nil
) и параметры модификаторов которые могут быть массивом, хешем, символом или строкой.
Модификаторы для блока:
bem_mods :block_name, theme: :green_islands # => 'block-name_theme_green-islands'
Модификаторы для элемента:
bem_mods :block_name, :elem_name, has_tail: true # => 'block-name__elem-name_has-tail'
Единственный модификатор с значением true
:
# Эквивалентные записи
bem_mods :block_name, :has_tail # => 'block-name_has-tail'
bem_mods :block_name, has_tail: true # => 'block-name_has-tail'
bem_mods :block_name, [:has_tail] # => 'block-name_has-tail'
bem_mods :block_name, [has_tail: true] # => 'block-name_has-tail'
bem_mods :block_name, [{ has_tail: true }] # => 'block-name_has-tail'
Список модификаторов:
# Эквивалентные записи
bem_mods :block, enabled: true, size: :small # => 'block_enabled block_size_small'
bem_mods :block, [enabled: true, size: :small] # => 'block_enabled block_size_small'
bem_mods :block, [{ enabled: true, size: :small }] # => 'block_enabled block_size_small'
bem_mods :block, [{ enabled: true }, { size: :small }] # => 'block_enabled block_size_small'
bem_mods :block, [:enabled, size: :small] # => 'block_enabled block_size_small'
ВАЖНО. Будьте ВНИМАТЕЛЬНЫ при использование аргументов с типом String
, а также ключей и/или значений хеша с типом String
это может привести к неправильному результату согласно методологии БЭМ:
bem_mods :block_name, 'has_tail' # => 'block-name_has_tail'
bem_mods :block_name, 'has_tail' => true # => 'block-name_has_tail'
bem_mods :block_name, 'mod_name' => 'mod_value' # => 'block-name_mod_name_mod_value'
те же самые модификаторы при использовании типа Symbol
:
bem_mods :block_name, :has_tail # => 'block-name_has-tail'
bem_mods :block_name, has_tail: true # => 'block-name_has-tail'
bem_mods :block_name, mod_name: :mod_value # => 'block-name_mod-name_mod-value'
Модификаторы у которых значение false
, nil
или ''
:
# Эквивалентные записи
bem_mods :block_name, enabled: false, size: :small # => 'block-name_size_small'
bem_mods :block_name, enabled: '', size: :small # => 'block-name_size_small'
bem_mods :block_name, enabled: nil, size: :small # => 'block-name_size_small'