Theming 3rd party menu items

Problem/Motivation

We have tried many such 'floating' local task modules and we always seem to hit the same problem — theming new icons is never straight-forward.

In fact, we can't work out how to theme these at all - they all just end up with the default 'eye'.

How should we theme in our own SVG icons?

When using a rival such as Sticky Local Tasks → we have to resort to some quite hacky CSS like this because we cannot get a hold of each item easily so are forced to theme then according to their relative position in nav…

The 'Entity Copy with Reference' module...

<li class="nav-item">
  <a href="/node/8689/copy" class="nav-link">
    <span>Copy</span>
    <i class="nav-link__icon"></i>
  </a>
</li>

The 'Entity Usage' module...

<li class="nav-item">
  <a href="/node/8689/usage" class="nav-link">
    <span>Usage</span>
    <i class="nav-link__icon"></i>
  </a>
</li>

Might it not be a whole easier for site builders if you could provide a UI where they can upload their SVGs against all possible Tasks thus overriding the default as and when they want to?

Thank you