diff --git a/modules/gui/src/components/PackageBanner/PackageBanner.svelte b/modules/gui/src/components/PackageBanner/PackageBanner.svelte
index 10fd92b..571a451 100644
--- a/modules/gui/src/components/PackageBanner/PackageBanner.svelte
+++ b/modules/gui/src/components/PackageBanner/PackageBanner.svelte
@@ -4,7 +4,7 @@
 	import type { Package, Bottle } from '@tea/ui/types';
 	import Button from '@tea/ui/Button/Button.svelte';
 	import StarRating from '@tea/ui/StarRating/StarRating.svelte';
-	import Bottles from '@tea/ui/Bottles/Bottles.svelte';
+	// import Bottles from '@tea/ui/Bottles/Bottles.svelte';
 	import { onMount } from 'svelte';
 	import { getPackageBottles } from '@api';
 
@@ -33,20 +33,18 @@
 		<figure class="grow-1 w-1/3">
 			<img width={260} src={pkg.thumb_image_url} alt={pkg.full_name} />
 		</figure>
-		<article class="w-2/3 p-4">
-			<h3 class="text-5xl text-primary">{pkg.full_name}</h3>
-			{#if pkg.maintainer}
-				<h3>* {pkg.maintainer}</h3>
-			{/if}
+		<article class="w-2/3 p-4 pt-8">
+			<h3 class="text-3xl text-primary">{pkg.full_name}</h3>
+			<h3>&#x2022; {pkg.maintainer || ''}{pkg.maintainer ? ' |' : ''} {bottles.length} bottles</h3>
 			<div class="mt-4">
 				<StarRating maxRating={5} rating={packageRating} />
 			</div>
 			<p class="mt-4 font-sono text-sm">{pkg.desc}</p>
 		</article>
 	</header>
-	<section>
+	<!-- <section>
 		<Bottles {bottles} />
-	</section>
+	</section> -->
 	<footer class="flex h-20 border-t border-gray text-white">
 		<input class="click-copy flex-grow bg-black pl-4" disabled value={copyValue} />
 		<Button class="w-16 border-0 border-l-2 text-sm" onClick={onCopy}>{copyButtonText}</Button>
diff --git a/modules/gui/src/components/PageHeader/PageHeader.svelte b/modules/gui/src/components/PageHeader/PageHeader.svelte
index d58eabf..4674a48 100644
--- a/modules/gui/src/components/PageHeader/PageHeader.svelte
+++ b/modules/gui/src/components/PageHeader/PageHeader.svelte
@@ -1,8 +1,10 @@
 <script lang="ts">
 	export let coverUrl = '';
+	let clazz = '';
+	export { clazz as class };
 </script>
 
-<figure class="relative mb-8 h-32 w-full font-machina uppercase">
+<figure class={`relative mb-8 h-32 w-full font-machina uppercase ${clazz}`}>
 	{#if coverUrl}
 		<img src={coverUrl} class="absolute z-0 h-32 w-full object-cover" alt="cover" />
 	{/if}
diff --git a/modules/gui/src/routes/packages/[slug]/+page.svelte b/modules/gui/src/routes/packages/[slug]/+page.svelte
index cdefed0..36081b7 100644
--- a/modules/gui/src/routes/packages/[slug]/+page.svelte
+++ b/modules/gui/src/routes/packages/[slug]/+page.svelte
@@ -36,14 +36,24 @@
 </script>
 
 <div>
-	<PageHeader>{pkg.full_name}</PageHeader>
+	<PageHeader coverUrl={pkg.thumb_image_url}>{pkg.full_name}</PageHeader>
 	<section>
 		<PackageBanner {pkg} />
 	</section>
-	<section class="mt-8">
-		<PackageReviews reviews={reviews || []} />
+
+	<section class="mt-8 flex gap-8">
+		<div class="h-64 w-2/3 bg-gray">details and versions</div>
+		<div class="h-64 w-1/3 bg-gray">metas</div>
 	</section>
+	<PageHeader class="mt-8" coverUrl="/images/headers/header_bg_1.png">SNIPPETS</PageHeader>
+	<section class="mt-8 h-64 bg-gray">snippets</section>
+	<!-- <section class="mt-8">
+		<PackageReviews reviews={reviews || []} />
+	</section> -->
 	{#if pkg}
+		<PageHeader class="mt-8" coverUrl="/images/headers/header_bg_1.png"
+			>YOU MAY ALSO LIKE...</PageHeader
+		>
 		<section class="mt-8">
 			<SuggestedPackages {pkg} />
 		</section>