From 7f0d71cdb120b24801b165d84feacc67049f656d Mon Sep 17 00:00:00 2001
From: Francesco Sansalvadore <f.sansalvadore@gmail.com>
Date: Mon, 6 Jul 2026 19:47:13 +0200
Subject: [PATCH] fix(docs): restore bold weight in .prose body text (#47647)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

## I have read the
[CONTRIBUTING.md](https://github.com/supabase/supabase/blob/master/CONTRIBUTING.md)
file.

YES

## What kind of change does this PR introduce?

Bug fix.

## What is the current behavior?

In the docs site, **bold** text inside `.prose` content no longer
renders as bold — it is indistinguishable from normal body text in light
mode, and only a faint step heavier in dark mode.

Root cause: the recent font work added a docs-only rule in
`apps/docs/styles/globals.css`:

```css
.prose :where(p, a, code, pre):not(...),
.prose :where(ol > li):not(...)::marker {
  font-weight: inherit;
}
```

This makes prose body text inherit the page base weight set on `html`
(`font-weight: 500` in light, `450` in dark). But the shared typography
config (`packages/config/typography.config.js`) defines `strong: {
fontWeight: '500' }`. So:

- **Light mode:** body copy is now `500` and `<strong>` is also `500` →
bold is visually identical to normal text.
- **Dark mode:** body copy is `450` vs `<strong>` `500` → barely
perceptible.

This is docs-specific: the other apps (`www`, etc.) never added the
`font-weight: inherit` override, so their prose body stays at `400` and
`strong: 500` still reads as bold. Changing the shared config would
over-bolden those apps, so the fix is scoped to the docs stylesheet.

## What is the new behavior?

Adds a docs-scoped override keeping bold text clearly heavier than the
inherited body weight:

```css
.prose :where(strong, b):not(:where([class~='not-prose'], [class~='not-prose'] *)) {
  font-weight: 600;
}
```

`<strong>`/`<b>` now render at `600`, giving clear contrast against the
`500`/`450` body weight in both light and dark modes, and matching the
semibold weight used by prose headings. The other apps are untouched.

## Additional context

- Single-file change in `apps/docs/styles/globals.css`.
- Uses the same `:where(... :not(.not-prose) ...)` pattern as the
surrounding prose rules to preserve `not-prose` opt-outs and keep
zero-specificity behavior.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

https://claude.ai/code/session_01RaT19RpEWwDFtzmVwmsPHo

---
_Generated by [Claude
Code](https://claude.ai/code/session_01RaT19RpEWwDFtzmVwmsPHo)_

<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

* **Bug Fixes**
* Improved documentation typography so emphasized (bold) text is more
clearly distinguishable from regular body copy.
* Added a targeted prose styling override for `strong`/`b` to ensure
consistent bold weight, while preserving sections that opt out of prose
styling.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Claude <noreply@anthropic.com>
Co-authored-by: Miranda Limonczenko <miranda.limonczenko@supabase.io>
---
 apps/docs/styles/globals.css | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/apps/docs/styles/globals.css b/apps/docs/styles/globals.css
index b9cdc543d93..3fdd46001d9 100644
--- a/apps/docs/styles/globals.css
+++ b/apps/docs/styles/globals.css
@@ -150,6 +150,12 @@ h6:not(.font-mono),
   font-weight: inherit;
 }
 
+/* Body text inherits a heavier base weight, so override the shared `strong: 500`
+ * to keep bold text visually distinct. */
+.prose :where(strong, b):not(:where([class~='not-prose'], [class~='not-prose'] *)) {
+  font-weight: 700;
+}
+
 .prose :where(h1, h2, h3, h4, h5, h6):not(:where([class~='not-prose'], [class~='not-prose'] *)) {
   @apply font-heading font-semibold;
 }