Определение

Overlay (Оверлей) — это компонент наложения, организующий дизайн элементов, которые появляются поверх основного интерфейса, таких как диалоги, меню и т.д.

Функциональность

Важный компонент в дизайн-системе, который используется для создания визуального слоя, накладывающегося на основной контент страницы. Его главная цель — привлечь внимание пользователя к определенному элементу интерфейса или информации, либо временно блокировать доступ к основному контенту для выполнения важного действия.

Чаще всего используется с компонентами Выдвижная панель (Drawer), Боковое меню (Sidebar), Диалоговое окно (Dialog), а также Спиннер (Spinner)

Дизайн и Стиль

Размер и Форма

Overlay не имеет фиксированных размеров, так как растягивается на всю область контента страницы или на выбранный элемент

Вид

Overlay бывает двух видов:

• Dark: используется при открытии компонента Выдвижная панель (Drawer), Боковое меню (Sidebar) или Диалоговое окно (Dialog)

• Light: используется совместно с компонентом Спиннер (Spinner) при загрузке контента.

Цвет и Контраст

Соблюдайте общие цветовые правила дизайн-системы. Палитра Plex отвечает стандартам контрастности WCAG.

Параметры