Fix broken documentation pages in mobile view

[khuddite]

Fixes: #8396

1. Summary
   The document content container is missing width and has only padding CSS property, which means the width can overflow its parent based on the content. The code block inside headings was missing fontSize for mobile view, it was set for only desktop views.

2. Solution
   I set width for document content container and fontSize for code blocks in headings for mobile view.

3. Screenshots

[greptile-apps]

PR Summary

This PR fixes mobile view layout issues in the documentation pages by addressing content overflow and code block font sizing problems.

• Added width: 100% to StyledWrapper in DocsContent.tsx for screens under 450px to prevent content overflow
• Added font-size: 16px for code blocks within h1-h4 headings in ArticleContent.tsx for screens under 810px
• Fixed responsive layout in DocsContent.tsx with proper media query breakpoints for different screen sizes
• Improved mobile readability by adjusting heading font sizes in ArticleContent.tsx for screens under 810px

_{2 file(s) reviewed, no comment(s)
Edit PR Review Bot Settings | Greptile}

[FelixMalfait]

Thank you!

[github-actions]

Thanks @khuddite for your contribution!
This marks your 4th PR on the repo. You're top 9% of all our contributors 🎉
See contributor page - Share on LinkedIn - Share on Twitter