Кебаб-меню Kebab-menu

Кебаб-меню содержит действия с объектом.

Используйте меню, чтобы сэкономить место и скрыть малоиспользуемые ссылки и действия.

Если действия важны и часто используются, не убирайте их в меню. Пользователь может не найти их. Ему придется постоянно открывать меню, чтобы выполнить действия.

Если одно-два действия важнее и чаще используются — оставьте их рядом с меню.

Показывайте меню на странице постоянно, а не только по наведению.

При клике на меню появляется раскрывающийся список. Направления открывания списка: вправо вниз, влево вниз, вправо вверх, влево вверх. Иконка открытого списка подсвечена серым кругом.

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

Вариант-максимум — при клике правой кнопкой мыши по элементу открывайте кебаб-меню вместо контекстного меню браузера. Меню возникает из того места, куда кликнул пользователь.

При переходе к меню клавишей Tab меню получает фокус — появляется чёрная рамка:

Если нажать клавишу Enter — меню откроется и первый пункт получит фокус:

Клавиши ↓ ↑ переводят фокус между строками списка. Переход между строками не цикличен — с последней строки фокус не переходит на первую, как и с первой на последнюю.

Клавиша Enter выполняет выбранное действие.

Клавиша Esc закрывает меню.

Используйте для меню иконку из библиотеки интерфейсных иконок.

Кебаб-меню может быть трех размеров. Используйте большой кебаб в таблицах и крупных списках.

Маркер наведения — черный круг #000 с прозрачностью 9 %. Прозрачный черный круг одинаково контрастно выглядит на разных фонах.