Describe markdown HTML rendering and display a warning

Fixes #688

inc/shaarli.css

@@ -37,6 +37,10 @@ em {
     font-style: italic;
 }
 
+strong {
+    font-weight: bold;
+}
+
 /* Buttons */
 .bigbutton {
     background-color: #c0c0c0;
@@ -1168,8 +1172,13 @@ ul.errors {
 }
 
 #pluginsadmin a {
+    color: #486D08;
+}
+
+#pluginsadmin a.arrow {
     color: black;
 }
+
 /* 404 page */
 .error-container {
 

plugins/markdown/README.md

@@ -41,6 +41,23 @@ If the tag `.nomarkdown` is set for a shaare, it won't be converted to Markdown
  
 > Note: it's a private tag (leading dot), so it won't be displayed to visitors.
 
+### HTML rendering
+
+Markdown support HTML tags. For example:
+
+    > <strong>strong</strong><strike>strike</strike>
+   
+Will render as:
+
+> <strong>strong</strong><strike>strike</strike>
+
+If you want to shaare HTML code, it is necessary to use inline code or code blocks.
+  
+**If your shaared descriptions containing HTML tags before enabling the markdown plugin, 
+enabling it might break your page.**
+
+> Note: HTML tags such as script, iframe, etc. are disabled for security reasons.
+
 ### Known issue
 
 #### Redirector

plugins/markdown/markdown.meta

@@ -1 +1,4 @@
-description="Render shaare description with Markdown syntax."
+description="Render shaare description with Markdown syntax.<br><strong>Warning</strong>:
+If your shaared descriptions containing HTML tags before enabling the markdown plugin,
+enabling it might break your page.
+See the <a href=\"https://github.com/shaarli/Shaarli/tree/master/plugins/markdown#html-rendering\">README</a>."

tpl/pluginsadmin.html

@@ -38,11 +38,11 @@
               <tr data-line="{$key}" data-order="{$counter}">
                 <td class="center"><input type="checkbox" name="{$key}" id="{$key}" checked="checked"></td>
                 <td class="center">
-                  <a href="#"
+                  <a href="#" class="arrow"
                      onclick="return orderUp(this.parentNode.parentNode.getAttribute('data-order'));">
                     ▲
                   </a>
-                  <a href="#"
+                  <a href="#" class="arrow"
                      onclick="return orderDown(this.parentNode.parentNode.getAttribute('data-order'));">
                     ▼
                   </a>