Fix/changelog mobile responsive

[HarshMN2345]

What does this PR do?

(Provide a description of what this PR does.)

Test Plan

before:

after:

Related PRs and Issues

(If this PR is related to any other PR or resolves any issue or related to any issue link all related PR and issues here.)

Have you read the Contributing Guidelines on issues?

(Write your answer here.)

[appwrite]

Appwrite Website

Project ID: 69d7efb00023389e8d27

Sites (1)

Site	Status	Logs	Preview	QR
website 69d7f2670014e24571ca	Failed	View Logs	Preview URL

Website (appwrite/website)

Project ID: 684969cb000a2f6c0a02

Sites (1)

Site	Status	Logs	Preview	QR
website 68496a17000f03d62013	Queued	View Logs	Preview URL

---

Tip

Function scopes give you fine-grained control over API permissions

[greptile-apps]

Greptile Summary

This PR fixes horizontal-overflow and layout-collapse issues on the changelog page for small viewports by propagating min-width: 0 through the flex/grid chain and adding context-aware scroll behaviour to code snippets.

• code.ts adds web-code-pre and web-code-body classes so Fence.svelte can target them with :global() selectors; the in-changelog CSS class is then used to give code blocks overflow-x: auto and min-width: max-content (for line-number blocks) only within the changelog layout.
• +page.svelte and ChangelogEntry.svelte receive min-width: 0 on the grid/list containers and items, preventing child elements from stretching past the viewport, and the changelog heading gets explicit inline padding at ≤ 512 px.

Confidence Score: 5/5

Safe to merge — changes are scoped to layout and styling with no data or logic mutations.

All changes are CSS/layout fixes with no JavaScript logic or data-fetching changes. The context-detection approach (isInChangelog) mirrors the existing isInTutorialDocs pattern already proven in the codebase, the :global() selectors are correctly scoped under .in-changelog, and min-width: 0 additions are the standard fix for flex/grid children that collapse or overflow.

No files require special attention.

Important Files Changed

Filename	Overview
src/lib/utils/code.ts	Adds web-code-pre class to <pre> and web-code-body class to <code> in the generated HTML, enabling targeted CSS selectors in Fence.svelte for changelog-specific scroll behaviour.
src/markdoc/nodes/Fence.svelte	Imports isInChangelog to conditionally apply an in-changelog CSS class; adds scoped styles for horizontal scrolling of code snippets in the changelog context.
src/routes/changelog/ChangelogEntry.svelte	Adds min-w-0 Tailwind classes and corresponding SCSS min-width: 0 rules (duplicate of the utility), plus overflow-x: clip on the entry content wrapper to prevent horizontal bleed.
src/routes/changelog/[[page]]/+page.svelte	Applies min-width: 0 to the wrapper, list, and list items to fix grid/flex overflow; adds mobile padding for the heading at ≤512 px and scopes the media-query rule to .changelog-list instead of bare ul.

_{Reviews (2): Last reviewed commit: "Clean up changelog code block overflow s..." | Re-trigger Greptile}