Навык

Better Layout

Выстраивайте структуру, интервалы и визуальную иерархию

Установка

https://github.com/jakubkrehel/skills/tree/main/skills/better-layout

Условия запуска

When structuring page layouts, reviewing component spacing, or validating alignment across responsive breakpoints.

Автор: jakubkrehel

Репозиторийhttps://github.com/jakubkrehel/skills

Расположение и интервалы задают иерархию интерфейса еще до применения визуальных стилей. Этот навык формирует структурную основу и проверяет ее при изменении размеров, локализации и переходе на RTL.

Основные возможности

Система интервалов: иерархически группирует содержимое с единообразными отступами — 8 px внутри групп и 16 px между ними.
Строгое выравнивание: сохраняет единые границы элементов и снижает визуальный шум.
Проектирование интерактивных элементов: обеспечивает визуальное отличие элементов управления от статичного содержимого.
Постепенное раскрытие: проверяет наличие видимых индикаторов, позволяющих обнаружить скрытое содержимое.
Поток содержимого: согласует макеты с естественным направлением чтения — сверху вниз и от начального края к конечному.

Используйте навык при структурировании страниц, проверке макетов компонентов и настройке интервалов на разных адаптивных контрольных точках. Устанавливается как Agent Skill для Claude Code.