Hint
Last updated
Was this helpful?
Last updated
Was this helpful?
Хинт — это подсказка, появляющаяся при наведении на элемент.
Контейнер хинта
Текст / подсказка
Используются в элементах не вмещающих полный текст или требующих небольшого пояснения. Например: в иконках без текста, в инпутах, оверлей-меню и т.д.
Хинт появляется при наведении курсора на элемент, с задержкой в 400 миллисекунд.
Исчезает хинт мгновенно, как только курсор «уйдет» с элемента. Хинт исчезает и в том случае, если после его появления прокрутить страницу.
Текст хинта — максимально короткий, рекомендуется не больее 160 символов с пробелами
Не рекомендуется для показа инструкции или описания
Не дублируйте название объекта в хинте, за исключением случаев, когда оно не умещается в видимую область.
Текст выравнивается по левому краю.
Могут варьироваться до 60% от высоты и ширины экрана.
Внутренние падинги - 8рх.
По умолчанию хинты появляются непосредственно над вызываемым элементом.
Если сверху нет места – под элементом:
Также хинт может появляться справа или слева, в зависимости от расположения вызываемого элемента и наличия пространства на экране.
Всплывающие подсказки не должны выходить за пределы страницы или перекрывать контент связанный с вызываемым элементом.
Расстояние от вызываемого элемента до хинта 8рх.
Сам хинт центрируется относительно вызываемого элемента:
Если вызываемый элемент находится с края экрана, а слева или справа находятся другие важные элементы или контент, хинт выводится также снизу и выравнивается по правой или левой стороне элемента, в зависимости от его расположения:
