Update the style of versionadded and deprecated admonitions

Author: javiereguiluz

src/Directive/DeprecatedDirective.php

@@ -23,12 +23,15 @@ public function getName(): string
     public function processSub(Parser $parser, ?Node $document, string $variable, string $data, array $options): ?Node
     {
         $wrapperDiv = $parser->renderTemplate(
-            'directives/deprecated.html.twig',
+            'directives/admonition.html.twig',
             [
+                'name' => 'deprecated',
+                'text' => $data,
+                'class' => $options['class'] ?? null,
                 'version' => $data,
             ]
         );
 
-        return $parser->getNodeFactory()->createWrapperNode($document, $wrapperDiv, '</div></div>');
+        return $parser->getNodeFactory()->createWrapperNode($document, $wrapperDiv, '</div>');
     }
 }

src/Directive/VersionAddedDirective.php

@@ -26,7 +26,7 @@ public function processSub(Parser $parser, ?Node $document, string $variable, st
             'directives/admonition.html.twig',
             [
                 'name' => 'versionadded',
-                'text' => sprintf('New in version %s', $data),
+                'text' => $data,
                 'class' => $options['class'] ?? null,
                 'version' => $data,
             ]

src/Templates/default/html/directives/admonition.html.twig

@@ -9,8 +9,8 @@
             <svg xmlns="http://www.w3.org/2000/svg" fill="none" width="24" height="24" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z" /></svg>
         {% elseif name in ['caution', 'danger', 'error'] %}
             <svg xmlns="http://www.w3.org/2000/svg" fill="none" width="24" height="24" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" /></svg>
-        {% elseif name in ['versionadded'] %}
-            <svg xmlns="http://www.w3.org/2000/svg" fill="none" width="24" height="24" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 20H5a2 2 0 01-2-2V6a2 2 0 012-2h10a2 2 0 012 2v1m2 13a2 2 0 01-2-2V7m2 13a2 2 0 002-2V9a2 2 0 00-2-2h-2m-4-3H9M7 16h6M7 8h6v4H7V8z"></path></svg>
+        {% elseif name in ['versionadded', 'deprecated'] %}
+            {# don't show an icon for these directives #}
         {% elseif name in ['seealso'] %}
             <svg xmlns="http://www.w3.org/2000/svg" fill="none" width="24" height="24" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13.828 10.172a4 4 0 00-5.656 0l-4 4a4 4 0 105.656 5.656l1.102-1.101m-.758-4.899a4 4 0 005.656 0l4-4a4 4 0 00-5.656-5.656l-1.1 1.1" /></svg>
         {% elseif name in ['screencast'] %}

src/Templates/default/html/directives/deprecated.html.twig

@@ -180,6 +180,10 @@ public function parserUnitBlockProvider()
             'blockName' => 'directives/best-practice',
         ];
 
+        yield 'deprecated' => [
+            'blockName' => 'directives/deprecated',
+        ];
+
         yield 'versionadded' => [
             'blockName' => 'directives/versionadded',
         ];

tests/IntegrationTest.php

@@ -0,0 +1,4 @@
+<div class="admonition admonition-deprecated ">
+    <p class="admonition-title"><span>5.4</span></p>
+    <p>The <code translate="no" class="notranslate">foobar</code> option is deprecated since Symfony 5.4. Use <code translate="no" class="notranslate">barfoo</code> instead.</p>
+</div>

tests/fixtures/expected/blocks/directives/deprecated.html

@@ -1,9 +1,4 @@
 <div class="admonition admonition-versionadded ">
-<p class="admonition-title">
-    <svg xmlns="http://www.w3.org/2000/svg" fill="none" width="24" height="24" viewbox="0 0 24 24" stroke="currentColor">
-        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 20H5a2 2 0 01-2-2V6a2 2 0 012-2h10a2 2 0 012 2v1m2 13a2 2 0 01-2-2V7m2 13a2 2 0 002-2V9a2 2 0 00-2-2h-2m-4-3H9M7 16h6M7 8h6v4H7V8z"></path>
-    </svg>
-    <span>New in version 4.1</span>
-
-</p>
-<p>This option was introduced in Symfony 2.6 and replaces another option, which is available prior to 2.6.</p>
+<p class="admonition-title"><span>4.1</span></p>
+<p>The <code translate="no" class="notranslate">foobar</code> option was introduced in Symfony 4.1.</p>
+</div>

tests/fixtures/expected/blocks/directives/versionadded.html

@@ -24,6 +24,7 @@
 </table>
 </div>
 
+<div class="table-wrapper">
 <table>
     <thead>
         <tr>
@@ -42,7 +43,9 @@
         </tr>
     </tbody>
 </table>
+</div>
 
+<div class="table-wrapper">
 <table>
     <thead>
         <tr>
@@ -61,6 +64,7 @@
         </tr>
     </tbody>
 </table>
+</div>
 
 <p>Simple table headless:</p>
 
@@ -81,6 +85,7 @@
 </table>
 </div>
 
+<div class="table-wrapper">
 <table>
     <tbody>
         <tr>
@@ -93,6 +98,7 @@
         </tr>
     </tbody>
 </table>
+</div>
 
 <p>Grid table:</p>
 

tests/fixtures/expected/blocks/nodes/tables.html

@@ -0,0 +1,4 @@
+
+.. deprecated:: 5.4
+
+    The ``foobar`` option is deprecated since Symfony 5.4. Use ``barfoo`` instead.

tests/fixtures/source/blocks/directives/deprecated.rst

@@ -1,3 +1,4 @@
 
 .. versionadded:: 4.1
-    This option was introduced in Symfony 2.6 and replaces another option, which is available prior to 2.6.
+
+    The ``foobar`` option was introduced in Symfony 4.1.