Варианты модификации блоков
- Модификатором
- Контекстом
- Уровнем переопределения
Блоку/элементу добавляется модификатор и изменение блока/элемента описывается в коде этого модификатора.
Примеры
По умолчанию фон у попапа осутствует.
Добавление модификатора theme блоку b-popup добавляет ему фон.
theme=yellow добавляет фон желтого цвета:
theme=black добавляет фон черного цвета:
У блока может быть одновременно несколько модификаторов.
Примеры
Модификатор theme — отвечает за фон попапа. Модификатор
direction — отвечает за направление отображения попапа.
theme=yellow и direction=left — попап желтого цвета открывается влево:
theme=yellow и direction=right — попап желтого цвета открывается вправо:
Модификатор блока может изменять структуру блока (например, добавлять/удалять элементы) или его реализацию.
Пример
Модификатор has-close=yes — добавляет элемент закрывающий крестик.
Добавляет отступы блоку, освобождая место крестика.
Блок при размещении в другом блоке может менять свой внешний вид или поведение.
Пример
Цвет текста вложенного блока меняется с зелёного на красный, если
он помещён в блок с синим фоном с красными буквами.
Примеры
Переключатель языков (b-lang-switcher)
Переключатель языков (b-lang-switcher) в подвале страницы
(b-foot), уменьшается размер шрифта.
Изменения создаются на следующем уровне переопределения и добавляют или изменяют функциональность блока.
Пример
Блок может выглядеть на разных проектах по разному. При этом его общая часть лежит
в одном файле (например, в репозитории фреймворка), а частная для проекта в другом
(в репозитории проекта). Блок доопределяется дополнительными проектными файлами.
TODO: Сделать пример или ссылку на пример.