Fix style of sounds page and version navigation

src/app/pages/Category.tsx

@@ -11,7 +11,7 @@ export function Category({ category }: Props) {
 	const { locale } = useLocale()
 	useTitle(locale('title.generator_category', locale(category)))
 	return <main>
-		<div class="category">
+		<div class="container">
 			{config.generators.filter(g => g.category === category).map(g => 
 				<ToolCard title={locale(g.id)} link={cleanUrl(g.url)} />
 			)}

src/app/pages/Changelog.tsx

@@ -15,7 +15,7 @@ export function Changelog({}: Props) {
 	return <main>
 		<Ad type="text" id="changelog" />
 		{error && <ErrorPanel error={error} />}
-		<div class="changelog">
+		<div class="container changelog">
 			<ChangelogList changes={changelogs} defaultOrder="desc" />
 		</div>
 		<Footer />

src/app/pages/Guide.tsx

@@ -172,7 +172,7 @@ export function Guide({ id }: Props) {
 	const [largeWidth] = useState(window.innerWidth > 600)
 
 	return <main>
-		<div class="guide">
+		<div class="container guide">
 			<div class="navigation">
 				<a class="btn btn-link" href="/guides/">
 					{Octicon.arrow_left}

src/app/pages/Guides.tsx

@@ -49,7 +49,7 @@ export function Guides({}: Props) {
 	}, [versionedGuides, search, activeTags])
 
 	return <main>
-		<div class="guides">
+		<div class="container">
 			<div class="changelog-query">
 				<TextInput class="btn btn-input changelog-search" placeholder={locale('guides.search')} value={search} onChange={setSearch} />
 				<VersionSwitcher value={versionFilter ? version : undefined} onChange={v => {changeVersion(v); setVersionFiler(true)}} hasAny onAny={() => setVersionFiler(false)} />

src/app/pages/Home.tsx

@@ -10,7 +10,7 @@ export function Home({}: Props) {
 	const { locale } = useLocale()
 	useTitle(locale('title.home'))
 	return <main>
-		<div class="home">
+		<div class="container home">
 			<ToolCard title="Data packs">
 				{config.generators.filter(g => !g.category).map(g => 
 					<ToolCard title={locale(g.id)} link={cleanUrl(g.url)} />

src/app/pages/Partners.tsx

@@ -16,7 +16,7 @@ export function Partners({}: Props) {
 	useTitle(locale('title.partners'))
 
 	return <main>
-		<div class="category">
+		<div class="container">
 			{partners.map(p => <ToolCard title={locale(`partner.${p}`)}>
 				{config.generators.filter(g => g.partner === p).map(g =>
 					<ToolCard title={locale(`partner.${p}.${g.id}`)} link={cleanUrl(g.url)} />

src/app/pages/Sounds.tsx

@@ -60,7 +60,7 @@ export function Sounds({}: Props) {
 	return <main>
 		{error && <ErrorPanel error={error} />}
 		{soundKeys.length > 0 && <>
-			<div class="controls sounds-controls">
+			<div class="sounds-controls">
 				<div class="sound-search-group">
 					<TextInput class="btn btn-input sound-search" list="sound-list" placeholder={locale('sounds.search')}
 						value={search} onChange={setSearch} onEnter={addConfig} />

src/app/pages/Versions.tsx

@@ -27,9 +27,9 @@ export function Versions({}: Props) {
 	return <main>
 		<Ad type="text" id="versions" />
 		{error && <ErrorPanel error={error} />}
-		<div class="versions">
+		<div class="container">
 			{selectedId ? <>
-				<div class="version-navigation">
+				<div class="navigation">
 					<BtnLink link="/versions/" icon="three_bars" label={locale('versions.all')} />
 					<BtnLink link={previousVersion ? `/versions/?id=${previousVersion.id}` : undefined}
 						icon="arrow_left" label={locale('versions.previous')} />