Skip to content

Commit b74e0ea

Browse files
committed
fix(mermaid): Use dark theme if appropriate
Fixes: #4814 Signed-off-by: Jonas <jonas@freesources.org>
1 parent a4b6370 commit b74e0ea

1 file changed

Lines changed: 7 additions & 1 deletion

File tree

src/nodes/CodeBlockView.vue

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -82,6 +82,7 @@
8282
<script>
8383
import debounce from 'debounce'
8484
import { NodeViewWrapper, NodeViewContent } from '@tiptap/vue-2'
85+
import { useIsDarkTheme } from '@nextcloud/vue'
8586
import NcActions from '@nextcloud/vue/components/NcActions'
8687
import NcActionButton from '@nextcloud/vue/components/NcActionButton'
8788
import NcActionInput from '@nextcloud/vue/components/NcActionInput'
@@ -131,7 +132,9 @@ export default {
131132
},
132133
},
133134
setup() {
135+
const isDarkTheme = useIsDarkTheme()
134136
return {
137+
isDarkTheme,
135138
/** The lazy loaded mermaid js module */
136139
mermaid: null,
137140
}
@@ -209,7 +212,10 @@ export default {
209212
// lazy load mermaid on first real usage
210213
if (this.mermaid === null) {
211214
this.mermaid = (await import('mermaid')).default
212-
this.mermaid.initialize({ startOnLoad: false })
215+
this.mermaid.initialize({
216+
startOnLoad: false,
217+
theme: this.isDarkTheme ? 'dark' : 'default',
218+
})
213219
}
214220
await this.mermaid.parse(textContent)
215221

0 commit comments

Comments
 (0)