Якоря

Якорь — стабильный атрибут data-lms на элементе, который человек называет словами: карточка курса, тело урока, шапка кабинета. По нему пишется свой CSS школы:

[data-lms="course-card"] { box-shadow: none; border-radius: 0; }
[data-lms="cabinet-tabbar"] { border-top: 2px solid var(--brand); }

Якорь — обязательство: мы его не переименовываем и не убираем. Вёрстку вокруг него меняем свободно.

Какие якоря есть #

Якорь	Что это	Где
`[data-lms="cabinet-header"]`	Шапка кабинета	Кабинет ученика: полоса со знаком школы, разделами и меню профиля
`[data-lms="cabinet-tabs"]`	Разделы кабинета на компьютере	«Курсы», «Мои покупки», «Поддержка» в шапке
`[data-lms="cabinet-tabbar"]`	Нижняя панель кабинета на телефоне	Кабинет уже 768 точек: разделы значками внизу
`[data-lms="course-card"]`	Карточка курса	Кабинет ученика: «Мои курсы»
`[data-lms="lesson"]`	Урок	Страница урока целиком — заголовок, содержимое, задание
`[data-lms="lesson-body"]`	Содержимое урока	Блоки урока читаемой ширины
`[data-lms="page"]`	Страница школы	Страницы из конструктора: лендинги, оферты, страницы продаж

Список конечный и растёт по правилу «экран, который трогают, получает якоря». Справочник сверяется с кодом при каждой сборке документации: якоря, которого нет в продукте, здесь не будет, и наоборот.

Почему не классы вёрстки #

Разметка собрана из утилитарных классов:

<h3 class="text-body font-medium text-fg">Название курса</h3>

Правило .text-body { font-size: 20px } поменяет размер везде, где встречается этот класс: в карточке курса, в подписи к платежу, в кнопке. А через месяц мы переверстаем карточку, поставим там другой класс — и оформление школы сломается при обновлении, молча: CSS не падает при неверном селекторе, он просто перестаёт применяться.

Поэтому наружу объявлено не то, из чего собрана вёрстка, а то, что мы намеренно сделали контрактом: переменные и якоря.

Атрибут, а не класс — намеренно. Класс можно случайно перебить утилитой и легко спутать со своим; атрибут виден как объявленный контракт и в разметке, и в CSS.

Один якорь — одна роль. Если элемент встречается в двух местах и должен настраиваться по-разному, это два якоря.

Чего якорем не сделать #

Спрятать элемент, у которого нет якоря, «подобранным» селектором технически можно, но это отложенная поломка: при обновлении правило перестанет находить элемент. Нужен якорь — напишите нам, какой элемент и зачем.