Where can I find a list of icons used by Discourse?

Поддержка
1

In the sample “new like icon” repo, we see:

<script type="text/discourse-plugin" version="0.8">
      api.replaceIcon('d-liked', 'thumbs-up');
      api.replaceIcon('d-unliked', 'thumbs-o-up');
      api.replaceIcon('notification.liked', 'thumbs-o-up');
      api.replaceIcon('notification.liked_2', 'thumbs-o-up');
      api.replaceIcon('notification.liked_many', 'thumbs-o-up');
      api.replaceIcon('heart', 'thumbs-up');
</script>

I don’t know that I’d have guessed to replace notification.liked_many_2

Where could we see a list of all the icons in use by discourse?

2

This should be what you are looking for:

https://github.com/discourse/discourse/blob/main/app/assets/javascripts/discourse-common/addon/lib/icon-library.js

3

I was trying to replace an icon over in this topic: How to replace an icon using CSS

The icon in question was .d-icon-lock, but I don’t see it in the list above. Where would I find the icon, so I know what to target in the api.replaceIcon above?

4

In this case you would just use the FA icon name:

<script type="text/discourse-plugin" version="0.8">
  api.replaceIcon('lock', 'times-circle');
</script>
5

I see. I guess I was asking for a list of all icons… perhaps searching the source for {d-icon ' is what I’m looking for.

6

У меня тот же вопрос, и ссылка выше не работает. Я поискал и пробежался по этой теме: Introducing Font Awesome 5 and SVG icons, но, к сожалению, не нашёл списка, чтобы узнать, входит ли иконка в базовый набор или нет. Других связанных результатов поиска на форуме тоже не нашёл.

7

Discourse использует бесплатные иконки Font Awesome. Все доступные для использования иконки можно найти здесь. Возможно, вам потребуется добавить некоторые иконки в подмножество SVG-иконок в настройках сайта. Вы можете посмотреть, какие иконки есть на вашем сайте, добавив к URL путь /styleguide/atoms/icons. Если эта страница не отображается, пожалуйста, проверьте, включена ли опция styleguide enabled в настройках сайта.

Если вы хотите получить доступ к платным иконкам, вам нужно установить плагин Discourse FontAwesome Pro.

8

https://meta.discourse.org/styleguide/atoms/icons

У вас на форуме тоже есть это. Возможно, вам нужно включить плагин.

9

Спасибо @ondrej и @pfaffman! Я уже знаком с использованием Font Awesome и знал, что, возможно, потребуется добавить некоторые новые иконки, поэтому мне было важно узнать, что уже включено. Ссылки на плагины Meta и Styleguide очень полезны. Всё ещё немного затрудняюсь понять, как добавлять новые иконки в некоторых (хотя странно, но не во всех) случаях, но я создам отдельную тему/ответ по этому поводу. :wink: