site: Convert inline CSS style attributes to JSX for MDX compatibility - #30702
site: Convert inline CSS style attributes to JSX for MDX compatibility#30702alexeagle wants to merge 1 commit into
Conversation
Mintlify/MDX cannot parse HTML style="..." on JSX elements; use style={{...}}
with camelCase property names so affected doc pages render instead of 500ing.
Fixes bazelbuild#30658 and bazelbuild#30668
|
✅ Bazel docs preview is ready! Preview URL: https://bazel-pr-30702.mintlify.app/ Updated for |
Visual verification (Mintlify preview)Preview base: https://bazel-pr-30702.mintlify.app/ These pages previously returned HTTP 500 or were excluded from the build due to
|
Visual verification (Mintlify preview)Preview: https://bazel-pr-30702.mintlify.app/ Verified locally via Playwright screenshots (HTTP 200, full page render):
Screenshots captured at |
1 participant
Summary
Mintlify renders hand-authored MDX as JSX. HTML-style
style="property: value"attributes are not valid in MDX and cause pages to fail with HTTP 500 errors or be silently excluded from the site build.This change converts all inline
style="..."attributes to JSX object formstyle={{...}}, with CSS property names in camelCase and values as strings—matching the approach in #30657.Root cause: MDX expects JSX-style objects for inline styles, not HTML string attributes.
Example (from
docs/release/rolling.mdx):Before:
After:
Affected pages (unversioned + all
docs/versions/*/copies)docs/configure/attributes.mdxdocs/docs/configurable-attributes.mdxdocs/release/rolling.mdxdocs/external/mod-command.mdxdocs/external/migration_tool.mdxdocs/contribute/search.mdx66 files updated (6 top-level pages + versioned mirrors where those paths exist).
Proof (post-fix excerpts)
docs/release/rolling.mdx:docs/configure/attributes.mdx:docs/external/mod-command.mdx:docs/contribute/search.mdx:docs/external/migration_tool.mdx:Fixes #30658
Fixes #30668
Test plan