From f3e49857cb2c720fc2b5d7986af9f3a36423f235 Mon Sep 17 00:00:00 2001 From: soundproofboot Date: Mon, 16 Jun 2025 16:42:34 -0500 Subject: [PATCH 1/7] docs(docusaurus): add support for diff language syntax highlighting --- docusaurus.config.js | 2 +- src/styles/components/_code.scss | 11 +++++++++-- 2 files changed, 10 insertions(+), 3 deletions(-) diff --git a/docusaurus.config.js b/docusaurus.config.js index 41423df2dae..09603acadca 100644 --- a/docusaurus.config.js +++ b/docusaurus.config.js @@ -324,7 +324,7 @@ module.exports = { prism: { theme: { plain: {}, styles: [] }, // https://github.com/FormidableLabs/prism-react-renderer/blob/e6d323332b0363a633407fabab47b608088e3a4d/packages/generate-prism-languages/index.ts#L9-L25 - additionalLanguages: ['shell-session', 'http'], + additionalLanguages: ['shell-session', 'http', 'diff'], }, algolia: { appId: 'O9QSL985BS', diff --git a/src/styles/components/_code.scss b/src/styles/components/_code.scss index 667af512822..f5614926f6b 100644 --- a/src/styles/components/_code.scss +++ b/src/styles/components/_code.scss @@ -175,6 +175,13 @@ pre[class*='language-'] { cursor: help; } -.token.deleted { - color: red; +// diff code block highlighting +.language-diff .token.deleted { + color: rgb(50, 0, 0); + background-color: rgba(255, 0, 0, 0.05); +} + +.language-diff .token.inserted { + color: darkgreen; + background-color: rgba(0, 255, 0, 0.05); } From 3f2af37f5fb8b4109fa42fac23e7a88abce83fa6 Mon Sep 17 00:00:00 2001 From: soundproofboot Date: Mon, 16 Jun 2025 16:47:52 -0500 Subject: [PATCH 2/7] docs(docusaurus): add .token.deleted css selector back in case used elsewhere --- src/styles/components/_code.scss | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/src/styles/components/_code.scss b/src/styles/components/_code.scss index f5614926f6b..7371b46cc4d 100644 --- a/src/styles/components/_code.scss +++ b/src/styles/components/_code.scss @@ -175,6 +175,10 @@ pre[class*='language-'] { cursor: help; } +.token.deleted { + color: red; +} + // diff code block highlighting .language-diff .token.deleted { color: rgb(50, 0, 0); From b429322765c13781e99e254f7be3dd0b33c69322 Mon Sep 17 00:00:00 2001 From: soundproofboot Date: Tue, 17 Jun 2025 13:55:46 -0500 Subject: [PATCH 3/7] docs(docusaurus): remove diff style section, move diff selectors to existing colors --- src/styles/components/_code.scss | 17 ++++------------- 1 file changed, 4 insertions(+), 13 deletions(-) diff --git a/src/styles/components/_code.scss b/src/styles/components/_code.scss index 7371b46cc4d..72d3e8f4bd2 100644 --- a/src/styles/components/_code.scss +++ b/src/styles/components/_code.scss @@ -149,7 +149,8 @@ pre[class*='language-'] { .token.attr-value, .language-css .token.string, .style .token.string, -.token.variable { +.token.variable, +.language-diff .token.inserted { color: #42b983; } @@ -159,7 +160,8 @@ pre[class*='language-'] { .token.regex, .token.keyword, -.token.important { +.token.important, +.language-diff .token.deleted { color: #f55073; } @@ -178,14 +180,3 @@ pre[class*='language-'] { .token.deleted { color: red; } - -// diff code block highlighting -.language-diff .token.deleted { - color: rgb(50, 0, 0); - background-color: rgba(255, 0, 0, 0.05); -} - -.language-diff .token.inserted { - color: darkgreen; - background-color: rgba(0, 255, 0, 0.05); -} From b63c03ff6fa4b198cc3e9a12461603b196981e5b Mon Sep 17 00:00:00 2001 From: soundproofboot Date: Wed, 18 Jun 2025 14:50:47 -0500 Subject: [PATCH 4/7] docs(docusaurus): remove parent diff selector after verifying inserted, deleted class only for diff blocks --- src/styles/components/_code.scss | 8 +++----- 1 file changed, 3 insertions(+), 5 deletions(-) diff --git a/src/styles/components/_code.scss b/src/styles/components/_code.scss index 72d3e8f4bd2..eb161f1d8d6 100644 --- a/src/styles/components/_code.scss +++ b/src/styles/components/_code.scss @@ -137,8 +137,7 @@ pre[class*='language-'] { .token.selector, .token.char, .token.function, -.token.builtin, -.token.inserted { +.token.builtin { color: #ff6810; } @@ -150,7 +149,7 @@ pre[class*='language-'] { .language-css .token.string, .style .token.string, .token.variable, -.language-diff .token.inserted { +.token.inserted { color: #42b983; } @@ -160,8 +159,7 @@ pre[class*='language-'] { .token.regex, .token.keyword, -.token.important, -.language-diff .token.deleted { +.token.important { color: #f55073; } From 9176e5b61e61fce36634152883d956176c24d9dc Mon Sep 17 00:00:00 2001 From: Colin Bares Date: Fri, 27 Jun 2025 10:43:33 -0500 Subject: [PATCH 5/7] docs(css): document .token.deleted selector --- src/styles/components/_code.scss | 1 + 1 file changed, 1 insertion(+) diff --git a/src/styles/components/_code.scss b/src/styles/components/_code.scss index eb161f1d8d6..cb4fad89d21 100644 --- a/src/styles/components/_code.scss +++ b/src/styles/components/_code.scss @@ -175,6 +175,7 @@ pre[class*='language-'] { cursor: help; } +// Code removals (indicated by a leading '-') within a diff. .token.deleted { color: red; } From baec2ed05359494e2d72ae83a8ad10ad53db5cec Mon Sep 17 00:00:00 2001 From: Colin Bares Date: Fri, 27 Jun 2025 10:45:11 -0500 Subject: [PATCH 6/7] docs(css): document .token.inserted selector Co-authored-by: Maria Hutt --- src/styles/components/_code.scss | 1 + 1 file changed, 1 insertion(+) diff --git a/src/styles/components/_code.scss b/src/styles/components/_code.scss index cb4fad89d21..27dc2a1b0d3 100644 --- a/src/styles/components/_code.scss +++ b/src/styles/components/_code.scss @@ -149,6 +149,7 @@ pre[class*='language-'] { .language-css .token.string, .style .token.string, .token.variable, +// Code additions (indicated by a leading '+') within a diff. .token.inserted { color: #42b983; } From e957278822c1b905c4a808fb5ecc71c2996e527e Mon Sep 17 00:00:00 2001 From: Colin Bares Date: Fri, 27 Jun 2025 10:45:57 -0500 Subject: [PATCH 7/7] docs(docusaurus): update Prism language link Co-authored-by: Maria Hutt --- docusaurus.config.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/docusaurus.config.js b/docusaurus.config.js index 09603acadca..e7b90b1c434 100644 --- a/docusaurus.config.js +++ b/docusaurus.config.js @@ -323,7 +323,8 @@ module.exports = { }, prism: { theme: { plain: {}, styles: [] }, - // https://github.com/FormidableLabs/prism-react-renderer/blob/e6d323332b0363a633407fabab47b608088e3a4d/packages/generate-prism-languages/index.ts#L9-L25 + // Prism provides a [default list of languages](https://github.com/FormidableLabs/prism-react-renderer/blob/e1c83a468b05df7f452b3ad7e4ae5ab874574d4e/packages/generate-prism-languages/index.ts#L9-L26). + // A list of [additional languages](https://prismjs.com/#supported-languages) that are supported can be found at their website. additionalLanguages: ['shell-session', 'http', 'diff'], }, algolia: {