Дизайн в БАРС Груп

Определение

Sidebar & Submenu item (Разделы меню) — это отдельные пункты меню, которые отображаются в Боковой панели (Sidebar). Эти элементы служат для навигации и предоставляют доступ к различным разделам или функциям внутри системы или сайта.

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

Каждый пункт ведет к определенной странице или разделу. Они помогают пользователям быстро перемещаться по интерфейсу.

В некоторых случаях Sidebar items могут иметь вложенные меню (Submenu), что позволяет организовать содержимое в виде более глубоких уровней навигации.

В некоторых случаях Submenu item тоже могут иметь вложенность.

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

Размер и Тип

Sidebar & Submenu item имеют 2 основных размера, которые выбираются в зависимости от контекста использования:

M – 32px
L — 40px

Основное отличие Sidebar item от Submenu item в том, что Sidebar item имеет жирный текст для определения первоуровневых пунктов меню.

Для указания количества объектов в компоненте, можно включить параметр Бейдж счетчик (Badge Counter) например, для указания присланных уведомлений.

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

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

Текст и иконки

Краткость текста

Текст компонента должен быть понятным и лаконичным.

Иконки (по необходимости)

Если компонент Sidebar всегда отображается в развернутом виде и не предусматривает возможность сворачивания, иконки можно убрать через параметр Left icon?.
Это помогает сделать интерфейс более чистым и минималистичным, особенно если контекст использования не требует дополнительных визуальных указателей.

Избегайте смешивания пунктов меню, которые содержат иконки, с теми, у которых их нет.

Если пункт меню содержит вложенные подразделы, то рядом с ним отображается стрелка, указывающая на наличие вложений. Эта стрелка помогает пользователю понять, что пункт можно развернуть для доступа к дополнительным опциям. Если вложенные разделы не предусмотрены, стрелка не отображаются, выключить ее можно через параметр Right icon?