Добавление произвольной иконки material design

Здравствуйте.

Я взял ваш стандартный сниппет с иконками и в массив icons добавил 2 иконки ‘wxi-user’ и ‘wxi-account-arrow-down’. Последняя иконка не отображается:

https://snippet.webix.com/vuuqpvm7

Как я понял, по-умолчанию, в webix включены не все иконки. Вы не могли бы показать как добавить произвольную иконку отсюда:

https://materialdesignicons.com/

Загрузив для нее svg-файл. Хотелось бы, чтоб данная иконка подключалась также как и те, которые входят в файлы шрифтов, поставляемые с webix. То есть так как-то так:

<span style='height:23px;padding-right:40px;padding-top:3px;' class='webix_input_icon wxi-account-arrow-left'></span>

Добрый день,

Чтобы добавить произвольную иконку svg, добавьте классу wxi-account-arrow-left псевдоэлемент:before и для него задайте путь к иконке как
content:url("wxi-account-arrow-left.svg"); . Это в случае, если Вы хотите переопределить дефолтную иконку.

Возможно подключение кастомной иконки, подробнее Вы можете почитать тут. Действительно, у нас есть определённый набор иконок, но не все включены. В зависимости от скина, мы берём нужные иконки из fa или mdi.

Nastja, спасибо за ответ. Я читал документацию по приведенной вами ссылке, но из нее мне не все было понятно. В частности, эта фраза:

include the desired font icon pack into HTML page;

Хотел бы уточнить. Иконки, которые включены по-умолчанию, хранятся в виде шрифтов в разных форматах, в частности, svg. Каждая иконка - соответстует коду, который указан в content у стиля. Соответственно, для иконки, которые не включены в шрифты надо создать собственный стиль, например,

wxi-account-arrow-left: before {
  content:url("wxi-account-arrow-left.svg")
}

А файл wxi-account-arrow-left.svg я скачаю с сайта соответствующего шрифта. Так?

Соответственно, для иконки, которые не включены в шрифты надо создать собственный стиль,

Стиль создавать не требуется,Вам следует подключить stylesheet как
<link rel="stylesheet" href="https://cdn.materialdesignicons.com/2.7.94/css/materialdesignicons.css?v=6.1.6" type="text/css" charset="utf-8">

В этом примере сделано подобным образом:
https://docs.webix.com/samples/16_skins/07_icons.html

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