Add provider logo to settings and overview

We will provide logo, preferably as svg, by annotation. The preferred aspect ratio is wide due to the overview output.
The test translator will also provide one to test cover it.
Neither XLIFF nor Local / Drupal translator will have a logo.

Here is how looks like:

Did the proposed changes and added test.

Now looks like this:

Created all the followup's:
thebigword: #2717311: Add logo to provider overview
oht: #2717295: Add logo to provider overview
gengo: #2717289: Add logo to provider overview
google: #2717283: Add logo to provider overview
microsoft: #2717233: Add logo to provider overview

@Miro: We enforce that the svg has to be within the module that provides the plugin. So we can't use one from core.

1. +++ b/src/Entity/ListBuilder/TranslatorListBuilder.php
   @@ -80,7 +80,8 @@ class TranslatorListBuilder extends DraggableListBuilder implements EntityListBu
   +    $header['logo'] = t('Logo');
   

   What about, instead of naming this "Logo", we name this column "Provider" and fall back to just the label if nothing is provided?

   I guess the text only versions would be weird by default as they'd duplicate the text. So even without text fallback Provider as label might make more sense?

   Miro proposed no label at all, not sure about that. Could work if can combine the two columns together?

2. +++ b/src/Entity/ListBuilder/TranslatorListBuilder.php
   @@ -105,13 +106,37 @@ class TranslatorListBuilder extends DraggableListBuilder implements EntityListBu
   +        '#type' => 'inline_template',
   +        '#template' => '<img class="tmgmt-logo-overview" src="{{ icon }}" title="{{ label }}" alt="{{ label }}"/>',
   +        '#context' => [
   +          'icon' => file_create_url(drupal_get_path('module', $definition['provider']) . $definition['logo']),
   

   Why not use #theme image for this?

3. +++ b/src/Entity/ListBuilder/TranslatorListBuilder.php
   @@ -105,13 +106,37 @@ class TranslatorListBuilder extends DraggableListBuilder implements EntityListBu
   +          'label' => t('@provider logo', ['@provider' => $entity->label()]),
   

   Iagree with Miro that it should be the plugin label.

   Also, below you removed logo, I think that should also be done here?

4. +++ b/tmgmt_test/src/Plugin/tmgmt/Translator/TestTranslator.php
   @@ -27,7 +27,8 @@ use Drupal\tmgmt\TranslatorRejectDataInterface;
   + *   logo = "/icons/tmgmt_test.svg",
   

   Leading / usually implies an absolute path, I think those things are usually specified without and the / is added in the code that adds it.

   theoretically, we could use the / to indicate an absolute path outside the module but I don't think that supporting the code for that is worth it, not if the only use case is the test plugin.

Done as discussed.

It seems the icons are a bit off-center in the providers list. Should be one extra line in css.

Yes, you are right looks better now:

I forgot about that sorry.
Testing again manually I fixed other things, like add the slash now that we don't want it in the definition of the provider.
Also fixed the CSS, is not the best solution, as is not really how I would like it to behave, but the proper solution would be add something like the EQCSS, or maybe add this directly to core as this could be needed in a lot of places like #2696933: Content overflow issue, and also could make things cleaner and easier in a lot of places.

I like this css approach, we should also consider open a core issue related with that #2696933: Content overflow issue

Also, AFAIK we discussed showing it on the job checkout settings as well at some point? As a translation service provider, that's where I wanted my logo to be visible.. in a place that users will actually see when doing translations.

Added the new icon in the checkout form.
Also considering that in the settings box we can not know what is inside we agreed to move the logo outside, as we can control how it looks there.
And finally the icons looks good and are responsible.
Thanks @yongt9412 for the tips with CSS.

Here some screenshots:

You are right, it works without the !important.

Committed including all logos.

Now committed correctly. Also this wasn't really a meta, just had related issues. metas usually don't have a patch on their own.