diff options
Diffstat (limited to '.changeset/cold-snakes-train.md')
-rw-r--r-- | .changeset/cold-snakes-train.md | 42 |
1 files changed, 0 insertions, 42 deletions
diff --git a/.changeset/cold-snakes-train.md b/.changeset/cold-snakes-train.md deleted file mode 100644 index 0bab4f40e..000000000 --- a/.changeset/cold-snakes-train.md +++ /dev/null @@ -1,42 +0,0 @@ ---- -"@astrojs/markdown-remark": minor ---- - -Adds a `data-language` attribute on the rendered `pre` elements to expose the highlighted syntax language. - -For example, the following Markdown code block will expose `data-language="python"`: -``` -\```python -def func(): - print('Hello Astro!') -\``` -``` - -This allows retrieving the language in a rehype plugin from `node.properties.dataLanguage` by accessing the `<pre>` element using `{ tagName: "pre" }`: -```js -// myRehypePre.js -import { visit } from "unist-util-visit"; -export default function myRehypePre() { - return (tree) => { - visit(tree, { tagName: "pre" }, (node) => { - const lang = node.properties.dataLanguage; - [...] - }); - }; -} -``` - -Note: The `<pre>` element is not exposed when using Astro's `<Code />` component which outputs flattened HTML. - - -The `data-language` attribute may also be used in css rules: -```css -pre::before { - content: attr(data-language); -} - -pre[data-language="javascript"] { - font-size: 2rem; -} -``` - |