From 8fc4806400ca497ac45ed31141cd5c95c4ed86b2 Mon Sep 17 00:00:00 2001 From: Aaron Powell Date: Mon, 17 Aug 2026 10:18:26 +1000 Subject: [PATCH] fix(website): resolve article text colour inside themed scope Injected markdown inherited color from body, which sits outside the ThemeProvider and always resolved the light-mode token, making body copy unreadable in dark mode. Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com> Copilot-Session: 80686fef-efe3-4cdd-8cd6-bfa61a5d0af6 --- .../src/components/brand/styles/dotnet-upgrade.module.css | 5 +++++ .../components/brand/styles/github-copilot-app.module.css | 5 +++++ 2 files changed, 10 insertions(+) diff --git a/website/src/components/brand/styles/dotnet-upgrade.module.css b/website/src/components/brand/styles/dotnet-upgrade.module.css index e8a01566..854b9221 100644 --- a/website/src/components/brand/styles/dotnet-upgrade.module.css +++ b/website/src/components/brand/styles/dotnet-upgrade.module.css @@ -515,6 +515,11 @@ display: flex; flex-direction: column; gap: var(--base-size-16); + /* Raw markdown is injected here without Primer Brand components, so it would + otherwise inherit `color` from `body` — which sits *outside* the + ThemeProvider and therefore always resolves the light-mode token. Setting + it here resolves the token inside the themed scope instead. */ + color: var(--brand-color-text-default); /* Large base padding around the text on all sides of the content column. */ padding: var(--base-size-32); /* Section divider — kept inside the left (text) column only, spanning from its diff --git a/website/src/components/brand/styles/github-copilot-app.module.css b/website/src/components/brand/styles/github-copilot-app.module.css index 5eaa90aa..78c277c8 100644 --- a/website/src/components/brand/styles/github-copilot-app.module.css +++ b/website/src/components/brand/styles/github-copilot-app.module.css @@ -940,6 +940,11 @@ display: flex; flex-direction: column; gap: var(--base-size-16); + /* Raw markdown is injected here without Primer Brand components, so it would + otherwise inherit `color` from `body` — which sits *outside* the + ThemeProvider and therefore always resolves the light-mode token. Setting + it here resolves the token inside the themed scope instead. */ + color: var(--brand-color-text-default); padding: var(--base-size-32); border-block-start: var(--brand-borderWidth-thin) solid var(--brand-color-border-muted);