Категории
Уведомление: Заходите к нам в Telegram-чат
Skripters » XenForo » Iconify integration 0.0.3

Iconify integration 0.0.3 — скачать бесплатно

SaNcHeS
Опубликовано 5-02-2021, 13:55
  • Iconify integration 0.0.3 Изображение: 1
  • Iconify integration 0.0.3 Изображение: 2
  • Iconify integration 0.0.3 Изображение: 3
  • Iconify integration 0.0.3 Изображение: 4
  • Iconify integration 0.0.3 Изображение: 5

Это дополнение для дизайнеров стилей и разработчиков дополнений.

Важно: это дополнение еще не готово к использованию в продакшене. Это ранняя версия, которая может (и, вероятно, содержит) ошибки. Он был разработан для XenForo 2.1, хотя он должен работать и с XenForo 2.0.

Он добавляет поддержку Iconify, предлагая более 30 000 иконок на выбор. Иконки могут использоваться для значков узлов, навигации или всего, что может придумать автор надстройки или стиля (требуется создание надстройки, которая зависит от этой надстройки). Авторы больше не ограничены использованием иконок FontAwesome.

Чтобы добавить иконку в шаблон, нет ничего сложного. Все, что вам нужно сделать, это написать Iconify заполнитель кода, как это:








HTML: Скопировать


<iconify-icon data-icon = "mdi: home"> </ iconify-icon>

или же








HTML: Скопировать


<span class = "iconify" data-icon = "mdi: home"> </ span>


How to use Iconify in pages • Iconify Documentation -> Документация.

Размеры иконок можно изменить с помощью изменения размера шрифта или добавив атрибуты data-width / data-height

Transformations • Iconify Documentation Custom dimensions and alignment • Iconify Documentation

Как использовать иконки в шаблонах

После того, как вы создали новое свойство стиля или настройку. Важно : значки не предназначены для CSS, их следует использовать только в шаблонах HTML.

Чтобы добавить значок, вам нужно использовать тег шаблона «icon» или «inlineicon» XenForo:









Код: Скопировать


<xf:icon value="{$xf.options.text_test_option}" />

<xf:inlineicon value="{$xf.options.text_test_option}" />

<xf:icon value="{{ property('iconify_required_prop') }}" />

<xf:inlineicon value="{{ property('iconify_required_prop') }}" /><br />


В чем разница между «icon» и «inlineicon»? Тег «icon» ведет себя как изображение, поэтому он предназначен для оформления. «inlineicon» ведет себя как текст, поэтому он предназначен для использования внутри текста.










Inline vs block • Iconify Documentation











iconify.design





Создание пользовательских переменных

Что если вы хотите создать пользовательскую переменную вместо настройки или свойства стиля? Вы тоже можете это сделать.

Это дополнение добавляет еще 2 тега:








Код: Скопировать


xf:iconbox
xf:iconboxrow
Понравилось?
0
0
0

Скачать Iconify integration 0.0.3:

Iconify integration 0.0.3 Размер файла: 66.24 Kb
18
0