a idk if i broke something but push comes

src/lib/components/atoms/ContributorButton.svelte

@@ -1,13 +1,16 @@
 <script>
-	export let href = '#';
+	export let href = "https://github.com/ushie"
+	export let src = "https://github.com/ushie.png"
+	export let alt = "Contributors Image"
 </script>
 
-
+<div>
-<button>
 	<a {href}>
-		<slot/>
+		<button>
+			<img {src} {alt}><slot/>
+		</button>
 	</a>
-</button>
+</div>
 
 <style>
 	a {
@@ -20,10 +23,10 @@
 		border-radius: 200px;
         border: 0;
 		padding: 5px 5px;
-        width:128px;
+        width:86px;
-        height:128px;
+        height:86px;
-        max-height: 128px;
+        max-height: 86px;
-        max-width: 128px;
+        max-width: 86px;
 		cursor: pointer;
 		background-color: var(--grey-four);
 		font-size: 1.5rem;
@@ -36,4 +39,10 @@
 	button:hover {
 		transform: translate(-5%, -5%);
 	}
+
+	img {
+		border-radius: 50%;
+        max-height: 86px;
+        max-width: 86px;
+	}
 </style>

src/lib/components/atoms/HeroImage.svelte

@@ -2,7 +2,7 @@
  
 </script>
 
-<div class="hero-img" style ="background-image:url('/manager.png')" alt="Screenshot of ReVanced Manager">afn is not real afn is not real afn is not real afn is not real afn is not real afn is not real afn is not real afn is not real afn is not real afn is not real afn is not real afn is not real afn is not real afn is not real afn is not real afn is not real afn is not real afn is not real afn is not real afn is not real afn is not real afn is not real afn is not real afn is not real afn is not real afn is not real afn is not real afn is not real </div>
+<div class="hero-img" style ="background-image:url('/manager.png')" alt="Screenshot of ReVanced Manager"></div>
 
 <style>
 	.hero-img {

src/lib/components/atoms/IndexHeroTitle.svelte

@@ -1,4 +1,6 @@
-<h1><span class="redder">Re</span>Vanced</h1>
+<h1>
+	<span class="redder">Re</span>Vanced
+</h1>
 
 <style>
 	.redder {

src/lib/components/atoms/Navigation.svelte

@@ -2,7 +2,6 @@
 	import { page } from '$app/stores';
 	export let href = '/';
 	$: current = (href == $page.url.pathname);
-
 </script>
 
 <a {href}>

src/lib/components/atoms/SocialButton.svelte

@@ -4,7 +4,6 @@
     export let href = '#';
 </script>
 
-
 <button>
     <a {href}>
         <img {src} {alt}>

src/lib/components/molecules/ContributorHost.svelte

@@ -4,9 +4,41 @@
 
 <div class="social-host">
     <ContributorButton></ContributorButton>
+    <ContributorButton></ContributorButton>
+    <ContributorButton></ContributorButton>
+    <ContributorButton></ContributorButton>
+    <ContributorButton></ContributorButton>
+    <ContributorButton></ContributorButton>
+    <ContributorButton></ContributorButton>
+    <ContributorButton></ContributorButton>
+    <ContributorButton></ContributorButton>
+    <ContributorButton></ContributorButton>
+    <ContributorButton></ContributorButton>
+    <ContributorButton></ContributorButton>
+    <ContributorButton></ContributorButton>    
+    <ContributorButton></ContributorButton>
+    <ContributorButton></ContributorButton>
+    <ContributorButton></ContributorButton>
+    <ContributorButton></ContributorButton>
+    <ContributorButton></ContributorButton>
+    <ContributorButton></ContributorButton>
+    <ContributorButton></ContributorButton>
+    <ContributorButton></ContributorButton>
+    <ContributorButton></ContributorButton>
+    <ContributorButton></ContributorButton>
+    <ContributorButton></ContributorButton>
+    <ContributorButton></ContributorButton>
+    <ContributorButton></ContributorButton>
 </div>
 
 <style>
+	div {
+		display: grid;
+		grid-column: 9;
+		gap: 100px;
+		grid-column-start: 1;
+		grid-column-end: 9;
+	}
     .social-host {
         width: 100;
         justify-content: space-between;

src/lib/components/molecules/NavHost.svelte

@@ -26,5 +26,4 @@
 	.logo {
 		width: 3rem;
 	}
-
 </style>

src/lib/components/organisms/IndexDescription.svelte

@@ -7,7 +7,10 @@
     <div class="hero-text">
         <!-- <img class="hero-img" src="/manager.png" alt="Screenshot of ReVanced Manager" /> -->
         <IndexHeroTitle></IndexHeroTitle>
-        <h3>An extensible framework for<br />building application mods.</h3>
+        <h3>
+			An extensible framework for<br />
+			building application mods.
+		</h3>
         <Button kind="primary" href="/download">Download</Button>
         <Button href="/docs">Read The Docs</Button>
     </div>

src/routes/__layout.svelte

@@ -43,6 +43,7 @@ import SocialHost from "$lib/components/molecules/SocialHost.svelte";
 	}
 
 	:global(body) {
+		overflow-y: hidden;
 		margin: 0;
 		padding: 0;
 		line-height: 1.3;

src/routes/credits.svelte

@@ -0,0 +1,9 @@
+<script>
+	import Wave from '$lib/components/atoms/Wave.svelte';
+    import ContributorHost from '$lib/components/molecules/ContributorHost.svelte';
+	import SocialHost from '$lib/components/molecules/SocialHost.svelte';
+    </script>
+
+<div class="wrapper">
+    <ContributorHost></ContributorHost>
+</div>

src/routes/index.svelte

@@ -7,6 +7,7 @@
 
 <div class="wrapper">
 	<IndexDescription />
+	<HeroImage />
 </div>
 
 <Wave />