Add syntax highlighting.

[stebanos]

Currently it can be quite cumbersome to spot mistakes. Syntax highlighting will help a lot, but this depends on #19.

[kunal-mohta]

I think CodeMirror has its own predefined syntax-highlighting for particular languages, and apart from that it only has a default mode, as can be seen here in runmode/colorize.js under the addons heading

[kunal-mohta]

I read more and found out that we can provide CodeMirror a list of keywords that have a particular syntax highlighting.

[fdb]

CodeMirror is now integrated but we need to write our own mode for the Seed syntax. Seed itself doesn't have very many keywords, it's more a base structure of a block identifier (ends with a colon), phrase (starts with - ), phrase continuation line (starts with " ")...

Inside of each phrase we could use a HTML mixed-mode highlighter that higlights HTML and inline CSS.

[stebanos]

Suggestion:

[fdb]

Looking good! 👍

[fdb]

Here's some info on writing a custom mode in CodeMirror:

http://codemirror.net/doc/manual.html#modeapi

[fdb]

Perhaps the simple mode is enough: http://codemirror.net/demo/simplemode.html

[dhruvramdev]

@fdb I would like to work.

[dhruvramdev]

I was able to write a basic set of rules. But I couldn't find more colours to highlight text as described in picture even though they have different rules.

Screenshots