N°9447 - Setup logo is repeating vertically

css/backoffice/components/_title.scss

@@ -51,14 +51,17 @@ $ibo-title--icon-img--size--must-zoomout: $ibo-title--icon-background--size--mus
   width: 100%;
   height: 100%;
   object-position: center;
+  object-fit: $ibo-title--icon-img--size--must-contain;
   background-size: $ibo-title--icon-img--size--must-contain;
 }
 
 .ibo-title--icon-img--must-contain, .ibo-title--icon-background--must-contain { // second class is deprecated, remove it when dealing with N°9317
+  object-fit: $ibo-title--icon-img--size--must-contain;
   background-size: $ibo-title--icon-img--size--must-contain;
 }
 
 .ibo-title--icon-img--must-cover, .ibo-title--icon-background--must-cover { // second class is deprecated, remove it when dealing with N°9317
+  object-fit: $ibo-title--icon-img--size--must-cover;
   background-size: $ibo-title--icon-img--size--must-cover;
 }
 

templates/base/components/title/layout.html.twig

@@ -2,7 +2,9 @@
     <div id="{{ oUIBlock.GetId() }}" class="{{ oUIBlock.GetBlocksInheritanceCSSClassesAsString() }} {{ oUIBlock.GetAdditionalCSSClassesAsString() }} {% if oUIBlock.HasIcon() %}ibo-has-icon{% endif %}{% if oUIBlock.IsHidden() %} ibo-is-hidden{% endif %}" data-role="ibo-title">
         {% if oUIBlock.HasIcon() %}
             <div class="ibo-title--icon">
-                <div class="ibo-title--icon-background ibo-title--icon-background--must-{{ oUIBlock.GetIconCoverMethod() }} ibo-title--icon-level-{{ oUIBlock.GetLevel() }}" style="background-image: url('{{ oUIBlock.GetIconUrl()|raw }}');"></div>
+                <img class="ibo-title--icon-background ibo-title--icon-background--must-{{ oUIBlock.GetIconCoverMethod() }} ibo-title--icon-level-{{ oUIBlock.GetLevel() }}"
+                {% if oUIBlock.HasLazyLoadIcon %} loading="lazy" {% endif %}
+                 data-role="ibo-panel--icon-img" src="{{ oUIBlock.GetIconUrl()|raw }}" alt="" aria-hidden="true"/>
             </div>
         {% endif %}
         <div class="ibo-title--content">

tests/manual-visual-tests/Backoffice/RenderAllUiBlocks.php

@@ -22,6 +22,7 @@
 
 namespace Combodo\iTop\Test\VisualTest\Backoffice;
 
+use Combodo\iTop\Application\Branding;
 use Combodo\iTop\Application\UI\Base\Component\Alert\AlertUIBlockFactory;
 use Combodo\iTop\Application\UI\Base\Component\Button\Button;
 use Combodo\iTop\Application\UI\Base\Component\Button\ButtonUIBlockFactory;
@@ -402,7 +403,8 @@ $oPage->AddUiBlock(TitleUIBlockFactory::MakeNeutral('Title example 1', 1));
 $oPage->AddUiBlock(TitleUIBlockFactory::MakeNeutral('Title example 2', 2));
 $oPage->AddUiBlock(TitleUIBlockFactory::MakeNeutral('Title example 3', 3));
 $oPage->AddUiBlock(TitleUIBlockFactory::MakeNeutral('Title example 4', 4));
-$oPage->AddUiBlock(TitleUIBlockFactory::MakeNeutral('Title example 5', 5));
+$oPage->AddUiBlock(TitleUIBlockFactory::MakeForPageWithIcon('Title example 5', MetaModel::GetClassIcon('Organization', false)));
+$oPage->AddUiBlock(TitleUIBlockFactory::MakeForPageWithIcon('Title example 6', Branding::GetFullMainLogoAbsoluteUrl()));
 
 /////////
 // DataTable