john mangual john mangual - 9 days ago 5x
Markdown Question

How to use Markdown in Elm: is it [markdown| or [markdown |?

Here is my code snippet: inspired by's example.

main : Element
main = flow down
[ [markdown| #Hello World |]
, [markdown| The quick **brown** box *jumps* over the lazy dogs. |]

I am familiar with markdown itself, as on Daring Fireball or StackOverflow itself. However, I have several questions about how Markdown is used from within Elm. I could not find the documentation for Elm's

  • What does
    mean? Why is
    [markdown |
    - notice the space - not acceptable?

  • Why does
    #Hello World
    not appear big? It should appear large like this

Hello World

Here's is a corrected example, but I don't know what I did right.

main : Element
main = flow down
[ [markdown|

# Hello World

, [markdown| The quick **brown** box *jumps* over the lazy dogs. |]

Using strings seems to also be wrong, as in
[markdown| "# Hello World" |]
. Why is this wrong?

I thought it would be safer to remind Elm that my sentence was a string, but it seems I don't have to. And shouldn't.


As mentioned in the comments [| and |] is syntax that was borrowed from Haskell. These are called quasiquotes and take a literal name between the first [ and |. Elm currently support markdown through this mechanism, and GLSL for the WebGL library.
I think the original announcement is the only documentation for now, we should definitely ask for the Syntax reference page to include how to use markdown.

As for your example use: The problem with the header "Hello World" does not come from the single-line use, but from the leading space. This code gives the desired behaviour:

main : Element
main = flow down
  [ [markdown|#Hello World|]
  , [markdown|The quick **brown** box *jumps* over the lazy dogs.|]

This is normal behaviour for markdown IIRC:

#Hello World
(^ has a leading space)