fix: remove horizontal scroll on mobile

[Copilot]

Mobile browsers (particularly iOS Safari) can expose a horizontal scroll despite overflow-x: hidden on both html and body, due to how position: fixed elements near the right viewport edge contribute to scroll-width calculations, and grid columns with hard pixel minimums overflowing narrow containers.

Changes

• styles/base.css — add overflow: hidden to .github-corner
  Prevents the position: fixed; right: 0 anchor element from being included in iOS Safari's viewport scroll-width calculation.

• styles/content-pages.css — tighten .news-grid column minimum
  minmax(300px, 1fr) → minmax(min(300px, 100%), 1fr)
  On 320 px viewports the content area is ~280 px; a hard 300 px minimum overflows the container by 20 px. The min() clamp ensures the floor never exceeds the available width.

Summary by CodeRabbit

• Bug Fixes
  • Fixed horizontal scrolling issue affecting iOS Safari users
  • Improved responsive grid layout for better display on smaller screens

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Repository UI

Review profile: CHILL

Plan: Pro Plus

Run ID: f26891a1-67d2-41dd-a0b9-2dab88d0ea6c

📥 Commits

Reviewing files that changed from the base of the PR and between 99df9d1 and ef79d8e.

📒 Files selected for processing (2)

• styles/base.css
• styles/content-pages.css

---

📝 Walkthrough

I Pity the Foo' Who Don't Read This PR, Sucka!

Walkthrough

Listen up, fool! This PR be droppin' some CSS fixes on ya to squash mobile horizontal scrolling issues and make that grid layout more responsive. We be tweakin' the .github-corner overflow handling and updating .news-grid constraints, jibber jabber!

Changes

Cohort / File(s)	Summary
Mobile Scroll Prevention styles/base.css	Adds overflow: hidden to .github-corner element to prevent spurious horizontal scrolling on iOS Safari by excluding it from viewport scroll-width calculations.
Responsive Grid Layout styles/content-pages.css	Updates .news-grid minmax minimum from fixed 300px to min(300px, 100%), allowing grid items to shrink their minimum width when container space is constrained.

Estimated code review effort

🎯 1 (Trivial) | ⏱️ ~3 minutes

Possibly related PRs

• fix: fix mobile layout clipping for GitHub corner, Share Doom button, and grim reaper #67: Addresses the same mobile horizontal overflow issue in CSS layout rules affecting .github-corner and base overflow handling.

---

I pity the fool who doesn't test these responsive changes on mobile devices, sucka! 💪

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title 'fix: remove horizontal scroll on mobile' directly and clearly summarizes the main objective of the changeset—addressing horizontal scrolling issues on mobile devices, which is the primary focus of both CSS modifications.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
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.

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

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch copilot/remove-horizontal-scroll-mobile

---

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

[github-actions]

👁️ PR Preview

🚀 Open Preview

Deployed from commit ef79d8e · Updates on every push to this PR
(Preview is removed automatically when the PR is closed.)

[codecov]

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 100.00%. Comparing base (99df9d1) to head (ef79d8e).
⚠️ Report is 1 commits behind head on main.

Additional details and impacted files

@@            Coverage Diff            @@
##              main       #87   +/-   ##
=========================================
  Coverage   100.00%   100.00%           
=========================================
  Files            1         1           
  Lines          242       242           
  Branches       109       109           
=========================================
  Hits           242       242           

Flag	Coverage Δ
unit	100.00% <ø> (ø)

Flags with carried forward coverage won't be shown. Click here to find out more.

---

Continue to review full report in Codecov by Sentry.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 99df9d1...ef79d8e. Read the comment docs.

🚀 New features to boost your workflow:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.