fix: no spacing from the ads

website/src/lib/components/markdown/layout.svelte

@@ -1,3 +1,3 @@
-<article class="prose lg:prose-lg dark:prose-invert max-w-3xl">
+<article class="prose lg:prose-lg dark:prose-invert max-w-5xl mx-auto">
 	<slot />
 </article>

website/src/routes/+page.svelte

@@ -33,12 +33,14 @@
 	<meta name="theme-color" content="#1DB954" />
 </svelte:head>
 
-<section class="flex flex-col gap-4 ps-4 pt-16 md:ps-24 md:pt-24">
+<section class="ps-4 pt-16 md:ps-24 md:pt-24">
+	<div class="flex flex-col gap-4">
 		<div>
 			<h1 class="h1">Spotube</h1>
 			<br />
 			<h3 class="h3">
-			An Open Source <Fa class="inline text-[#1DB954]" icon={faSpotify} /> Spotify Client for every platform
+				An Open Source <Fa class="inline text-[#1DB954]" icon={faSpotify} /> Spotify Client for every
+				platform
 				<div class="inline-flex gap-3 items-center">
 					<Fa class="inline text-[#3DDC84]" icon={faAndroid} />
 					<Fa class="inline text-[#00A2F0]" icon={faWindows} />
@@ -52,7 +54,10 @@
 			</p>
 			<br />
 			<div class="flex items-center">
-			<a href="https://play.google.com/store/apps/details?id=oss.krtirtho.spotube" target="_blank">
+				<a
+					href="https://play.google.com/store/apps/details?id=oss.krtirtho.spotube"
+					target="_blank"
+				>
 					<img
 						class="-m-2"
 						src="https://play.google.com/intl/en_us/badges/static/images/badges/en_badge_web_generic.png"
@@ -61,7 +66,11 @@
 					/>
 				</a>
 				<a href="https://flathub.org/apps/com.github.KRTirtho.Spotube" target="_blank">
-				<img width="160" alt="Download on Flathub" src="https://flathub.org/api/badge?locale=en" />
+					<img
+						width="160"
+						alt="Download on Flathub"
+						src="https://flathub.org/api/badge?locale=en"
+					/>
 				</a>
 			</div>
 			<br />
@@ -76,19 +85,21 @@
 				<Download />
 			</a>
 		</div>
+	</div>
 
+	<br />
 	<Ads adSlot={ADS_SLOTS.rootPageDisplay} adFormat="auto" />
+	<br />
 
-	<br /><br />
+	<div class="flex flex-col gap-4">
-
 		<h2 class="h2">
 			Supporters
 			<Heart class="inline-block" color="red" />
 		</h2>
 		<p class="text-surface-500">
-		We are grateful for the support of individuals and organizations who have made Spotube possible.
+			We are grateful for the support of individuals and organizations who have made Spotube
+			possible.
 		</p>
-
 		<div class="flex justify-center">
 			<a href="https://opencollective.com/spotube/donate" target="_blank">
 				<img
@@ -98,7 +109,6 @@
 				/>
 			</a>
 		</div>
-
 		<div class="flex flex-wrap gap-4">
 			{#each data.props.members as member}
 				<a href={member.profile} target="_blank">
@@ -115,5 +125,7 @@
 				</a>
 			{/each}
 		</div>
+	</div>
+	<br />
 	<Ads adSlot={ADS_SLOTS.rootPageDisplay} adFormat="auto" />
 </section>

website/src/routes/blog/[slug]/+page.svelte

@@ -13,7 +13,7 @@
 	<title>Blog | {title}</title>
 </svelte:head>
 
-<article class="p-4 md:p-16 flex flex-grow flex-col">
+<article class="p-4 md:p-16">
 	<section
 		class={cover_img
 			? 'bg-black/30 h-56 md:h-80 xl:h-96 bg-cover bg-center flex flex-col justify-end p-4 pb-0 md:p-8 md:pb-0 rounded-lg'

website/src/routes/downloads/+page.svelte

@@ -23,7 +23,9 @@
 
 	<DownloadItems links={extendedDownloadLinks} />
 
+	<br />
 	<Ads adSlot={ADS_SLOTS.downloadPageDisplay} adFormat="auto" />
+	<br />
 
 	<h2 class="h2">Other Downloads</h2>
 	<br /><br />
@@ -37,5 +39,6 @@
 			</a>
 		{/each}
 	</div>
+	<br />
 	<Ads adSlot={ADS_SLOTS.downloadPageDisplay} adFormat="auto" />
 </section>

website/svelte.config.js

@@ -44,6 +44,7 @@ const config = {
 					rehypeAutoAds,
 					{
 						adCode: `
+              <br/>
               <ins class="adsbygoogle"
                 style="display:block; text-align:center;"
                 data-ad-layout="in-article"
@@ -51,6 +52,7 @@ const config = {
                 data-ad-client="ca-pub-6419300932495863"
                 data-ad-slot="6788673194"
               ></ins>
+              <br/>
               <script>
                 (adsbygoogle = window.adsbygoogle || []).push({});
               </script>