luciano/diff2html
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add colorScheme information to README

Browse source
This commit is contained in:
Jordan Welch 2023-09-18 21:16:33 -05:00
parent 79268800ff
commit 0029890ead
No known key found for this signature in database
GPG key ID: 8C1872FF2F7710B3
1 changed files with 18 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

19
README.md
View file

@ -201,7 +201,7 @@ diff2htmlUi.draw();
```html ```html
<!-- Stylesheet --> <!-- Stylesheet -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.13.1/styles/github.min.css" /> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.8.0/styles/github.min.css" />
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/diff2html/bundles/css/diff2html.min.css" /> <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/diff2html/bundles/css/diff2html.min.css" />
<!-- Javascripts --> <!-- Javascripts -->
@ -227,6 +227,21 @@ document.addEventListener('DOMContentLoaded', () => {
}); });
``` ```
When using the `auto` color scheme, you will need to specify both the light and dark themes for highlight.js to use.
```html
<link
rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.8.0/styles/github.min.css"
media="screen and (prefers-color-scheme: light)"
/>
<link
rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.8.0/styles/github-dark.min.css"
media="screen and (prefers-color-scheme: dark)"
/>
```
#### Collapsable File Summary List #### Collapsable File Summary List
> Add the dependencies. > Add the dependencies.
@ -386,6 +401,8 @@ The HTML output accepts a Javascript object with configuration. Possible options
> [src/templates](https://github.com/rtfpessoa/diff2html/tree/master/src/templates) > [src/templates](https://github.com/rtfpessoa/diff2html/tree/master/src/templates)
- `highlightLanguages`: Map of extension to language name, used for highlighting. This overrides the default language - `highlightLanguages`: Map of extension to language name, used for highlighting. This overrides the default language
detection based on file extensions. detection based on file extensions.
- `colorScheme`: color scheme to use for the diff, default is `light`. Possible values are `light`, `dark`, and `auto`
which will use the browser's preferred color scheme.
### Diff2Html Browser ### Diff2Html Browser