fix(blog): use landing theme variables in MDX components

[waleedlatif1]

Summary

• Fixed inline code blocks on blog posts rendering with a near-white background (--surface-4) instead of the dark landing theme background — this caused text to be invisible
• Fixed p, ul, and ol MDX components using workspace theme variable --text-subtle instead of the landing theme variable --landing-text-muted

Type of Change

• Bug fix

Testing

Tested manually

Checklist

• Code follows project style guidelines
• Self-reviewed my changes
• Tests added/updated and passing
• No new warnings introduced
• I confirm that I have read and agree to the terms outlined in the Contributor License Agreement (CLA)

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

1 Skipped Deployment

Project	Deployment	Actions	Updated (UTC)
docs	Skipped		Apr 2, 2026 7:16pm

[cursor]

PR Summary

Low Risk
Low risk styling-only change: swaps CSS variables for blog MDX text and inline code backgrounds, with no logic or data-flow impact.

Overview
Blog MDX rendering now consistently uses the landing theme color variables: paragraph/list text switches from --text-subtle to --landing-text-muted, and inline code background switches from --surface-4 to --landing-bg-elevated to avoid low-contrast code on dark pages.

^{Written by Cursor Bugbot for commit c9d7732. Configure here.}

[greptile-apps]

Greptile Summary

This PR fixes a theming bug in the blog's MDX component definitions where workspace-scoped CSS variables were being used in the landing-page context. The blog lives under the landing theme, so --text-subtle and --surface-4 resolved to workspace values (a near-white background for inline code, and wrong text muted colour for paragraphs and lists), making content invisible or incorrectly styled.

Changes:

• p, ul, ol: --text-subtle → --landing-text-muted
• Inline code background: --surface-4 → --landing-bg-elevated

The fix is minimal, well-scoped, and consistent with the rest of the file, which already used --landing-text and --landing-bg-elevated on other elements (h2–h4, strong, a, hr).

Confidence Score: 5/5

Safe to merge — targeted, correct theming fix with no logic changes or regressions.

All four changed lines are straightforward CSS variable substitutions that align the blog MDX components with the existing landing-theme pattern already used throughout the same file. No logic, data flow, or API surface is affected. No new issues introduced.

No files require special attention.

Important Files Changed

Filename	Overview
apps/sim/lib/blog/mdx.tsx	Fixes CSS variable mismatches in MDX components — swaps workspace theme vars (--text-subtle, --surface-4) for landing theme vars (--landing-text-muted, --landing-bg-elevated) on p, ul, ol, and inline code elements.

Flowchart

%%{init: {'theme': 'neutral'}}%%
flowchart TD
    A[MDX Content] --> B{Element type?}
    B -->|h2 / h3 / h4 / strong / a| C["--landing-text (unchanged)"]
    B -->|p / ul / ol| D["--landing-text-muted (was --text-subtle)"]
    B -->|inline code| E["bg: --landing-bg-elevated (was --surface-4)"]
    B -->|fenced code block| F[CodeBlock component]
    B -->|hr| G["border: --landing-bg-elevated (unchanged)"]

Loading

_{Reviews (1): Last reviewed commit: "fix(blog): use landing theme variables i..." | Re-trigger Greptile}