mirror of
https://github.com/BookStackApp/BookStack.git
synced 2024-11-26 10:13:38 +08:00
3e738b1471
- Fixed some keybindings not running as expected, due to some editor defaults overriding or further actions taking place since the action would not indicate it's been dealt with (by returning boolean). - Fixed spacing/border-radius being used on codeblocks on non-intended areas like the MD editor. - Fixed lack of BG on default light theme, visible on full screen md editor. - Fixed error thrown when the user does not have access to change the current editor (Likely non-cm related existing issue)
91 lines
2.8 KiB
JavaScript
91 lines
2.8 KiB
JavaScript
import {tags} from "@lezer/highlight";
|
|
import {HighlightStyle, syntaxHighlighting} from "@codemirror/language";
|
|
import {EditorView} from "@codemirror/view";
|
|
import {oneDarkHighlightStyle, oneDarkTheme} from "@codemirror/theme-one-dark";
|
|
|
|
const defaultLightHighlightStyle = HighlightStyle.define([
|
|
{ tag: tags.meta,
|
|
color: "#388938" },
|
|
{ tag: tags.link,
|
|
textDecoration: "underline" },
|
|
{ tag: tags.heading,
|
|
textDecoration: "underline",
|
|
fontWeight: "bold" },
|
|
{ tag: tags.emphasis,
|
|
fontStyle: "italic" },
|
|
{ tag: tags.strong,
|
|
fontWeight: "bold" },
|
|
{ tag: tags.strikethrough,
|
|
textDecoration: "line-through" },
|
|
{ tag: tags.keyword,
|
|
color: "#708" },
|
|
{ tag: [tags.atom, tags.bool, tags.url, tags.contentSeparator, tags.labelName],
|
|
color: "#219" },
|
|
{ tag: [tags.literal, tags.inserted],
|
|
color: "#164" },
|
|
{ tag: [tags.string, tags.deleted],
|
|
color: "#a11" },
|
|
{ tag: [tags.regexp, tags.escape, tags.special(tags.string)],
|
|
color: "#e40" },
|
|
{ tag: tags.definition(tags.variableName),
|
|
color: "#00f" },
|
|
{ tag: tags.local(tags.variableName),
|
|
color: "#30a" },
|
|
{ tag: [tags.typeName, tags.namespace],
|
|
color: "#085" },
|
|
{ tag: tags.className,
|
|
color: "#167" },
|
|
{ tag: [tags.special(tags.variableName), tags.macroName],
|
|
color: "#256" },
|
|
{ tag: tags.definition(tags.propertyName),
|
|
color: "#00c" },
|
|
{ tag: tags.compareOperator,
|
|
color: "#708" },
|
|
{ tag: tags.comment,
|
|
color: "#940" },
|
|
{ tag: tags.invalid,
|
|
color: "#f00" }
|
|
]);
|
|
|
|
const defaultThemeSpec = {
|
|
"&": {
|
|
backgroundColor: "#FFF",
|
|
color: "#000",
|
|
},
|
|
"&.cm-focused": {
|
|
outline: "none",
|
|
},
|
|
".cm-line": {
|
|
lineHeight: "1.6",
|
|
},
|
|
};
|
|
|
|
/**
|
|
* Get the theme extension to use for editor view instance.
|
|
* @returns {Extension[]}
|
|
*/
|
|
export function getTheme(viewParentEl) {
|
|
const darkMode = document.documentElement.classList.contains('dark-mode');
|
|
let viewTheme = darkMode ? oneDarkTheme : EditorView.theme(defaultThemeSpec);
|
|
let highlightStyle = darkMode ? oneDarkHighlightStyle : defaultLightHighlightStyle;
|
|
|
|
const eventData = {
|
|
darkModeActive: darkMode,
|
|
registerViewTheme(builder) {
|
|
const spec = builder();
|
|
if (spec) {
|
|
viewTheme = EditorView.theme(spec);
|
|
}
|
|
},
|
|
registerHighlightStyle(builder) {
|
|
const tagStyles = builder(tags) || [];
|
|
if (tagStyles.length) {
|
|
highlightStyle = HighlightStyle.define(tagStyles);
|
|
}
|
|
}
|
|
};
|
|
|
|
window.$events.emitPublic(viewParentEl, 'library-cm6::configure-theme', eventData);
|
|
|
|
return [viewTheme, syntaxHighlighting(highlightStyle)];
|
|
} |