fix Ryan review

Author: WebMamba

src/TwigComponent/doc/index.rst

@@ -842,28 +842,14 @@ The ``with`` data is what's mounted on the component object.
     Embedded components *cannot* currently be used with LiveComponents.
 
 Component HTML Syntax
------------------
+---------------------
 
-.. versionadded:: 2.9
+.. versionadded:: 2.8
 
     This syntax was been introduced in 2.8 and is still experimental: it may change in the future.
 
 Twig Components come with an HTML-like syntax to ease the readability of your template:
 
-.. code-block:: html+twig
-
-    {# templates/some_page.html.twig #}
-    <twig:Alert warning :user="user.username" message="I am an alert!">
-       <div class="alert-content">
-            // ... your component content
-       </div>
-       <twig:block name="footer">
-            // ... footer content
-       </twig:block>
-    </twig:Alert>
-    
-You can now use a custom tag prefix starting by <twig: and your component name
-
 .. code-block:: html+twig
 
     <twig:Alert></:Alert>
@@ -874,25 +860,9 @@ You can pass props to your component by using HTML attributes. Suppose you have
 
 .. code-block:: html+twig
 
-    // "warning" property will be set to true
-    <twig:Alert warning></:Alert>
-    
-    <twig:Alert message="hello" :user="user"/>
-    
-    //camel camelCase works too for your properties names
-    <twig:Alert withActions message="hello" :user="user" />
-    
-And then as usual you can access your properties in your component template
-
-.. code-block:: html+twig
-
-    {# templates/components/Alert.html.twig #}
-    
-    <div class={{ warnings ? 'warnings' : 'success' }}>
-        <p>{{ message }}</p>
-        ...
-    </div>
-    
+    // "withActions" property will be set to true
+    <twig:Alert withActions message="hello"></:Alert>
+        
 You can add the ':' prefix to your attribute to indicate that the value 
 should be compiled by Twig
 
@@ -901,32 +871,11 @@ should be compiled by Twig
     <twig:Alert message="hello" :user="user.id"/>
 
     // equal to
-    
     <twig:Alert message="hello" user="{{ user.id }}"/>
 
     // and pass object, or table, or anything you imagine
     <twig:Alert :foo="['col' => ['foo', 'oof']]"/>
 
-This syntax also allows passing content to blocks:
-
-.. code-block:: html+twig
-    
-    <twig:Alert message="hello" :user="user.id">
-        <twig:block name="footer">
-            ...
-        </twig:block>
-    </twig:Alert>
-    
-And in your component template you can access your embedded block
-
-.. code-block:: html+twig
-    
-    <div class="content">
-         {% block footer %}
-            ...
-         {% block footer %}
-     </div>
-
 You can pass content directly inside your component.
 
 .. code-block:: html+twig
@@ -949,6 +898,26 @@ Then in your component template, This becomes a block called content:
          {% block footer %}
             ...
          {% block footer %}
+     </div>    
+    
+In addition to the default block, you can also add named blocks:
+
+.. code-block:: html+twig
+    
+    <twig:Alert message="hello" :user="user.id">
+        <twig:block name="footer">
+            ...
+        </twig:block>
+    </twig:Alert>
+    
+And in your component template you can access your embedded block
+
+.. code-block:: html+twig
+    
+    <div class="content">
+         {% block footer %}
+            ...
+         {% block footer %}
      </div>