Added help for extended experimental usages

Author: linkdotnet

LinkDotNet.Blog.Web/Shared/Admin/CreateNewBlogPost.razor

@@ -15,10 +15,12 @@
             <div class="mb-3">
                 <label for="short">Short Description</label>
                 <InputTextArea class="form-control" id="short" @bind-Value="model.ShortDescription" rows="4"/>
+                <small id="short" class="form-text text-muted">You can use markdown to style your component.</small>
             </div>
             <div class="mb-3">
                 <label for="content">Content</label>
                 <InputTextArea class="form-control" id="content" @bind-Value="model.Content" rows="10" />
+                <small id="content" class="form-text text-muted">You can use markdown to style your component. Additional features are listed <a @onclick="@(() => FeatureDialog.Open())">here</a></small>
                 @* <small id="content" class="form-text text-muted">Drag and drop images to upload and insert picture.</small> *@
             </div>
             <div class="mb-3">
@@ -59,6 +61,21 @@
         </div>
     </div>
 </div>
+
+<ModalDialog @ref="FeatureDialog" Title="Additional Features">
+    <p>Here you will find a comprehensive list over feature you can use additional to classic markdown</p>
+    <p>Features marked with <i class="fas fa-flask"></i> are experimental and can change heavily, get removed or the usage changes.</p>
+    <p>Use with caution and check the changelog</p>
+    <hr>
+    <h3 style="display:inline-block">Slide-Show</h3><i class="fas fa-flask"></i>
+    <p>Will create a slide-show with images specified by the tag.</p>
+    <strong>Usage:</strong>
+    <code><pre>&lt;slide-show&gt;
+    &lt;slide-show-image src="https://picsum.photos/600/200" title="Title 1"&gt;&lt;/slide-show-image&gt;
+    &lt;slide-show-image src="https://picsum.photos/500/200" title="Title 2"&gt;&lt;/slide-show-image&gt;
+    &lt;slide-show-image src="https://picsum.photos/550/200" title="Title 3"&gt;&lt;/slide-show-image&gt;
+&lt;/slide-show&gt;</pre></code>
+</ModalDialog>
 @code {
     [Parameter]
     public BlogPost BlogPost { get; set; }
@@ -72,6 +89,8 @@
     [Parameter]
     public bool ClearAfterCreated { get; set; } = true;
 
+    private ModalDialog FeatureDialog { get; set; }
+
     private CreateNewModel model = new();
 
     protected override void OnParametersSet()