На самом деле немного сложная тема. В интернете можно найти только руководство по использованию –
http://bradfrost.com/blog/post/atomic-web-design/, но нет каких-то лучших примеров использования.
Сейчас попытаюсь объяснить принцип.
Ячейка таблицы – атом. Она может описываться, например, что каждая имеет фиксированную ширину, или определённый цвет обводки.
Строчка в таблице – молекула. Она может описываться, например, что каждая может содержать в себе только определённое количество ячеек или что каждая вторая ячейка имеет различный цвет.
Организм это уже целая таблица. Может описываться например, что верхняя ячейка в таблице не имеет верхней границы и т п.
Дальше уже идёт страница. Страница – окружение организма. Описывается, например, что над каждой таблицей должен быть другой организм – поиск или если на странице есть только один параграф текста и таблица, то таблица должна находиться исключительно после этого параграфа.
Чтобы детальнее понять и объяснить как эта штука работает, мне необходимо применить это на практике на каком-то большом-большом проекте. Очень хотелось бы чтобы такая возможность появилась, потому что я помешан на упорядочивании всего что вижу.