[Suggestion]: Add full-screen / immersive mode for code blocks on mobile #8723

Summary

Add a full-screen / immersive mode for code blocks and interactive sandboxes on mobile viewports to prevent the "tunnel effect" on small screens

Page

https://react.dev/

Details

Is there an existing issue for this ?

• I have searched the existing issues

Summary

Add a "Full-screen" or immersive focus mode button for code blocks and interactive sandboxes on mobile devices to prevent the "tunnel effect" in small viewports.

What problem does this feature solve ?

When browsing react.dev on mobile (smartphones with narrow viewports), interacting with code sandboxes or viewing long code snippets can feel cramped. Users have to scroll through tiny frames where both the code and the live preview compete for vertical space, making it difficult to read or test code comfortably.

Desired Solution

• Add a subtle "Full-screen" / "Expand" icon button at the top-right corner of code blocks/sandboxes on mobile resolutions.
• Tapping it should open an immersive full-screen modal or focus view containing the code editor and preview, giving the user enough breathing room to interact with the example.
• A clear "Close" or "Exit" button to return to the normal page flow.

Additional context

This would significantly improve the mobile learning experience for developers reading the docs on the go !