@@ -41,14 +41,14 @@ export default {
41
41
};
42
42
```
43
43
44
- Refer to [ examples/sveltekit] ( examples/sveltekit ) for an example set-up .
44
+ Refer to [ examples/sveltekit] ( examples/sveltekit ) or [ examples/vite ] ( examples/vite ) .
45
45
46
46
## Usage
47
47
48
- There are two ways to apply ` highlight.js ` styles:
48
+ There are two ways to apply ` highlight.js ` styles.
49
49
50
- 1 . JavaScript styles injected into the DOM through ` svelte:head `
51
- 2 . CSS StyleSheets imported using a file loader
50
+ 1 . Injected styles through [ svelte: head ] ( https://svelte.dev/docs#template-syntax-svelte-head )
51
+ 2 . CSS StyleSheets
52
52
53
53
### Injected Styles
54
54
@@ -107,9 +107,9 @@ Use the `HighlightSvelte` component for Svelte syntax highlighting.
107
107
108
108
## Auto-highlighting
109
109
110
- The ` HighlightAuto ` component invokes the ` highlightAuto ` API from ` highlight.js ` .
110
+ The ` HighlightAuto ` component uses [ highlightAuto] ( https://highlightjs.readthedocs.io/en/latest/api.html#highlightauto ) API.
111
111
112
- Note that auto-highlighting will result in a larger bundle size in order to infer a language.
112
+ ** Note: ** auto-highlighting will result in a larger bundle size in order to infer a language.
113
113
114
114
Prefer to specify a language if possible.
115
115
@@ -132,8 +132,6 @@ Prefer to specify a language if possible.
132
132
133
133
All ` Highlight ` components apply a ` data-language ` attribute on the codeblock containing the language name.
134
134
135
- This is also compatible with custom languages.
136
-
137
135
See the [ Languages page] ( SUPPORTED_LANGUAGES.md ) for a list of supported languages.
138
136
139
137
``` css
@@ -146,11 +144,9 @@ See the [Languages page](SUPPORTED_LANGUAGES.md) for a list of supported languag
146
144
147
145
All ` Highlight ` components allow for a tag to be added at the top-right of the codeblock displaying the language name.
148
146
149
- The language tag can be given a custom ` background ` , ` color ` , and ` border-radius ` through the custom properties shown.
150
-
151
- This is also compatible with custom languages.
147
+ The language tag can be given a custom ` background ` , ` color ` , and ` border-radius ` through CSS custom properties.
152
148
153
- It is recommended that you set values for ` --hljs-background ` and ` --hljs-foreground ` to ensure the langtags remain readable on any theme.
149
+ It is recommended that you set values for ` --hljs-background ` and ` --hljs-foreground ` to ensure the langtags are readable with your theme.
154
150
155
151
See the [ Languages page] ( SUPPORTED_LANGUAGES.md ) for a list of supported languages.
156
152
@@ -194,6 +190,7 @@ Refer to the highlight.js [language definition guide](https://highlightjs.readth
194
190
register: (hljs) => {
195
191
return {
196
192
/** custom language rules */
193
+ contains: [],
197
194
};
198
195
},
199
196
};
0 commit comments