Личный кабинет OneBox CRM
Связаться с нами
+38 (067) 328-75-45
+38 (050) 324-46-54
Кабинет клиентаБаза знаний › Просмотр базы знаний

Иконки и ссылки

Стандартный набор иконок

Зачастую просто текстовой ссылки достаточно и необходимо добавить визуальное обозначение того или иного действия. В этой ситуации Вы можете использовать классы иконок представленные ниже.
Они также имеют свои модификаторы, для типа отображения при разных условиях.


<a href="#" class="ob-link-phone">Example link</a>
<a href="#" class="ob-link-email ">Example link</a>
<a href="#" class="ob-link-user">Example link</a>
...
<a href="#" class="ob-link-out">Example link</a>

Пример


Иконки без текста

Есть случаи, когда ссылку нужно представить в виде иконки без описания.
Для отображения иконок без текста необходимо использовать модификатор
ob-icon



<a href="#" class="ob-link-phone ob-icon"></a>
<a href="#" class="ob-link-email ob-icon"></a>
<a href="#" class="ob-link-user ob-icon"></a>
...
<a href="#" class="ob-link-out"></a>

Пример


Блочные ссылки

Блочная ссылка - это ссылка в несколько строк с иконкой, выровненной по первой строке. Для этого используется модификатор
.ob-block

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


<a href="#" class="ob-link-user ob-block">Example link Example link<br /> Example link Example link</a>

Пример


Пунктирные ссылки

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


<a href="#" class="ob-link-dashed">Example link</a>
<a href="#" class="ob-link-dashed ob-link-phone">Example link</a>

Пример