fix(LandingCodeExampleCard): prevent horizontal overflow on mobile

[sukvvon]

Summary

Wrap Tabs (with CodeBlock children) in a max-w-full min-w-0 container so the landing code example stays within the parent width on mobile, allowing the inner overflow-x-auto to take effect.

Why

In the parent flex flex-col items-center layout, flex items default to min-width: auto, so Tabs and CodeBlock expanded to their natural content width (~496px) and overflowed past the mobile viewport (375px). The last tab (angular) was clipped and content appeared to overflow horizontally.

Behavior

• Desktop: unchanged
• Mobile: Tabs and CodeBlock are constrained to the parent width and scroll horizontally within their own containers (no page-level horizontal scroll)

Screenshot

AS-IS

TO-BE

[netlify]

👷 Deploy request for tanstack pending review.

Visit the deploys page to approve it

Name	Link
🔨 Latest commit	d30f9b7

[coderabbitai]

📝 Walkthrough

Walkthrough

The LandingCodeExampleCard component is restructured to wrap its Tabs UI in a container with width constraints and refactor the per-framework tab rendering logic to use an explicit early-return pattern for missing code entries.

Changes

Cohort / File(s)	Summary
Component Restructuring src/components/landing/LandingCodeExampleCard.server.tsx	Wraps Tabs in max-w-full min-w-0 container for layout control. Restructures per-framework rendering with early-return when framework code is absent, falling back to optional renderFallback or null. Continues rendering CodeBlock and <code> element when code exists.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

Poem

🐰 A tab now wrapped with tidy care,
Early returns flow through the air,
When code is lost, we fallback swift,
Container bounds our layout gift! ✨

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%.	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (4 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title accurately describes the main change: preventing horizontal overflow on mobile by wrapping the Tabs component in a max-w-full min-w-0 container to constrain it to parent width.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests

---

_{Comment @coderabbitai help to get the list of available commands and usage tips.}