3pp-mirror/docusaurus
1
0
Fork 0
mirror of https://github.com/facebook/docusaurus.git synced 2025-05-31 09:57:03 +02:00
Code Issues Projects Releases Packages Wiki Activity

feat(theme-classic): extensible code block magic comment system (#7178)

Browse source
This commit is contained in:
Joshua Chen 2022-05-04 18:31:13 +08:00 • committed by GitHub
parent 785fed723f
commit 51815c12c9
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
14 changed files with 692 additions and 161 deletions
Download patch file Download diff file Expand all files Collapse all files

19
website/docs/api/themes/theme-configuration.md
View file

@ -700,9 +700,28 @@ Accepted fields:
| `theme` | `PrismTheme` | `palenight` | The Prism theme to use for light-theme code blocks. |
| `darkTheme` | `PrismTheme` | `palenight` | The Prism theme to use for dark-theme code blocks. |
| `defaultLanguage` | `string` | `undefined` | The side of the navbar this item should appear on. |
| `magicComments` | `MagicCommentConfig[]` | _see below_ | The list of [magic comments](../../guides/markdown-features/markdown-features-code-blocks.mdx#custom-magic-comments). |
</APITable>
```ts
type MagicCommentConfig = {
className: string;
line?: string;
block?: {start: string; end: string};
};
```
```js
const defaultMagicComments = [
{
className: 'theme-code-block-highlighted-line',
line: 'highlight-next-line',
block: {start: 'highlight-start', end: 'highlight-end'},
},
];
```
### Theme {#theme}
By default, we use [Palenight](https://github.com/FormidableLabs/prism-react-renderer/blob/master/src/themes/palenight.js) as syntax highlighting theme. You can specify a custom theme from the [list of available themes](https://github.com/FormidableLabs/prism-react-renderer/tree/master/src/themes). You may also use a different syntax highlighting theme when the site is in dark mode.