Popup

Popup – это всплывающий элемент, появляющийся по наведению или по клику на элемент в интерфейсе либо при фокусировании на элементе с помощью клавиатуры. Popup также служит основой для компонента Popover и используется, когда встроенных возможностей компонента Popover недостаточно.

Когда используется Popup

  • Когда во всплывающем элементе содержится действие. В таком случае Popup используется как альтернатива диалоговому окну, если важно не потерять контекст текущей страницы.

    Popup

  • Когда нельзя использовать Popover из-за слишком большого объема содержимого. Например, в подсказке нужно дать более подробную информацию об объекте, включая технические характеристики и детали.

    Popup

Стиль

Цвет и стиль попапа не настраивается. Менять можно лишь его расположение и наличие хвостика:

В тело попапа можно поместить любой контент. В дизайне контента содержимого следует придерживаться базовых отступов компонента Popover и общих гайдлайнов. Старайтесь при этом не перегружать Popup, чтобы он не выглядел громоздким.

Расположение

Popup может располагаться в любом месте в зависимости от компоновки страницы. Важно, чтобы он перекрывал как можно меньше важной информации на странице.

Positioning

НазадPopover
ДалееProgress