Replace library of programming language icons

[ushachev]

Fixes #1685

Заменён иконочный шрифт Mfizz на предложенную в ишью Реакт-обёртку над иконкамии проекта Devicon.
API простой и удобный. Насколько удалось проверить в десктопных Chrome/Firefox и мобильном Safari, отображение иконок идентичное

Было/стало

Было

Стало

Для 5 языков (Elixir, Kotlin, Php, Python, Ruby) пришлось создать собственные компоненты-иконки. Их использование напрямую из библиотеки react-devicons оказалось проблематичным. В них заливка элементов в SVG разметке сделана не однородным цветом, а градиентом.
Примерно так

<linearGradient id="ruby-original-a" ...>
  ...
</linearGradient>
<path fill="url(#ruby-original-a)" .../>

Если на странице использовано несколько одинаковых иконок и при этом первая иконка оказывается в блоке, который скрыт применением к нему CSS правила display: none, то остальные иконки оказываются обесцвечены. На применении display: none реализована работа, например, табов в Bootstrap. Если бы каждая из одинаковых иконок обладала уникальными id для градиентов, то проблемы бы не было, но такой механизм не предусмотрен в react-devicons. Хорошо, что эта задача решается Babel-плагином babel-plugin-react-inline-svg-unique-id

Размеры иконок подобраны чтобы выглядели сбалансированно относительно друг-друга. За исходный размер приняты Ruby и Kotlin

Доработки:

• улучшен компонент UserName, убрана избыточная "семантическая" разметка

• улучшен компонент ResultIcon, его использование стало более "прямолинейным" без лишних пропсов. Возвращает только соответствующую результату иконку, без "пустой" иконки. Выравнивание контента для случая отсутствующей иконки результата - это ответственность вызывающего кода, теперь для этого достаточно отступа вместо громоздкой svg-разметки

  Было/стало

  Было

  

  Стало
  

[ReDBrother]

За UserName отдельный респект)

[ReDBrother]

Там с точки зрения производительности не очень все классно выходит, все же хотелось держать отдельным svg иконками, которые можно будет пережать и положить в отдельные региональные хранилища, но это уберу в свой давний долг по полному ревью производительности приложения)