Tooltip

Инициализация

Любому элементу задаем класс tooltip, и data-position для определения позиции показа.
Внутрь элемента tooltip помещаем содержимое.

Позиционирование

top - сверху
bottom - снизу
left - слева
right - справа

Модификаторы

--focus - не скрывает tooltip если убрать курсор с элемента, дает возможность внедрить в tooltip кнопки/ссылки.

Демонстрация

<div class="badge large success hover tooltip" data-position="bottom">
  <i class="icon">account_circle</i>
  <span class="header-management__online-text">69</span>
  <div class="tooltip__wrapper">
    <p class="tooltip__text">Пользователей в сети</p>
  </div>
</div>