docs a11y: wrap code blocks instead of overflowing

[geoffrich]

This PR resolves one of the Axe accessibility violations in #5678: Ensure that scrollable region has keyboard access (74 count).

The code blocks were set to overflow: auto so that they would horizontally scroll when the content became too long. However, this had accessibility issues because keyboard-only users had no way to scroll the code blocks and would be unable to see part of the examples.

One way to fix this would be to add tabindex="0" to all code blocks to allow them to be focused and scrolled. However, this would make all 200+ code blocks in the documentation tab stops, even when they don't overflow. This could make it more tedious to navigate the docs using the keyboard. In addition, focusable elements must have an accessible name, which the code blocks do not have.

Because of these issues, I instead chose to force the code blocks to wrap instead of overflowing. This doesn't affect many code blocks when viewing the docs on a desktop, because the screen is wide enough to fit most lines. The code blocks wrap more aggressively on mobile, but they are still readable. IMO, this is an acceptable trade-off to make sure the docs are accessible to as many people as possible.

Example wrapping on desktop:

Example wrapping on mobile:

[stale]

This pull request has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[geoffrich]

I'll go ahead and close this since svelte.dev will be migrating to SvelteKit soon. If still relevant, I'll re-create the PR in the sites repo.