Fixes #48

lib/JS.hs

@@ -422,12 +422,15 @@ makeItemNotesEditor =
     enter = $("<span>", {
       "class": "edit-field-instruction",
       "text" : "or press Ctrl+Enter to save" })[0];
+    markdownSupported = $("<img>", {
+      "src": "/markdown.svg",
+      "class": "  markdown-supported "
+      })[0];
     markdown = $("<a>", {
       "href"   : "/markdown",
-      "target" : "_blank",
+      "target" : "_blank"})[0];
-      "text"   : "Markdown" })[0];
     $(sectionNode).append(
-      area, saveBtn, $(space), cancelBtn, $(space), enter, markdown);
+      area, saveBtn, $(space), cancelBtn, $(space), enter, $(markdown).append(markdownSupported));
   |]
 
 -- | Create a new category and redirect to it (or redirect to an old category

lib/View.hs

@@ -1173,7 +1173,8 @@ markdownEditor attr (view mdText -> s) submit cancel instr = do
     cancel
   emptySpan "6px"
   span_ [class_ "edit-field-instruction"] (toHtml instr)
-  a_ [href_ "/markdown", target_ "_blank"] "Markdown"
+  a_ [href_ "/markdown", target_ "_blank"] $ 
+    img_ [src_ "/markdown.svg", alt_ "markdown supported", class_ " markdown-supported "]
 
 smallMarkdownEditor
   :: MonadIO m
@@ -1198,7 +1199,8 @@ smallMarkdownEditor attr (view mdText -> s) submit mbCancel instr = do
       cancel
   span_ [style_ "float:right"] $ do
     span_ [class_ "edit-field-instruction"] (toHtml instr)
-    a_ [href_ "/markdown", target_ "_blank"] "Markdown"
+    a_ [href_ "/markdown", target_ "_blank"] $ 
+      img_ [src_ "/markdown.svg", alt_ "markdown supported", class_ " markdown-supported "]
 
 thisNode :: MonadIO m => HtmlT m JQuerySelector
 thisNode = do

static/markdown.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="208" height="128" viewBox="0 0 208 128"><mask id="a"><rect width="100%" height="100%" fill="#fff"/><path d="M30 98v-68h20l20 25 20-25h20v68h-20v-39l-20 25-20-25v39zM155 98l-30-33h20v-35h20v35h20z"/></mask><rect width="100%" height="100%" ry="15" mask="url(#a)"/></svg>

templates/css.widget

@@ -267,3 +267,7 @@ textarea.fullwidth {
   margin: 5px 0px;
   width: 100%;
 }
+
+.markdown-supported {
+  height: 1.5em;
+}

templates/trait.widget

@@ -150,7 +150,7 @@ function makeTraitEditor(itemUid, traitUid, content) {
            <span class="edit-field-instruction"> \
              press Ctrl+Enter or Enter to save \
            </span> \
-           <a href="/markdown" target="_blank">Markdown</a> \
+           <a href="/markdown" target="_blank"><img src="/markdown.svg" /></a> \
          </span>';
 
   $(sectionNode).html(template);