From f45c7b33fdb03f4f8ad1c0b8b9f9d016c26e7512 Mon Sep 17 00:00:00 2001 From: Guillem Arias Fauste Date: Fri, 1 May 2026 21:49:22 +0200 Subject: [PATCH] fix(design-system): make inline visible in prose dark mode (#1625) prose.css already overrides and the heading family for dark mode, but inline was missing the same treatment. The Tailwind Typography plugin's default code color (designed for the light prose theme) fell through unchanged in dark mode, producing a near-black foreground on the dark page background. URLs and other technical references rendered as were effectively invisible. Adding a third override block in the same shape as the existing two: white text on a gray-800 chip in dark mode. Light mode keeps the plugin defaults. Spotted on the Mercury settings panel while reviewing #1621, but the bug applies to every .prose consumer (AI chat, GitHub release notes, dashboard prose blocks, etc.). Closes #1624. --- app/assets/tailwind/sure-design-system/prose.css | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/app/assets/tailwind/sure-design-system/prose.css b/app/assets/tailwind/sure-design-system/prose.css index 85b7892c0..68f6ad482 100644 --- a/app/assets/tailwind/sure-design-system/prose.css +++ b/app/assets/tailwind/sure-design-system/prose.css @@ -14,3 +14,11 @@ .prose:where([data-theme=dark], [data-theme=dark] *) thead th { color: theme(colors.white) !important; } + +/* Inline code in prose under dark mode. Without this the Tailwind Typography + plugin's default near-black foreground falls through and disappears against + the dark page background. */ +.prose:where([data-theme=dark], [data-theme=dark] *) code { + color: theme(colors.white) !important; + background-color: theme(colors.gray.800) !important; +}