Docusaurus: Using icons in the navigation bar

[awibox]

I want to use icons in navbar as in the screenshot:

Is this possible with docusaurus v2?
If not, how difficult is it to implement it?

[sserrata]

Hi @awibox - it should be possible to swizzle and customize the Navbar component to add icon menu items. I can't speak to the difficulty level but my suggestion would be to wrap the icons in an Infima avatar, minus the additional text: https://facebookincubator.github.io/infima/docs/components/avatar#horizontal

Basically, add something like this to your custom Navbar component:

<div class="avatar">
  <a
    class="avatar__photo-link avatar__photo avatar__photo--sm"
    href="https://example.com"
  >
    <img
      alt="Your Alt"
      src="your/icon/path"
    />
  </a>
</div>

[lex111]

In the upcoming version of D2, it will be possible to specify a custom CSS class for any navbar item.
I think this is enough to styling a navbar item in such a way as to add an icon.
As example, you can go to v2 website, it now uses the GH icon instead of text.

[yangshun]

Let's add some examples for this to the docs if possible.