diff --git a/docs/docusaurus.config.js b/docs/docusaurus.config.js index e039d369..701b5b99 100644 --- a/docs/docusaurus.config.js +++ b/docs/docusaurus.config.js @@ -1,4 +1,6 @@ const path = require("path"); +const theme = require("./src/theme/prism/themes/github"); +const darkTheme = require("./src/theme/prism/themes/github-dark-dimmed"); module.exports = { title: "ZMK Firmware", @@ -20,6 +22,19 @@ module.exports = { colorMode: { respectPrefersColorScheme: true, }, + prism: { + additionalLanguages: [ + "bash", + "c", + "cmake", + "ini", + "linker-script", + "log", + "powershell", + ], + theme, + darkTheme, + }, // sidebarCollapsible: false, navbar: { title: "ZMK Firmware", diff --git a/docs/src/theme/prism-include-languages.js b/docs/src/theme/prism-include-languages.js new file mode 100644 index 00000000..c073923b --- /dev/null +++ b/docs/src/theme/prism-include-languages.js @@ -0,0 +1,23 @@ +import siteConfig from "@generated/docusaurus.config"; +export default function prismIncludeLanguages(PrismObject) { + const { + themeConfig: { prism }, + } = siteConfig; + const { additionalLanguages } = prism; + // Prism components work on the Prism instance on the window, while prism- + // react-renderer uses its own Prism instance. We temporarily mount the + // instance onto window, import components to enhance it, then remove it to + // avoid polluting global namespace. + // You can mutate PrismObject: registering plugins, deleting languages... As + // long as you don't re-assign it + globalThis.Prism = PrismObject; + additionalLanguages.forEach((lang) => { + // eslint-disable-next-line global-require + require(`prismjs/components/prism-${lang}`); + }); + + require("./prism/components/prism-devicetree.js"); + require("./prism/components/prism-kconfig.js"); + + delete globalThis.Prism; +} diff --git a/docs/src/theme/prism/components/prism-devicetree.js b/docs/src/theme/prism/components/prism-devicetree.js new file mode 100644 index 00000000..22e638c6 --- /dev/null +++ b/docs/src/theme/prism/components/prism-devicetree.js @@ -0,0 +1,41 @@ +/** + * Copyright (c) 2023 The ZMK Contributors + * + * SPDX-License-Identifier: MIT + */ + +/* eslint-disable no-undef */ + +Prism.languages.devicetree = { + comment: Prism.languages.c["comment"], + string: Prism.languages.c["string"], + keyword: + /\/(?:bits|delete-node|delete-property|dts-v1|incbin|include|memreserve|omit-if-no-ref|plugin)\//, + label: { + pattern: /\b(?:[a-z_]\w*):/i, + alias: "symbol", + }, + reference: { + pattern: /&(?:[a-z_]\w*|\{[\w,.+*#?@/-]*\})/i, + alias: "variable", + }, + node: { + pattern: /(?:\/|\b[\w,.+\-@]+)(?=\s*\{)/, + alias: "class-name", + inside: { + // Node address + number: { + pattern: /(@)[0-9a-f,]/i, + lookbehind: true, + }, + }, + }, + function: Prism.languages.c["function"], + "attr-name": /\\?[\w,.+*#?@-]+(?=\s*[=;])/, + number: [/\b[0-9a-f]{2}\b/i, /\b(?:0[xX][0-9a-fA-F]+|\d+)(?:ULL|UL|LL|U|L)?/], + macro: Prism.languages.c["macro"], + operator: /<<|>>|[<>]=?|[!=]=?|&&?|\|\|?|[+\-*/%~?^]/, + punctuation: /[{}[\];(),.]/, +}; + +Prism.languages.dts = Prism.languages.devicetree; diff --git a/docs/src/theme/prism/components/prism-kconfig.js b/docs/src/theme/prism/components/prism-kconfig.js new file mode 100644 index 00000000..f911d6e3 --- /dev/null +++ b/docs/src/theme/prism/components/prism-kconfig.js @@ -0,0 +1,44 @@ +/** + * Copyright (c) 2023 The ZMK Contributors + * + * SPDX-License-Identifier: MIT + */ + +/* eslint-disable no-undef */ + +Prism.languages.kconfig = { + comment: { + pattern: /(^|[^\\])#.*/, + lookbehind: true, + greedy: true, + }, + string: /"(?:\\.|[^\\\r\n"])*"/, + helptext: { + // help text ends at the first line at a lower level of indentation than the + // first line of text. + pattern: /(^\s*)(?:help|---help---)\s*^(\s+)(?:.+)(?:\s*^\2[^\n]*)*/m, + lookbehind: true, + alias: "string", + inside: { + keyword: /^(?:help|---help---)/, + }, + }, + keyword: + /\b(?:allnoconfig_y|bool|boolean|choice|comment|config|def_bool|def_hex|def_int|def_string|def_tristate|default|defconfig_list|depends|endchoice|endif|endmenu|env|hex|if|imply|int|mainmenu|menu|menuconfig|modules|on|option|optional|orsource|osource|prompt|range|rsource|select|source|string|tristate|visible)\b/, + expansion: { + pattern: /\$\([\s\S]+\)/, + alias: "variable", + inside: { + function: /\$\(|\)/, + punctuation: /,/, + }, + }, + number: /\b(?:0[xX][0-9a-fA-F]+|\d+)/, + boolean: { + pattern: /\b(?:y|n|m)\b/, + alias: "number", + }, + variable: /\b[A-Z_]+\b/, + operator: /[<>]=?|[!=]=?|&&|\|\|/, + punctuation: /[()]/, +}; diff --git a/docs/src/theme/prism/themes/github-dark-dimmed.js b/docs/src/theme/prism/themes/github-dark-dimmed.js new file mode 100644 index 00000000..210742bb --- /dev/null +++ b/docs/src/theme/prism/themes/github-dark-dimmed.js @@ -0,0 +1,73 @@ +/* + Converted from https://github.com/highlightjs/highlight.js/blob/main/src/styles/github-dark-dimmed.css + + BSD 3-Clause License + + Copyright (c) 2006, Ivan Sagalaev. + All rights reserved. + + Redistribution and use in source and binary forms, with or without + modification, are permitted provided that the following conditions are met: + + * Redistributions of source code must retain the above copyright notice, this + list of conditions and the following disclaimer. + + * Redistributions in binary form must reproduce the above copyright notice, + this list of conditions and the following disclaimer in the documentation + and/or other materials provided with the distribution. + + * Neither the name of the copyright holder nor the names of its + contributors may be used to endorse or promote products derived from + this software without specific prior written permission. + + THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" + AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE + IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE + DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE + FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL + DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR + SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER + CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, + OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE + OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. +*/ + +/** @type {import("prism-react-renderer").PrismTheme} */ +const theme = { + plain: { color: "#adbac7", backgroundColor: "#22272e" }, + styles: [ + { types: ["keyword", "atrule"], style: { color: "#f47067" } }, + { types: ["class-name", "function"], style: { color: "#dcbdfb" } }, + { + types: [ + "attr-name", + "boolean", + "important", + "doctype", + "prolog", + "cdata", + "number", + "operator", + "variable", + "selector", + ], + style: { color: "#6cb6ff" }, + }, + { types: ["regex", "string", "char", "url"], style: { color: "#96d0ff" } }, + { types: ["builtin", "symbol", "entity"], style: { color: "#f69d50" } }, + { types: ["comment"], style: { color: "#768390" } }, + { types: ["italic"], style: { color: "#adbac7", fontStyle: "italic" } }, + { types: ["bold"], style: { color: "#adbac7", fontWeight: "bold" } }, + { + types: ["inserted"], + style: { color: "#b4f1b4", backgroundColor: "#1b4721" }, + }, + { + types: ["deleted"], + style: { color: "#ffd8d3", backgroundColor: "#78191b" }, + }, + { types: ["property", "punctuation", "tag"], style: {} }, + ], +}; + +module.exports = theme; diff --git a/docs/src/theme/prism/themes/github.js b/docs/src/theme/prism/themes/github.js new file mode 100644 index 00000000..b0be14c3 --- /dev/null +++ b/docs/src/theme/prism/themes/github.js @@ -0,0 +1,73 @@ +/* + Converted from https://github.com/highlightjs/highlight.js/blob/main/src/styles/github.css + + BSD 3-Clause License + + Copyright (c) 2006, Ivan Sagalaev. + All rights reserved. + + Redistribution and use in source and binary forms, with or without + modification, are permitted provided that the following conditions are met: + + * Redistributions of source code must retain the above copyright notice, this + list of conditions and the following disclaimer. + + * Redistributions in binary form must reproduce the above copyright notice, + this list of conditions and the following disclaimer in the documentation + and/or other materials provided with the distribution. + + * Neither the name of the copyright holder nor the names of its + contributors may be used to endorse or promote products derived from + this software without specific prior written permission. + + THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" + AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE + IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE + DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE + FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL + DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR + SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER + CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, + OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE + OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. +*/ + +/** @type {import("prism-react-renderer").PrismTheme} */ +const theme = { + plain: { color: "#24292e", backgroundColor: "#f9f9f9" }, + styles: [ + { types: ["keyword", "atrule"], style: { color: "#d73a49" } }, + { types: ["class-name", "function"], style: { color: "#6f42c1" } }, + { + types: [ + "attr-name", + "boolean", + "important", + "doctype", + "prolog", + "cdata", + "number", + "operator", + "variable", + "selector", + ], + style: { color: "#005cc5" }, + }, + { types: ["regex", "string", "char", "url"], style: { color: "#032f62" } }, + { types: ["builtin", "symbol", "entity"], style: { color: "#e36209" } }, + { types: ["comment"], style: { color: "#6a737d" } }, + { types: ["italic"], style: { color: "#24292e", fontStyle: "italic" } }, + { types: ["bold"], style: { color: "#24292e", fontWeight: "bold" } }, + { + types: ["inserted"], + style: { color: "#22863a", backgroundColor: "#f0fff4" }, + }, + { + types: ["deleted"], + style: { color: "#b31d28", backgroundColor: "#ffeef0" }, + }, + { types: ["property", "punctuation", "tag"], style: {} }, + ], +}; + +module.exports = theme;