From 1a6b9d4333acf6c2e02016d0a8fd8572eef9c194 Mon Sep 17 00:00:00 2001 From: Local Administrator Date: Wed, 3 Jun 2026 16:49:48 +0000 Subject: [PATCH] =?UTF-8?q?fix(contrast):=20article-body=20white-on-white?= =?UTF-8?q?=20=E2=80=94=20body/dropcap/h2/h3/blockquote/links=20to=20navy?= =?UTF-8?q?=20+=20slate,=20drop=20prose-invert?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Article detail pages (/news/[slug] and /articles/[slug]) inherited a dark-theme prose color palette via the .bb-article-prose ruleset + Tailwind's prose-invert utility. With the new light surface, every text element in the article body rendered near-white on white, while the H1 (fixed in the prior commit) was already navy. Bringing the body in line: src/styles/tailwind.css: - .bb-article-prose wrapper #d6d4d0 -> #1e293b !important (slate-800 for long-form body) - .bb-article-prose p:first-of-type #e8e6e0 -> #1e293b - .bb-article-prose first-letter #f0eee8 -> #0F172A (drop-cap full navy) - .bb-article-prose h2 #f5f3ee -> #0F172A (in-body subhead matches the page H1) - .bb-article-prose h3 #ece9e2 -> #0F172A - .bb-article-prose blockquote #e8e6e0 -> #1e293b - .bb-article-prose a (BASE) #d6d4d0 -> #1D4ED8 (inline links visibly blue at rest, no longer invisible-until-hover; hover unchanged) src/app/news/[slug]/NewsArticleDetailClient.tsx src/app/articles/[slug]/ArticleDetailClient.tsx - Drop 'prose-invert' from the wrapper className on both routes so any descendant the bb-article-prose rules don't explicitly color (lists, strong, em, captions) falls back to Tailwind Typography's default light-page slate-700 palette. --- src/app/articles/[slug]/ArticleDetailClient.tsx | 2 +- src/app/news/[slug]/NewsArticleDetailClient.tsx | 2 +- src/styles/tailwind.css | 14 +++++++------- 3 files changed, 9 insertions(+), 9 deletions(-) diff --git a/src/app/articles/[slug]/ArticleDetailClient.tsx b/src/app/articles/[slug]/ArticleDetailClient.tsx index 6c4385d..1a6bb2f 100644 --- a/src/app/articles/[slug]/ArticleDetailClient.tsx +++ b/src/app/articles/[slug]/ArticleDetailClient.tsx @@ -356,7 +356,7 @@ export default function ArticleDetailClient({ article, relatedArticles, relatedF {/* Article Body */} {/* DO NOT OVERRIDE — article body prose styles */}
diff --git a/src/app/news/[slug]/NewsArticleDetailClient.tsx b/src/app/news/[slug]/NewsArticleDetailClient.tsx index c564fd8..6d286d6 100644 --- a/src/app/news/[slug]/NewsArticleDetailClient.tsx +++ b/src/app/news/[slug]/NewsArticleDetailClient.tsx @@ -458,7 +458,7 @@ export default function NewsArticleDetailClient({ {/* Tags */} diff --git a/src/styles/tailwind.css b/src/styles/tailwind.css index 11b73e9..e6af845 100644 --- a/src/styles/tailwind.css +++ b/src/styles/tailwind.css @@ -1589,7 +1589,7 @@ a.company-mention:hover { font-family: Georgia, "Cheltenham Subhead", Charter, "Times New Roman", Times, serif !important; font-size: 19px !important; line-height: 1.75 !important; - color: #d6d4d0 !important; + color: #1e293b !important; max-width: 720px; margin-left: auto; margin-right: auto; @@ -1602,7 +1602,7 @@ a.company-mention:hover { .bb-article-prose p:first-of-type { font-size: 22px; line-height: 1.6; - color: #e8e6e0; + color: #1e293b; } .bb-article-prose p:first-of-type::first-letter { float: left; @@ -1610,7 +1610,7 @@ a.company-mention:hover { font-size: 64px; line-height: 0.95; font-weight: 700; - color: #f0eee8; + color: #0F172A; padding: 6px 10px 0 0; margin-top: 4px; } @@ -1618,7 +1618,7 @@ a.company-mention:hover { font-family: Georgia, "Cheltenham Subhead", Charter, serif; font-size: 28px; font-weight: 700; - color: #f5f3ee; + color: #0F172A; margin: 2em 0 0.6em; letter-spacing: -0.01em; line-height: 1.25; @@ -1627,7 +1627,7 @@ a.company-mention:hover { font-family: Georgia, "Cheltenham Subhead", Charter, serif; font-size: 22px; font-weight: 700; - color: #ece9e2; + color: #0F172A; margin: 1.6em 0 0.5em; line-height: 1.3; } @@ -1638,7 +1638,7 @@ a.company-mention:hover { font-style: italic; font-size: 22px; line-height: 1.5; - color: #e8e6e0; + color: #1e293b; } .bb-article-prose blockquote::before { content: "“"; @@ -1651,7 +1651,7 @@ a.company-mention:hover { opacity: 0.55; } .bb-article-prose a { - color: #d6d4d0; + color: #1D4ED8; text-decoration: underline; text-decoration-color: rgba(0, 212, 255, 0.5); text-underline-offset: 3px;