refactor: minor cleanup

src/lib/components/atoms/Button.svelte

@@ -2,12 +2,12 @@
 	export let kind = 'secondary';
 	$: type = 'button-' + kind;
 	export let href = '#';
-	export let width = 'false';
+	export let maxWidth = 'false';
 	export let icon = '';
 </script>
 
 <a {href}>
-	<div class={type} style="width: {width ? '100%' : 'max-width'}">
+	<div class={type} style="width: {maxWidth ? '100%' : 'max-width'}">
 		<img src="icons/{icon}.svg" alt={icon} />
 		<slot />
 	</div>

src/lib/components/atoms/HeroTitle.svelte

@@ -1,33 +0,0 @@
-<h1>
-	<span>Re</span>Vanced
-</h1>
-
-<style>
-	span {
-		color: var(--accent-color);
-	}
-
-	h1 {
-		color: var(--white);
-		font-weight: 700;
-		font-size: 5rem;
-		letter-spacing: -0.04em;
-		line-height: 0.75em;
-	}
-
-	@media screen and (max-width: 1919px) {
-		h1 {
-			font-size: 5rem;
-		}
-	}
-	@media screen and (max-width: 1052px) {
-		h1 {
-			font-size: 4.5rem;
-		}
-	}
-	@media screen and (max-width: 768px) {
-		h1 {
-			font-size: 4rem;
-		}
-	}
-</style>

src/lib/components/atoms/SocialButton.svelte

@@ -3,7 +3,7 @@
 	export let href = '#';
 </script>
 
-<a {href}>
+<a {href} target="_blank">
 	<div>
 		<img src="socials/{src}.svg" alt={src} />
 	</div>

src/lib/components/atoms/Wave.svelte

@@ -2,7 +2,6 @@
 	viewBox="0 0 1440 500"
 	xmlns="http://www.w3.org/2000/svg"
 	preserveAspectRatio="none"
-	{...$$props}
 >
 	<path class="wave" />
 </svg>

src/lib/components/organisms/Home.svelte

@@ -1,19 +1,20 @@
 <script>
 	import Button from '$lib/components/atoms/Button.svelte';
-	import HeroTitle from '../atoms/HeroTitle.svelte';
 </script>
 
 <section class="hero">
 	<div class="hero-text">
-		<!-- <img class="hero-img" src="/manager.png" alt="Screenshot of ReVanced Manager" /> -->
+		<h1>
-		<HeroTitle />
+			<span>Re</span>Vanced
+		</h1>
+
 		<h2>
 			An extensible framework for building <br />application mods.
 		</h2>
 
 		<div class="hero-buttons">
-			<Button icon="download" kind="primary" href="download" width="100%">Download</Button>
+			<Button icon="download" href="download" maxWidth="true" kind="primary">Download</Button>
-			<Button icon="docs" href="docs" width="true">Read The Docs</Button>
+			<Button icon="docs" href="docs" maxWidth="true">Read The Docs</Button>
 		</div>
 	</div>
 </section>
@@ -38,6 +39,34 @@
 		gap: 1rem;
 	}
 
+	span {
+		color: var(--accent-color);
+	}
+
+	h1 {
+		color: var(--white);
+		font-weight: 700;
+		font-size: 5rem;
+		letter-spacing: -0.04em;
+		line-height: 0.75em;
+	}
+
+	@media screen and (max-width: 1919px) {
+		h1 {
+			font-size: 5rem;
+		}
+	}
+	@media screen and (max-width: 1052px) {
+		h1 {
+			font-size: 4.5rem;
+		}
+	}
+	@media screen and (max-width: 768px) {
+		h1 {
+			font-size: 4rem;
+		}
+	}
+
 	@media (max-width: 768px) {
 		.hero {
 			padding-bottom: 0;

src/routes/patches/+page.svelte

@@ -33,7 +33,7 @@
 
         <div class="patches-list patches-container">
             {#each patches as patch, i}
-                <div in:fly="{{ x: 10, easing: quintOut, duration: 750, delay: (80 * i)}}">
+                <div in:fly="{{ x: 10, easing: quintOut, duration: 750, delay: -(300*(0.85**i))+300}}">
                     <Patch
                         name={patch.name
                             // im sorry