Suggestion: highlighting for Kirbytext about kirby-visual-markdown HOT 8 CLOSED

Great idea! I have been working on this behind the scenes, already :)

One issue though: Afaik, Kirbytext doesn't support parenthesis with Kirbytext tags at the moment. There has been basic support for it in the beta, but it has been dropped due to unstable results.

Considering this and my somewhat limited Regex knowledge, my Kirbytext tags parser/highlighter for CodeMirror doesn't support it either.

Example of my work-in-progress code in action:

(file: myfile.ext text: My dowload title)

from kirby-visual-markdown.

Wonderful!
Ha funny, I didn't know and used parenthesis on a site I'm working on. The screenshot is from that site, it runs 2.0.6 and I didn't see any issue so far.

from kirby-visual-markdown.

Using your example Kirbytext tag, the rendering is somewhat broken in the 2.1 beta. The closing brackets are not match correctly (in the rendered output, the closing bracket of (pdf) isn't contained in the anchor tag). Have a look at getkirby/kirby#163 for further reference, too.

Since I honestly don't know a way to make this work properly in the parser (CodeMirror syntax mode) I'm writing to support highlighting of Kirbytext tags, the editor wont support it. 😪

from kirby-visual-markdown.

Fortunately, I found some time to work on it a bit more today and to push the work-in-progress version of the feature up to GitHub. You can find it in the feature/kirbytext-highlighting branch for now.

@malvese I thought you'd like to give it a spin.

from kirby-visual-markdown.

Initial implementation of this feature now arrived in develop branch.

from kirby-visual-markdown.

You're too fast :) I didn't have time to fiddle with it this week, but on Monday I'll upgrade the site I'm working on.

from kirby-visual-markdown.

I just saw you seem to have used the colors from my screenshot. It was just a quick test, I actually think the bold grey attribute name is not very legible. Also the bright red parenthesis looks a bit like an error.
May I suggest a slightly different style?

.cm-s-visualmarkdown .cm-kirbytext-attribute {
  /* font-weight: bold; */
  color: #89939A;
}

.cm-s-visualmarkdown .cm-kirbytext-open, .cm-s-visualmarkdown .cm-kirbytext-close {
  font-weight: bold;
  color: #F07642;
}

We could also go crazy.

Attribute bubble, better visual distinction between attributes, but a bit over-the-top perhaps ^_^

Value 'field':

But doesn't work well in multiline…

from kirby-visual-markdown.

I changed the colors a little bit to make them adapt colors from the Kirby Panel patternlab since I liked the idea to make the kirbytext tags represent the Kirby brand colors.

Your "crazy" styles actually work really well for short (and single line) tags!
Once the tags are longer or have a line break within them it's not that appealing to me though.

from kirby-visual-markdown.