[UI?][i18n] Enable horizontal scroll for code blocks on PyPI

[webknjaz]

Describe the bug

I noticed that the monotype text in a .pypirc example overflows the right border.
I suppose it's because the translation string is longer than the original English one.
The problem of text not fitting in the UI is common

Expected behavior

I think that a horizontal scroll bar appearing in such code blocks would handle this case very well. The translators aren't immediately exposed to where and how the translation strings will be rendered. So it is unlikely for this to be fixed during the translation-time, only post-merge/build/deploy.

To Reproduce

It's on https://pypi.org/manage/account/token/.

My Platform

N/A

Additional context

[miketheman]

The problem manifests in English as well:

The content is located in this template:

warehouse/warehouse/templates/manage/account/token.html

Lines 98 to 111 in 1387d3a

	<pre class="code-block">
	[distutils]
	index-servers =
	{{ site }}
	PROJECT_NAME
	[{{ site }}]
	username = __token__
	password = # {% trans %}either a user-scoped token or a project-scoped token you want to set as the default{% endtrans %}
	[PROJECT_NAME]
	repository = {{ upload_url }}
	username = __token__
	password = # {% trans %}a project token{% endtrans %} </pre>

The width of the overall content column is set in SCSS:

warehouse/warehouse/static/sass/layout-helpers/_containers.scss

Lines 28 to 29 in 1387d3a

	.tabs-container {
	@include site-container;

warehouse/warehouse/static/sass/settings/_grid.scss

Line 17 in 1387d3a

$site-container: 1150px;

I don't think it's likely to change the global width setting to accommodate this. Rather, it's more likely to explore adding the horizontal scroll to the specific code block SCSS https://github.com/pypi/warehouse/blob/1387d3a1212cb56feb114611cf44739f63707eb2/warehouse/static/sass/blocks/_code-block.scss