Николай Марченко: 350 да. Таск свой функционал выполнят стабильно, но рефакторить надо, конечно. Можно сократить на 100 точно. И еще 50 занимает парсинг — там разметка.
Нет, он очень большой — 350 строк)
Что котнкретно интересует? Тут же достаточно все просто:
0 Пишем алгоритм сетки для спрайтов
1 Берем SVG иконки, клеим из них спрайт
2 Чистим его от ненужных символов
3 Разбиваем SVG на разные размеры (опционально, у вас может быть один размер) и красим их, что бы сделать из них цветные спрайты
4 Растеризуем раскрашенное SVG
5 Клеим PNG спрайты. На этом этапе генерируем CSS правила
6 Сжимаем полученные спрайты
6 Конкатенируем CSS
7 Чистим все временные папки из пунктов 3, 4, 5
8 парсим на страницу (Опционально)
Нужно просто время и необходимость, что бы написать это. Как впрочем и во всем)
Николай Марченко: в нашем случае :hover на обертке svg, а у svg fill: inherit;. Это универсальнее и удобнее. Вы можете прописать модификаторы для класса-обертки и использовать их для разных кейсов: в кнопке, ссылке и т.д.
png спрайты для старых браузеров. Вам это может не понадобиться, если разработка ведется, например под >ie9
Написано
Войдите на сайт
Чтобы задать вопрос и получить на него квалифицированный ответ.
https://events.yandex.ru/lib/talks/2234/