diff --git a/src/app.css b/src/app.css
index f3f39c3..7bbfeaf 100644
--- a/src/app.css
+++ b/src/app.css
@@ -29,7 +29,7 @@ body {
 
 .wrapper {
     margin-inline: auto;
-    width: min(90%, 100rem);
+    width: min(90%, 95rem);
     margin-top: 4rem;
     display: flex;
     flex-direction: column;
@@ -48,7 +48,7 @@ body {
     --grey-four: #182244;
     --grey-five: hsl(208, 30%, 75%);
     --grey-six: hsla(220, 12%, 15%, 0.655);
-    --grey-seven: #535563;
+    --grey-seven: #43698657;
     --bezier-one: cubic-bezier(0.25, 0.46, 0.45, 0.94);
 }
 
diff --git a/src/lib/components/atoms/ContributorPerson.svelte b/src/lib/components/atoms/ContributorPerson.svelte
deleted file mode 100644
index 1ac1dd6..0000000
--- a/src/lib/components/atoms/ContributorPerson.svelte
+++ /dev/null
@@ -1,69 +0,0 @@
-<script lang="ts">
-	export let name: string;
-	export let pfp: string;
-	export let url: string;
-	let alt = `h`;
-
-	let clicked = false;
-	
-</script>
-
-<a href={url} rel="noreferrer" target="_blank" on:click={() => (clicked = !clicked)} class:clicked>
-	<img src={pfp} {alt} />
-	<h2>{name}</h2>
-</a>
-
-<style>
-	a {
-		color: var(--white);
-		text-decoration: none;
-		padding: 1rem;
-		width: 100%;
-		transition: all 0.3s var(--bezier-one);
-		border-radius: 8px;
-		display: flex;
-		gap: 1rem;
-		align-items: center;
-		background-color: var(--grey-six);
-		border: 1px solid var(--grey-three);
-		cursor: pointer;
-	}
-
-	a:hover {
-		background-color: var(--grey-one);
-	}
-
-	h2 {
-		font-size: 0.95rem;
-		white-space: nowrap;
-		overflow: hidden;
-		text-overflow: ellipsis;
-	}
-
-	.clicked {
-		background-color: var(--accent-color);
-	}
-
-	.clicked h2 {
-		color: var(--grey-four);
-	}
-
-	.clicked:hover {
-		background-color: var(--accent-color);
-	}
-
-	img {
-		border-radius: 8px;
-		height: 150px;
-		width: 150px;
-		background-color: var(--grey-two);
-		transition: transform 0.4s var(--bezier-one);
-		user-select: none;
-	}
-
-	@media screen and (max-width: 768px) {
-		a {
-			flex-direction: column;
-		}
-	}
-</style>
diff --git a/src/lib/components/atoms/LogoOption.svelte b/src/lib/components/atoms/LogoOption.svelte
new file mode 100644
index 0000000..eb411eb
--- /dev/null
+++ b/src/lib/components/atoms/LogoOption.svelte
@@ -0,0 +1,94 @@
+<script lang="ts">
+	export let name: string;
+	export let logo: string;
+	export let file: string;
+	export let id: string;
+	export let selected: Array<string>;
+
+	const handleClick = () => {
+		clicked = !clicked;
+
+		if (selected.includes(id)) {
+			selected = selected.filter((e) => e !== id);
+		} else {
+			selected.push(id);
+			// the Updater
+			selected = selected;
+		}
+	};
+
+	let clicked = false;
+</script>
+
+<div on:click={handleClick} class:clicked>
+	<img src={logo} alt={file} />
+	<span class="text">
+		<h2>{name}</h2>
+		<h6>{file}</h6>
+	</span>
+</div>
+
+<style>
+	div {
+		color: var(--white);
+		text-decoration: none;
+		padding: 1rem;
+		width: 100%;
+		transition: all 0.3s var(--bezier-one);
+		border-radius: 8px;
+		display: flex;
+		gap: 1.5rem;
+		align-items: center;
+		background-color: var(--grey-six);
+		border: 1px solid var(--grey-three);
+		cursor: pointer;
+	}
+
+	h2 {
+		font-size: 1rem;
+		font-weight: 500;
+		white-space: nowrap;
+		overflow: hidden;
+		text-overflow: ellipsis;
+	}
+
+	h6 {
+		font-size: 0.9rem;
+	}
+
+	.text {
+		flex-direction: column;
+	}
+
+	.clicked {
+		background-color: var(--grey-three);
+	}
+
+	.clicked h2,
+	.clicked h6 {
+		color: var(--accent-color);
+	}
+
+	div:hover:not(.clicked) {
+		background-color: var(--grey-two);
+	}
+
+	img {
+		border-radius: 8px;
+		height: 150px;
+		width: 150px;
+		background-color: var(--grey-two);
+		transition: transform 0.4s var(--bezier-one);
+		user-select: none;
+	}
+
+	@media screen and (max-width: 768px) {
+		div {
+			flex-direction: column;
+		}
+
+		.text {
+			text-align: center;
+		}
+	}
+</style>
diff --git a/src/lib/components/molecules/ContributorHost.svelte b/src/lib/components/molecules/ContributorHost.svelte
deleted file mode 100644
index 4698a6d..0000000
--- a/src/lib/components/molecules/ContributorHost.svelte
+++ /dev/null
@@ -1,78 +0,0 @@
-<script lang="ts">
-	import type { Contributor } from 'src/data/types';
-	import ContributorButton from '../atoms/ContributorPerson.svelte';
-
-	export let contribs: Contributor[];
-	export let repo: string;
-
-	let repo_name = repo
-		.replace(/-/g, ' ')
-		.replace(/revanced\/revanced/g, 'ReVanced')
-		.replace(/cli/g, 'CLI')
-		.replace(/api/g, 'API')
-		.replace(/(?:^|\s)\S/g, (x) => x.toUpperCase());
-
-	let usersIwantToExplodeSoBadly = ['semantic-release-bot'];
-</script>
-
-<div class="title">
-	<a href="https://github.com/{repo}" rel="noreferrer" target="_blank">
-		<h2>{repo_name}</h2>
-	</a>
-</div>
-
-<hr />
-
-<div class="contrib-host">
-	{#each contribs as { login, avatar_url, html_url }}
-		{#if !usersIwantToExplodeSoBadly.includes(login)}
-			<ContributorButton name={login} pfp={avatar_url} url={html_url} />
-		{/if}
-	{/each}
-</div>
-
-<style>
-	.title {
-		display: flex;
-		align-items: center;
-		border-radius: 4px;
-		transform: translateX(-6px);
-	}
-	h2 {
-		text-align: center;
-		font-size: 1.25rem;
-	}
-
-	hr {
-		margin-top: 0.5rem;
-		margin-bottom: 1rem;
-		border-top: 1px solid var(--grey-two);
-	}
-	a {
-		transition: all 0.3s var(--bezier-one);
-		display: flex;
-		text-decoration: none;
-		width: max-content;
-		border-radius: 8px;
-	}
-
-	a > h2 {
-		transition: all 0.3s var(--bezier-one);
-		width: max-content;
-		padding: 0rem 0.4rem;
-		border-radius: 4px;
-	}
-
-	a:hover > h2 {
-		width: max-content;
-		background-color: var(--grey-three);
-		color: var(--accent-color);
-	}
-
-	.contrib-host {
-		gap: 0.5rem;
-		display: grid;
-		justify-items: center;
-		grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
-	}
-</style>
diff --git a/src/lib/components/molecules/DocsNavTree.svelte b/src/lib/components/molecules/DocsNavTree.svelte
deleted file mode 100644
index abca754..0000000
--- a/src/lib/components/molecules/DocsNavTree.svelte
+++ /dev/null
@@ -1,39 +0,0 @@
-<script lang="ts">
-  import { is_tree } from '$lib/documentation.shared';
-  import type { DocsTree } from '$lib/documentation.shared';
-
-  import DocsNavNode from '$lib/components/atoms/DocsNavNode.svelte';
-
-  export let tree: DocsTree;
-  // How deeply nested this is.
-  export let nested = 0;
-</script>
-
-{#if nested}
-  <!-- The index should be part of the `ul` above us. -->
-  <DocsNavNode info={tree.index} />
-{/if}
-
-<ul>
-  {#if !nested}
-    <!-- There is no `ul` above us, so index should go here instead. -->
-    <DocsNavNode info={tree.index} />
-  {/if}
-
-  {#each tree.nodes as node}
-    {#if is_tree(node)}
-      <!-- Recursion here is fine. We are not dealing with a tree the size of a linux root file system. -->
-      <svelte:self tree={node} nested={nested + 1} />
-    {:else}
-      <DocsNavNode info={node} />
-    {/if}
-  {/each}
-</ul>
-
-<style>
-ul {
-	padding-left: 2rem;
-  list-style-type: "• ";
-  color: var(--white);
-}
-</style>
diff --git a/src/lib/components/organisms/Home.svelte b/src/lib/components/organisms/Home.svelte
deleted file mode 100644
index db6e0a7..0000000
--- a/src/lib/components/organisms/Home.svelte
+++ /dev/null
@@ -1,119 +0,0 @@
-<script>
-	import Button from '$lib/components/atoms/Button.svelte';
-</script>
-
-<section class="hero">
-	<div class="hero-text">
-		<h1>
-			Nothing <br />apps, <span class="flicker">ad</span><span class="blue">vanced.</span>
-		</h1>
-
-		<h2>
-			ReVanced is an extensible framework for building <br /> Android application mods.
-		</h2>
-
-		<div class="hero-buttons">
-			<Button icon="download" href="download" kind="primary">Download Manager</Button>
-			<Button icon="docs" href="patches">View Patches</Button>
-		</div>
-	</div>
-</section>
-
-<style>
-	h2 {
-		margin-top: 1.75\rem;
-		margin-bottom: 2rem;
-	}
-
-	.hero {
-		padding-bottom: 9rem;
-	}
-
-	.hero-text {
-		align-items: center;
-	}
-
-	.hero-buttons {
-		display: flex;
-		user-select: none;
-		gap: 1rem;
-	}
-
-	.blue {
-		color: var(--accent-color);
-	}
-
-	@keyframes flicker {
-		0% {
-			color: var(--grey-two);
-		}
-		10% {
-			color: var(--accent-color);
-		}
-		15% {
-			color: var(--grey-two);
-		}
-		35% {
-			color: var(--accent-color);
-		}
-		45% {
-			color: var(--accent-color);
-		}
-		50% {
-			color: var(--grey-two);
-		}
-		52.5% {
-			color: var(--accent-color);
-		}
-		85% {
-			color: var(--accent-color);
-		}
-		100% {
-			color: var(--grey-two);
-		}
-	}
-
-	.flicker {
-		color: var(--accent-color);
-		/* animation: flicker 2s forwards;
-		animation-timing-function: var(--bezier-one);
-		animation-delay: 1.5s;
-		animation-iteration-count: 1; */
-	}
-
-
-	h1 {
-		line-height: 1em;
-		font-size: 4rem;
-	}
-
-	@media (max-width: 768px) {
-		.hero {
-			padding-bottom: 0;
-			text-align: center;
-		}
-
-		h1 {
-			font-size: clamp(2.9rem, 10vw, 4rem);
-		}
-
-		h2 {
-			font-size: 1.2rem;
-		}
-
-		br {
-			content: ' ';
-		}
-
-		.hero-buttons {
-			justify-content: center;
-		}
-	}
-
-	@media screen and (max-width: 600px) {
-		.hero-buttons {
-			flex-direction: column;
-			align-items: center;
-		}
-	}
-</style>
diff --git a/src/routes/polling/+page.svelte b/src/routes/polling/+page.svelte
index 3f7bf90..e719a43 100644
--- a/src/routes/polling/+page.svelte
+++ b/src/routes/polling/+page.svelte
@@ -2,22 +2,22 @@
 	import { fly } from 'svelte/transition';
 	import { quintOut } from 'svelte/easing';
 
-	import ContributorPerson from '$lib/components/atoms/ContributorPerson.svelte';
+	import LogoOption from '$lib/components/atoms/LogoOption.svelte';
 	import Button from '$lib/components/atoms/Button.svelte';
-  import { onMount } from 'svelte';
+	import { onMount } from 'svelte';
 
-	let selected = [];
-  let logos = [];
-  onMount(async () => {
-    const response = await fetch('https://poll.revanced.app/logos');
-    const json = await response.json();
-    // guh
-    for (const name of Object.keys(json)) {
-      logos.push({ name, ...json[name] });
-    }
-    // update ui
-    logos = logos;
-  });
+	let selected: Array<string> = [];
+	let logos = [];
+	onMount(async () => {
+		const response = await fetch('https://poll.revanced.app/logos');
+		const json = await response.json();
+		// guh
+		for (const name of Object.keys(json)) {
+			logos.push({ name, ...json[name] });
+		}
+		// update ui
+		logos = logos;
+	});
 </script>
 
 <svelte:head>
@@ -28,21 +28,23 @@
 
 <main>
 	<div class="wrapper">
-		<div class="text-container">
-			<h1>Page 1/5</h1>
+		<div class="top-container">
+				<h1>ReVanced Logo Poll</h1>
+				<h2>{selected.length}/4 selected· Page 1/6</h2>
+				<div class="top-custom-button-container">
+					<button>Help</button>
+					<button>Website</button>
+				</div>
 		</div>
-		<div class="contrib-grid">
-      {#if logos.length != 0}
-        <ContributorPerson pfp={logos[0].gdrive_direct_url} name={logos[0].name} />
-        <ContributorPerson pfp={logos[1].gdrive_direct_url} name={logos[1].name} />
-        <ContributorPerson pfp={logos[2].gdrive_direct_url} name={logos[2].name} />
-        <ContributorPerson pfp={logos[3].gdrive_direct_url} name={logos[3].name} />
-			  <!-- <ContributorPerson pfp = "https://cdn.discordapp.com/emojis/267559535919497217.webp?size=48&quality=lossless" name="afn" />
-			       <ContributorPerson pfp = "https://cdn.discordapp.com/emojis/267559535919497217.webp?size=48&quality=lossless" name="afn 2" />
-			       <ContributorPerson pfp = "https://cdn.discordapp.com/emojis/267559535919497217.webp?size=48&quality=lossless" name="afn 3" />
-			       <ContributorPerson pfp = "https://cdn.discordapp.com/emojis/267559535919497217.webp?size=48&quality=lossless" name="yes" /> -->
-      {/if}
+		<div class="options-grid">
+			{#if logos.length > 0}
+			<LogoOption bind:selected id={logos[0].id} logo={logos[0].gdrive_direct_url} name={logos[0].name} file={logos[0].filename}/>
+			<LogoOption bind:selected id={logos[1].id} logo={logos[1].gdrive_direct_url} name={logos[1].name} file={logos[1].filename}/>
+			<LogoOption bind:selected id={logos[2].id} logo={logos[2].gdrive_direct_url} name={logos[2].name} file={logos[2].filename}/>
+			<LogoOption bind:selected id={logos[3].id} logo={logos[3].gdrive_direct_url} name={logos[3].name} file={logos[3].filename}/>
+			{/if}
 		</div>
+		
 
 		<div class="buttons-container">
 			<Button>Previous</Button>
@@ -52,7 +54,7 @@
 </main>
 
 <style>
-	.contrib-grid {
+	.options-grid {
 		display: grid;
 		grid-template-columns: repeat(auto-fill, minmax(500px, 1fr));
 		flex-direction: column;
@@ -61,14 +63,16 @@
 	}
 
 	h1 {
-		font-size: 2.25rem;
+		font-size: 2rem;
 		font-weight: 600;
 		text-align: center;
 		color: var(--grey-four);
 	}
+
+
 	h2 {
 		font-size: 1rem;
-		color: var(--grey-four);
+		color: var(--grey-three);
 		text-align: center;
 	}
 
@@ -80,7 +84,18 @@
 		float: bottom;
 	}
 
-	.text-container {
+
+	button {
+		background-color: transparent;
+		border:none;
+		border: 1px solid var(--grey-six);
+		color: var(--grey-four);
+		padding: 0.5rem 1.25rem;
+		border-radius: 12px;
+		cursor: pointer;
+	}
+
+	.top-container {
 		display: flex;
 		align-items: center;
 		flex-direction: column;
@@ -88,16 +103,22 @@
 		margin-bottom: 2rem;
 		background-color: var(--accent-color);
 		padding: 2rem;
-		border-radius: 8px;
+		border-radius: 12px;
+	}
+
+	.top-custom-button-container {
+		margin-top: 0.5rem;
+		display: flex;
+		flex-direction: row;
+		gap: 0.5rem;
 	}
 	@media screen and (max-width: 768px) {
 		h1 {
-			font-size: 2rem;
+			font-size: 1.5rem;
 		}
 
-		.contrib-grid {
-			grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));;
-
+		.options-grid {
+			grid-template-columns: repeat(auto-fill, minmax(175px, 1fr));
 		}
 	}
 </style>