livebook-dev/livebook
1
1
Fork 0
mirror of https://github.com/livebook-dev/livebook.git synced 2024-11-10 09:03:02 +08:00
Code Issues Projects Releases Packages Wiki Activity

Allow for XML syntax highlighting in markdown cells (#743)

Browse source 
* Update webpack.config.js

Allows for xml syntax highlighting in markdown cells

* Extend theme to cover XML and JSON specific tokens

* Refactor theme colors into a single palette

Co-authored-by: Jonatan Kłosko <jonatanklosko@gmail.com>
This commit is contained in:
Adam Lancaster 2021-12-04 14:02:53 +00:00 committed by GitHub
parent 037c425643
commit a764073848
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 45 additions and 23 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

66
assets/js/cell/live_editor/theme.js
View file

@ -1,39 +1,61 @@
// This is a port of the One Dark theme to the Monaco editor.
const colors = {
default: "#abb2bf",
lightRed: "#e06c75",
blue: "#61afef",
gray: "#5c6370",
green: "#98c379",
purple: "#c678dd",
red: "#be5046",
teal: "#56b6c2",
peach: "#d19a66",
};
const theme = {
base: "vs-dark",
inherit: false,
rules: [
{ token: "", foreground: "#abb2bf" },
{ token: "variable", foreground: "#e06c75" },
{ token: "constant", foreground: "#61afef" },
{ token: "constant.character.escape", foreground: "#61afef" },
{ token: "comment", foreground: "#5c6370" },
{ token: "number", foreground: "#61afef" },
{ token: "regexp", foreground: "#e06c75" },
{ token: "type", foreground: "#e06c75" },
{ token: "string", foreground: "#98c379" },
{ token: "keyword", foreground: "#c678dd" },
{ token: "operator", foreground: "#d19a66" },
{ token: "delimiter.bracket.embed", foreground: "#be5046" },
{ token: "sigil", foreground: "#56b6c2" },
{ token: "function", foreground: "#61afef" },
{ token: "function.call", foreground: "#abb2bf" },
{ token: "", foreground: colors.default },
{ token: "variable", foreground: colors.lightRed },
{ token: "constant", foreground: colors.blue },
{ token: "constant.character.escape", foreground: colors.blue },
{ token: "comment", foreground: colors.gray },
{ token: "number", foreground: colors.blue },
{ token: "regexp", foreground: colors.lightRed },
{ token: "type", foreground: colors.lightRed },
{ token: "string", foreground: colors.green },
{ token: "keyword", foreground: colors.purple },
{ token: "operator", foreground: colors.peach },
{ token: "delimiter.bracket.embed", foreground: colors.red },
{ token: "sigil", foreground: colors.teal },
{ token: "function", foreground: colors.blue },
{ token: "function.call", foreground: colors.default },
// Markdown specific
{ token: "emphasis", fontStyle: "italic" },
{ token: "strong", fontStyle: "bold" },
{ token: "keyword.md", foreground: "#e06c75" },
{ token: "keyword.table", foreground: "#e06c75" },
{ token: "string.link.md", foreground: "#61afef" },
{ token: "variable.md", foreground: "#56b6c2" },
{ token: "string.md", foreground: "#abb2bf" },
{ token: "variable.source.md", foreground: "#abb2bf" },
{ token: "keyword.md", foreground: colors.lightRed },
{ token: "keyword.table", foreground: colors.lightRed },
{ token: "string.link.md", foreground: colors.blue },
{ token: "variable.md", foreground: colors.teal },
{ token: "string.md", foreground: colors.default },
{ token: "variable.source.md", foreground: colors.default },
// XML specific
{ token: "tag", foreground: colors.lightRed },
{ token: "metatag", foreground: colors.lightRed },
{ token: "attribute.name", foreground: colors.peach },
{ token: "attribute.value", foreground: colors.green },
// JSON specific
{ token: "string.key", foreground: colors.lightRed },
{ token: "keyword.json", foreground: colors.blue },
],
colors: {
"editor.background": "#282c34",
"editor.foreground": "#abb2bf",
"editor.foreground": colors.default,
"editorLineNumber.foreground": "#636d83",
"editorCursor.foreground": "#636d83",
"editor.selectionBackground": "#3e4451",

2
assets/webpack.config.js
View file

@ -51,7 +51,7 @@ module.exports = (env, options) => {
}),
new MiniCssExtractPlugin({ filename: "../css/app.css" }),
new MonacoWebpackPlugin({
languages: ["markdown", "elixir"],
languages: ["markdown", "elixir", "xml", "json"],
}),
],
optimization: {