From 608e425ca94644f862d6130ae0a5c9543012601c Mon Sep 17 00:00:00 2001 From: Jim Date: Mon, 2 Sep 2024 14:32:32 -0600 Subject: [PATCH 1/2] Fix 4D code syntax highlighting #DECLARE, ds and Form were not recognized properly, so I gave them their own class for proper recognition. A 'memberFunction' should not be similarly highlighted as a function, so I removed the alias. --- src/theme/highlight/language/prism-4d.js | 20 +++++++++++++++----- 1 file changed, 15 insertions(+), 5 deletions(-) diff --git a/src/theme/highlight/language/prism-4d.js b/src/theme/highlight/language/prism-4d.js index b8ebdd01a5093a..5a4504d037e8a4 100644 --- a/src/theme/highlight/language/prism-4d.js +++ b/src/theme/highlight/language/prism-4d.js @@ -16,10 +16,14 @@ Prism.languages["4d"] = { pattern: /(["'])(?:\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/, greedy: true }, - + // Specific pattern for `#DECLARE` to not conflict with the '#' operator + 'special-keyword': { + pattern: /#DECLARE\w*/, + alias: 'keyword' // This uses the 'keyword' styling + }, 'keyword': [ { - pattern: /\b(?:Begin SQL|This|End SQL|For each|Class extends|Class constructor|End for each|If|Else|End if|Case of|End case|DECLARE|For|End for|Use|End use|While|End while|Repeat|Until|Function|var|property|exposed|local|return|break|continue)\b/, + pattern: /\b(?:Begin SQL|This|End SQL|For each|Class extends|Class constructor|End for each|If|Else|End if|Case of|End case|For|End for|Use|End use|While|End while|Repeat|Until|Function|var|property|exposed|local|return|break|continue)\b/, }, ], 'builtin': [ @@ -27,13 +31,20 @@ Prism.languages["4d"] = { pattern: /(: )(4D|Integer|Text|Real|Picture|Pointer|Boolean|Time|Date|Blob|Object|Collection|Variant|cs)/, lookbehind : true } + ], + // specific pattern for 'ds' and 'Form because unlike other 'builtin', there is no space before 'ds' + 'special-builtin': [ + { + pattern: /\b(?:ds|Form)\b/, + lookbehind : true, + alias: "builtin" + } ], // Allow for all non-ASCII characters (See http://stackoverflow.com/a/2008444) // allows space 'memberFunction': { pattern : /(\.)#?[_$a-zA-Z\xA0-\uFFFF](?:[$\w\xA0-\uFFFF\s])+(?=\()/, greedy: true, - alias: 'function' }, // allows space 'command': { @@ -66,7 +77,7 @@ Prism.languages["4d"] = { 'boolean': /\b(?:True|False)\b/, 'number': /\b(?:(?:0[xX](?:[\dA-Fa-f](?:_[\dA-Fa-f])?)+|0[bB](?:[01](?:_[01])?)+|0[oO](?:[0-7](?:_[0-7])?)+)n?|(?:\d(?:_\d)?)+n)\b|(?:\b(?:\d(?:_\d)?)+\.?(?:\d(?:_\d)?)*|\B\.(?:\d(?:_\d)?)+)(?:[Ee][+-]?(?:\d(?:_\d)?)+)?(?!D)/, - 'operator': /:=|->|[!?:#\-+*\/%&|^!=<>]=?|\?\?=?|\?\.?|[~:]|\*\|/, + 'operator': /#|:=|->|[!?\-+*\/%&|^!=<>]=?|\?\?=?|\?\.?|[~:]|\*\|/, 'punctuation': /[{}[\];(),.:]/ }; @@ -74,4 +85,3 @@ Prism.languages["4d"] = { Prism.languages.code4d = Prism.languages["4d"] - From bc4f6ecdc6e88b53d85ea2a1e94a936bfb83853e Mon Sep 17 00:00:00 2001 From: Jim Date: Mon, 2 Sep 2024 14:37:43 -0600 Subject: [PATCH 2/2] Add default 4D syntax colors as new themes --- docusaurus.config.js | 7 +- .../themes/default4D_Dark/index.cjs.js | 128 ++++++++++++++++++ .../highlight/themes/default4D_Dark/index.js | 84 ++++++++++++ .../themes/default4D_Light/index.cjs.js | 128 ++++++++++++++++++ .../highlight/themes/default4D_Light/index.js | 84 ++++++++++++ 5 files changed, 426 insertions(+), 5 deletions(-) create mode 100644 src/theme/highlight/themes/default4D_Dark/index.cjs.js create mode 100644 src/theme/highlight/themes/default4D_Dark/index.js create mode 100644 src/theme/highlight/themes/default4D_Light/index.cjs.js create mode 100644 src/theme/highlight/themes/default4D_Light/index.js diff --git a/docusaurus.config.js b/docusaurus.config.js index ae2866185142f6..25db7ee70e4112 100644 --- a/docusaurus.config.js +++ b/docusaurus.config.js @@ -1,7 +1,4 @@ -const { themes } = require('prism-react-renderer'); const { default: remarkGfm } = require('remark-gfm'); -const lightTheme = themes.github; -const darkTheme = themes.palenight; const isProduction = process.env.GITHUB_REPOSITORY_OWNER === '4d'; @@ -136,8 +133,8 @@ module.exports = { }, }, prism: { - theme: lightTheme, - darkTheme: darkTheme, + theme: require('./src/theme/highlight/themes/default4D_Light'), + darkTheme: require('./src/theme/highlight/themes/default4D_Dark'), }, navbar: { title: "4D Documentation", diff --git a/src/theme/highlight/themes/default4D_Dark/index.cjs.js b/src/theme/highlight/themes/default4D_Dark/index.cjs.js new file mode 100644 index 00000000000000..b30665758489bb --- /dev/null +++ b/src/theme/highlight/themes/default4D_Dark/index.cjs.js @@ -0,0 +1,128 @@ +'use strict'; + +// Converted automatically using ./tools/themeFromVsCode +var theme = { + plain: { + color: "#ffffff", + backgroundColor: "#292d3e" + }, + styles: [{ + types: ["comment"], + style: { + color: "rgb(143, 143, 143)", + } + }, { + types: ["string", "inserted"], + style: { + color: "rgb(255, 255, 255)" + } + }, { + types: ["number"], + style: { + color: "rgb(255, 255, 255)" + } + }, + { + types: ["char", "constant"], + style: { + color: "rgb(255, 255, 255)", + } + }, + { + types: ["memberFunction"], + style: { + color: "rgb(78, 195, 110)", + fontStyle: "italic", + } + }, + { + types: ["function"], + style: { + color: "rgb(89, 187, 0)", + fontWeight: "bold", + } + }, + { + types: ["builtin", "command"], + style: { + color: "rgb(89, 187, 0)", + fontWeight: "bold" + } + }, + { + types: ["property"], + style: { + color: "rgb(160, 128, 107)", + } + }, + { + types: ["variable"], + style: { + color: "rgb(24, 179, 241)" + } + }, + { + types: ["interprocess-variable"], + style: { + color: "rgb(255, 0, 136)" + } + }, + { + types: ["parameters"], + style: { + color: "rgb(12, 112, 255)" + } + }, + { + types: ["punctuation", "selector"], + style: { + color: "rgb(255, 255, 255)" + } + }, { + types: ["class-name", "attr-name"], + style: { + color: "rgb(255, 203, 107)" + } + }, { + types: ["tag", "deleted"], + style: { + color: "rgb(255, 85, 114)" + } + }, { + types: ["operator"], + style: { + color: "rgb(255, 255, 255)" + } + }, { + types: ["boolean"], + style: { + color: "rgb(089, 187, 0)", + fontWeight: "bold", + } + }, { + types: ["keyword"], + style: { + color: "rgb(0, 142, 0)", + fontWeight: "bold" + } + }, { + types: ["doctype"], + style: { + color: "rgb(199, 146, 234)", + fontStyle: "italic" + } + }, { + types: ["namespace"], + style: { + color: "rgb(178, 204, 214)", + fontWeight: "bold" + } + }, { + types: ["url"], + style: { + color: "rgb(221, 221, 221)" + } + }] +}; + +module.exports = theme; \ No newline at end of file diff --git a/src/theme/highlight/themes/default4D_Dark/index.js b/src/theme/highlight/themes/default4D_Dark/index.js new file mode 100644 index 00000000000000..1bd65fb69f4a39 --- /dev/null +++ b/src/theme/highlight/themes/default4D_Dark/index.js @@ -0,0 +1,84 @@ +// Converted automatically using ./tools/themeFromVsCode +var theme = { + plain: { + color: "#ffffff", + backgroundColor: "#292d3e" + }, + styles: [{ + types: ["comment"], + style: { + color: "rgb(143, 143, 143)", + } + }, { + types: ["string", "inserted"], + style: { + color: "rgb(255, 255, 255)" + } + }, { + types: ["number"], + style: { + color: "rgb(255, 255, 255)" + } + }, { + types: ["builtin", "char", "constant", "function"], + style: { + color: "rgb(89, 187, 0)", + fontWeight: "bold", + } + }, { + types: ["punctuation", "selector"], + style: { + color: "rgb(255, 255, 255)" + } + }, { + types: ["variable"], + style: { + color: "rgb(24, 179, 241)" + } + }, { + types: ["class-name", "attr-name"], + style: { + color: "rgb(255, 203, 107)" + } + }, { + types: ["tag", "deleted"], + style: { + color: "rgb(255, 85, 114)" + } + }, { + types: ["operator"], + style: { + color: "rgb(255, 255, 255)" + } + }, { + types: ["boolean"], + style: { + color: "rgb(089, 187, 0)", + fontWeight: "bold", + } + }, { + types: ["keyword"], + style: { + color: "rgb(0, 142, 0)", + fontWeight: "bold", + } + }, { + types: ["doctype"], + style: { + color: "rgb(199, 146, 234)", + fontStyle: "italic" + } + }, { + types: ["namespace"], + style: { + color: "rgb(178, 204, 214)" + } + }, { + types: ["url"], + style: { + color: "rgb(221, 221, 221)" + } + }] +}; + +export default theme; \ No newline at end of file diff --git a/src/theme/highlight/themes/default4D_Light/index.cjs.js b/src/theme/highlight/themes/default4D_Light/index.cjs.js new file mode 100644 index 00000000000000..dfdd7138ead204 --- /dev/null +++ b/src/theme/highlight/themes/default4D_Light/index.cjs.js @@ -0,0 +1,128 @@ +'use strict'; + +// Converted automatically using ./tools/themeFromVsCode +var theme = { + plain: { + color: "#000000", + backgroundColor: "#F6F8FA" + }, + styles: [{ + types: ["comment"], + style: { + color: "rgb(83, 83, 83)", + } + }, { + types: ["string", "inserted"], + style: { + color: "rgb(0, 0, 0)" + } + }, { + types: ["number"], + style: { + color: "rgb(0, 0, 0)" + } + }, + { + types: ["char", "constant"], + style: { + color: "rgb(0, 0, 0)", + } + }, + { + types: ["memberFunction"], + style: { + color: "rgb(95, 142, 94)", + fontStyle: "italic", + } + }, + { + types: ["function"], + style: { + color: "rgb(6, 140, 0)", + fontWeight: "bold", + } + }, + { + types: ["builtin", "command"], + style: { + color: "rgb(6, 140, 0)", + fontWeight: "bold" + } + }, + { + types: ["property"], + style: { + color: "rgb(160, 128, 107)", + } + }, + { + types: ["variable"], + style: { + color: "rgb(0, 49, 225)" + } + }, + { + types: ["interprocess-variable"], + style: { + color: "rgb(255, 0, 136)" + } + }, + { + types: ["parameters"], + style: { + color: "rgb(12, 112, 255)" + } + }, + { + types: ["punctuation", "selector"], + style: { + color: "rgb(0, 0, 0)" + } + }, { + types: ["class-name", "attr-name"], + style: { + color: "rgb(255, 203, 107)" + } + }, { + types: ["tag", "deleted"], + style: { + color: "rgb(255, 85, 114)" + } + }, { + types: ["operator"], + style: { + color: "rgb(0, 0, 0)" + } + }, { + types: ["boolean"], + style: { + color: "rgb(6, 140, 0)", + fontWeight: "bold", + } + }, { + types: ["keyword"], + style: { + color: "rgb(3, 77, 0)", + fontWeight: "bold" + } + }, { + types: ["doctype"], + style: { + color: "rgb(199, 146, 234)", + fontStyle: "italic" + } + }, { + types: ["namespace"], + style: { + color: "rgb(178, 204, 214)", + fontWeight: "bold" + } + }, { + types: ["url"], + style: { + color: "rgb(221, 221, 221)" + } + }] +}; + +module.exports = theme; \ No newline at end of file diff --git a/src/theme/highlight/themes/default4D_Light/index.js b/src/theme/highlight/themes/default4D_Light/index.js new file mode 100644 index 00000000000000..02e14d574b7906 --- /dev/null +++ b/src/theme/highlight/themes/default4D_Light/index.js @@ -0,0 +1,84 @@ +// Converted automatically using ./tools/themeFromVsCode +var theme = { + plain: { + color: "#000000", + backgroundColor: "#F6F8FA" + }, + styles: [{ + types: ["comment"], + style: { + color: "rgb(83, 83, 83)", + } + }, { + types: ["string", "inserted"], + style: { + color: "rgb(0, 0, 0)" + } + }, { + types: ["number"], + style: { + color: "rgb(0, 0, 0)" + } + }, { + types: ["builtin", "char", "constant", "function"], + style: { + color: "rgb(6, 140, 0)", + fontWeight: "bold", + } + }, { + types: ["punctuation", "selector"], + style: { + color: "rgb(0, 0, 0)" + } + }, { + types: ["variable"], + style: { + color: "rgb(0, 49, 225)" + } + }, { + types: ["class-name", "attr-name"], + style: { + color: "rgb(255, 203, 107)" + } + }, { + types: ["tag", "deleted"], + style: { + color: "rgb(255, 85, 114)" + } + }, { + types: ["operator"], + style: { + color: "rgb(0, 0, 0)" + } + }, { + types: ["boolean"], + style: { + color: "rgb(6, 140, 0)", + fontWeight: "bold", + } + }, { + types: ["keyword"], + style: { + color: "rgb(3, 77, 0)", + fontWeight: "bold" + } + }, { + types: ["doctype"], + style: { + color: "rgb(199, 146, 234)", + fontStyle: "italic" + } + }, { + types: ["namespace"], + style: { + color: "rgb(178, 204, 214)" + } + }, { + types: ["url"], + style: { + color: "rgb(221, 221, 221)" + } + }] +}; + +export default theme; \ No newline at end of file