Иконки Font Awesome для UIkit 3

Дело было вечером, делать было не чего. Ну или почти так, ведь был день и заняться было чем. Но в тот момент мне жутко захотелось сделать большой набор иконок для UIkit3. Причина в этом проста, набор иконок у UIkit 3 очень скуден, и его явно не хватит для большого проекта и, хотя их, когда ни будь дополнять, ждать этого нет смысла, ну и добавлять иконки в UIkit3 относительно просто. Так вот и решил сделать этот набор.

Создание

Не особо долго думая выбор пал на Font Awesome. Во-первых, потому что набор по количеству иконок не маленький, во-вторых. Это один из самых распространённых иконочных шрифтов.

Первая проблема, с которой я столкнул это где достать иконки svg, да еще и размером 20x20. Все что удалось найти это были либо огромные иконки исходники, либо уже маленькие всего 14px.

На помощь с этой проблемой пришел сервис icomoon залив, импортировав туда иконки и изменив параметры экспорта я получил практически чистые иконки в размере 20x20.

Вторая проблема была в том, как же эти иконки засунуть в скрипт. Можно конечно скачать репозиторий и скомпилировать их через uikit. Но дефолтный компилятор ни лишнее не вычешет, да и код делает мягко говоря мало читаемым, ну и танцы с бубном на тему куда же пихать иконки, мне еще при первых потугах использования костюмных иконок надоели. Поэтому я, не особо долго думая и проведя некоторые манипуляции со своим IDE написал свой мини компилятор. Ну а то что именно я сделал, пусть останется тайной.

Так или иначе все после некоторых правок, я получил полностью готовый набор иконок Font Awesome для UIkit 3.

Использование

Использовать иконки очень просто.

Скачиваем последнюю версию с моего GitHub
Подключаем скрипт uikit-fa-icons.min.js к сайту после подключения uikit.min.js
Используем на сайте так же, как и стандартные иконки uikit через дата атрибут data-uk-icon="icon: fa-address-book-o"

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