is it applicable for latex math formulas ?

[goessner]

I am quite interested here.

My first intent would be to supress markdown tags inside of inline $...$ and block $$...$$ formulas.

I installed this extension, but could not see an orange colored text inside of *.js files.

I am sure, that I miss some additional information but cannot tell, what exactly it is.

thanks for listening, your work and help.

[mjbvz]

For markdown, you'd want to inject your custom rule for $...$ into the top level markdown grammar. This extension probably provides a better example of this: https://github.com/styled-components/vscode-styled-components/blob/master/syntaxes/styled-components.json

I think the injection selector would be:

    "injectionSelector": "L:text",

Although I'm not entirely sure if this will work or not

[goessner]

Hello Matt,

after some time I came back to styling my custom $...$ markdown math rules. I have had some success now, as I was able to give the formulas the green style of javascript comments.

But unfortunately I destroyed the styling of markdown headings (should be blue), links and others. I have no idea, what in my package.json and/or dollars.json might be responsible here.

I would be glad, if you can give me some hint here ... thanks

[mjbvz]

@goessner Hmm, I'm not sure. Can you please share the full grammar file and your package.json so I can investigate

[goessner]

sure ... thanks

grammar dollars.json:

{
    "fileTypes": ["md","markdown"],
      "injectionSelector": "L:text.html.markdown",
    "patterns": [
        {
            "name":"block-dollars",
            "begin": "[ \t]?\\${2}",
            "end": "\\${2}",
            "contentName": "comment"
        },
        {
            "name":"inline-dollars",
            "begin": "[\t ,.;|]\\$",
            "end": "\\$",
                       "contentName": "comment"
        }
         ],
    "scopeName": "text.html.markdown"
}

package.json

{
  "name": "mdmath",
  "displayName": "Markdown+Math",
  "description": "LaTeX Math for Markdown",
  "icon": "img/icon.png",
  "version": "2.0.7",
  "author": "Stefan Goessner",
  "publisher": "goessner",
  "keywords": [
    "TeX",
    "LaTeX",
    "KaTeX",
    "markdown",
    "math"
  ],
  "galleryBanner": {
    "color": "#efefef",
    "theme": "light"
  },
  "homepage": "https://github.com/goessner/mdmath/blob/master/readme.md",
  "repository": {
      "type": "git",
      "url": "git+https://github.com/goessner/mdmath.git"
  },
  "bugs": {
      "url": "https://github.com/goessner/mdmath/issues"
  },
  "license": "MIT",
  "engines": {
      "vscode": "^1.8.0"
  },
  "categories": [
    "Languages",
    "Other"
  ],
  "activationEvents": [
    "onLanguage:markdown"
  ],
  "contributes": {
    "configuration": {
      "title": "mdmath",
      "properties": {
          "mdmath.delimiters": {
              "type": "string",
              "default": "dollars",
              "description": "Math formula delimiters."
          }
      }
    },
    "markdown.previewStyles": [
        "./node_modules/katex/dist/katex.min.css",
        "./css/texmath.css",
        "./css/vscode-texmath.css"
      ],
    "markdown.markdownItPlugins": true,
    "commands": [
      {
          "command": "extension.clipToHtml",
          "title": "Clip Markdown+Math to HTML",
          "category": "Markdown"
      }
    ],
    "keybindings": [
      {
          "command": "extension.clipToHtml",
          "key": "ctrl+K .",
          "when": "editorTextFocus"
      }
    ],
    "languages": [
       { "id":"source.markdown.math",
         "extensions": ["md"]
       }
    ],
    "grammars": [
      {
        "injectTo": ["source.md"],
        "language": "markdown",
        "scopeName": "text.html.markdown",
        "path": "./syntaxes/dollars.json"
      }
    ]
  },
  "main": "./extension",
  "scripts": {
     "postinstall": "node ./node_modules/vscode/bin/install"
  },
  "devDependencies": {
     "vscode": "^1.0.0"
  },
  "dependencies": {
    "argparse": "^1.0.9",
    "clipboardy": "^1.1.2",
    "cross-spawn": "^5.0.1",
    "entities": "^1.1.1",
    "execa": "^0.6.0",
    "get-stream": "^3.0.0",
    "isexe": "^2.0.0",
    "is-stream": "^1.1.0",
    "katex": "^0.8.2",
    "linkify-it": "^2.0.3",
    "lru-cache": "^4.0.1",
    "markdown-it": "^8.3.1",
    "markdown-it-texmath": "^0.4.0",
    "match-at": "^0.1.0",
    "mdurl": "^1.0.1",
    "npm-run-path": "^2.0.0",
    "path-key": "^2.0.0",
    "p-finally": "^1.0.0",
    "pseudomap": "^1.0.1",
    "shebang-command": "^1.2.0",
    "shebang-regex": "^1.0.0",
    "signal-exit": "^3.0.0",
    "sprintf-js": "^1.0.3",
    "strip-eof": "^1.0.0",
    "uc.micro": "^1.0.3",
    "which": "^1.2.9",
    "yallist": "^2.0.0"
  }
}

[mjbvz]

Try:

 "grammars": [
          {
            "injectTo": [
              "text.html.markdown"
            ],
            "scopeName": "markdown-math",
            "path": "./syntaxes/dollars.json"
          }
        ]

and:

{
    "injectionSelector": "text.html.markdown",
    "patterns": [
        {
            "name": "block-dollars",
            "begin": "[ \t]?\\${2}",
            "end": "\\${2}",
            "contentName": "comment"
        },
        {
            "name": "inline-dollars",
            "begin": "[\t ,.;|]\\$",
            "end": "\\$",
            "contentName": "comment"
        }
    ],
    "scopeName": "markdown-math"
}

Main changes:

• Use different scopeName
• Don't use L: on the injection selector. I believe that causes the dollar patterns to get injected into themselves. Not sure if there is a better way to avoid that.

[goessner]

Works like a charme now ... thanks a lot.

Please allow me a final question: How can I use my own color (middle gray) instead of javascript comment green?

[mjbvz]

The color comes from the syntax theme so you can't specify it directly. Try to look through the styling for existing markdown elements and see if they use scopes that makes semantic sense for your type of content. Inline code for example uses the markup.inline.raw scope, which themes style in its own way:

I recommend trying to make use of one of the existing semantic scopes rather than trying to define a new one, since a new scope will require updating every syntax theme out there. (You can still add more specific scopes for your content, just make sure there is a fallback to a more well supported one)

[goessner]

I understand the concept of themes and semantic colors better now, follow your recommendation and pragmatically take markup.inline.raw ... thanks.

p.s.: I see, that the begin and end regexs are not able to span multiple lines and have read about that deficiency of TM patterns. I don't think that there is a workaraound meanwhile.