[TASK] Add custom icon example inside the `styleguide` infobox examples

This adds an example on how to use a custom icon inside the Infobox Fluid-Viewhelper.

Resolves: #104123
Releases: main
Change-Id: Ie1fd9f2c13fb426f7c3d3243fe29ebcc8921f046
Reviewed-on: https://review.typo3.org/c/Packages/TYPO3.CMS/+/84929


Tested-by: Stefan Bürk <stefan@buerk.tech>
Tested-by: core-ci <typo3@b13.com>
Reviewed-by: Oliver Bartsch <bo@cedev.de>
Reviewed-by: Stefan Bürk <stefan@buerk.tech>
Tested-by: Oliver Bartsch <bo@cedev.de>

typo3/sysext/styleguide/Resources/Private/Templates/Backend/Infobox.html

@@ -15,15 +15,31 @@
 
         <p>Is a fluid based widget for the backend that can be inserted as view helper.</p>
 
-        <h2>Optional icon</h2>
+        <h2>Default icon</h2>
 
         <div class="example">
             <f:be.infobox title="Infobox with default icon">Your infobox content</f:be.infobox>
+        </div>
+
+        <div class="example code"><pre><code class="language-html">&lt;f:be.infobox title="Infobox with default icon"&gt;Your infobox content&lt;/f:be.infobox&gt;</code></pre></div>
+
+        <h2>Without icon</h2>
+
+        <div class="example">
             <f:be.infobox title="Infobox without icon" disableIcon="TRUE">Your infobox content</f:be.infobox>
         </div>
 
-        <div class="example code"><pre><code class="language-html">&lt;f:be.infobox title="Infobox with default icon"&gt;Your infobox content&lt;/f:be.infobox&gt;
-    &lt;f:be.infobox title="Infobox without icon" disableIcon="TRUE"&gt;Your infobox content&lt;/f:be.infobox&gt;</code></pre></div>
+        <div class="example code"><pre><code class="language-html">&lt;f:be.infobox title="Infobox without icon" disableIcon="TRUE"&gt;Your infobox content&lt;/f:be.infobox&gt;</code></pre></div>
+
+        <h2>Custom icon</h2>
+
+        <p>It is also possible to use a custom icon. Just pass the icon identifier as <strong>iconName</strong> to the view helper. <strong>The identifier must be registered in your TYPO3 installation.</strong></p>
+
+        <div class="example">
+            <f:be.infobox title="Infobox with a save icon" iconName="actions-save">Your infobox content</f:be.infobox>
+        </div>
+
+        <div class="example code"><pre><code class="language-html">&lt;f:be.infobox title="Infobox with a save icon" iconName="actions-save"&gt;Your infobox content&lt;/f:be.infobox&gt;</code></pre></div>
 
         <h2>Levels</h2>