QT/sure
1
0
Fork 0
mirror of https://github.com/we-promise/sure.git synced 2026-05-10 22:25:00 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(design-system): make inline <code> visible in prose dark mode (#1625)

Browse Source 
prose.css already overrides <strong> and the heading family for dark
mode, but inline <code> 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 <code> 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.
This commit is contained in:
Guillem Arias Fauste
2026-05-01 21:49:22 +02:00
committed by GitHub
parent b710b55124
commit f45c7b33fd
1 changed files with 8 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
app/assets/tailwind/sure-design-system/prose.css
View File

@@ -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;
}