Своё оформление
Всё, что проект хочет изменить — правило, файл статики, палитру, — он меняет штатно, не трогая библиотеку. Здесь три таких пути, от лёгкого к сильному.
Свой акцент#
Самое лёгкое — задать акцент. Вся схема Material выводится из него на сервере: primary, контейнеры, поверхности с его оттенком, тёмная тема. Акцент по умолчанию инсталляция даёт контрактом ОформлениеИнсталляции, посетитель — своей cookie.
Функция Оформление() Экспорт
Возврат Новый Структура("Тема, Акцент", "светлая", "#00639b");
КонецФункции
Попробуйте прямо здесь: цвет уйдёт в cookie сайта, и документация перекрасится вся, без перезагрузки страницы. Форма помечена признаком тихой отправки: палитру по новому акценту считает сервер, а скрипт кита подменяет блок токенов в голове страницы.
Подробнее о ролях и о том, почему любой акцент остаётся читаемым, — на странице Цвет и тема.
Свой лист стилей#
Лист инсталляции встаёт вторым в каскаде, после базового листа кита. Поэтому её правило той же специфичности побеждает без !important. Адрес листа даёт обрамление полем АдресСтилей.
/* ромашка.css — лист инсталляции */
.brand { font-weight: 700; }
.card { border-radius: var(--md-sys-shape-corner-large); }
Пишите правила токенами: var(--md-sys-color-primary) вместо #6750a4. Тогда правило переключится вместе с темой и акцентом. Прежние имена --color-*, --space-*, --radius-* тоже работают — это псевдонимы ролей Material.
Свой файл вместо файла кита#
Раскладка статики кладёт файлы инсталляции поверх файлов кита: файл, объявленный под именем китового, вытесняет его целиком. Так подменяют то, что кит отдаёт по адресу /static: базовый лист, скрипт, значок провайдера входа.
Функция Файлы() Экспорт
Результат = Новый Соответствие();
// свой значок входа через GitHub вместо значка кита
Результат.Вставить("github.svg", Новый Структура("Подкаталог, ТипКонтента", "значки", "image/svg+xml"));
Возврат Результат;
КонецФункции
Глифы интерфейса так не подменяются: их кит вставляет прямо в разметку из своего каталога глифов, а не отдаёт файлами. Нужен новый глиф — его кладут в сам кит, см. Иконки.
Адрес каждого файла несёт отпечаток содержимого, например /static/oscript-ui-6f6f40e195011e44.css. Правка файла меняет адрес сама, поэтому файлы кэшируются навсегда, а «правки без сброса кэша» не бывает.
Плотность и радиус#
Оформление посетителя несёт ещё два множителя от 0,5 до 2. Плотность умножает шаг сетки, радиус — шкалу скруглений. Пилюля остаётся пилюлей при любом радиусе. Множители приходят из cookie посетителя; контракт инсталляции задаёт только тему и акцент.
Гайдлайны#
- Меняйте акцент, а не роли по одной: схема из одной затравки держит контраст всех пар, ручная правка одной роли — нет.
- Не пишите цвет литералом в своём листе: он не переключится вместе с темой.
- Не перебивайте правила кита через
!important: лист инсталляции и так стоит вторым.