From 5032cef7fad0550a53832a1fe185e1afb2cb2c1f Mon Sep 17 00:00:00 2001
From: I-Have-An-Issue <34550332+I-Have-An-Issue@users.noreply.github.com>
Date: Sun, 9 Oct 2022 16:51:02 -0400
Subject: [PATCH] More progress on user profile

---
 src/routes/(app)/users/[id]/+page.svelte | 33 ++++++++++++++----------
 1 file changed, 20 insertions(+), 13 deletions(-)

diff --git a/src/routes/(app)/users/[id]/+page.svelte b/src/routes/(app)/users/[id]/+page.svelte
index b170222..fe7fb92 100644
--- a/src/routes/(app)/users/[id]/+page.svelte
+++ b/src/routes/(app)/users/[id]/+page.svelte
@@ -1,18 +1,25 @@
-<div class="mx-auto rounded-lg shadow border border-gray-300 flex p-2">
-	<img class="rounded-full border-2 border-grey-300 w-36 h-36 px-2 shadow-lg" src="" alt="" />
-	<div class="flex flex-col place-content-between">
-		<p>{"KILL"}</p>
-		<div class="flex">
-			<p><a href="/users/id/friends">0</a> Friends</p>
-			<p><a href="/users/id/followers">0</a> Followers</p>
-			<p><a href="/users/id/following">0</a> Following</p>
+<div class="mx-auto rounded-lg flex shadow border border-gray-300 px-2 py-1.5">
+	<img class="rounded-full border-2 border-grey-300 w-32 h-32 px-2 shadow-lg" src="/favicon.png" alt="" />
+	<div class="flex flex-col place-content-between pt-2 pb-1.5">
+		<p class="text-3xl font-bold">Only16Characters</p>
+		<div class="flex text-lg">
+			<p class="mr-1.5"><a class="font-bold" href="/users/id/friends">0</a> Friends</p>
+			<p class="mr-1.5"><a class="font-bold" href="/users/id/followers">0</a> Followers</p>
+			<p><a class="font-bold" href="/users/id/following">0</a> Following</p>
 		</div>
 	</div>
 	<span class="flex-grow" />
-	<div class="flex flex-col place-content-between place-self-end">
-		<div class="flex">
-			<button>Message</button>
-			<button>Add Friend</button>
-		</div>
+	<div class="flex place-content-between place-self-end py-1">
+		<a class="mr-2 px-3 py-1 rounded border-2 border-gray-500 text-gray-500 shadow-lg hover:bg-gray-200" href="/users/id/message">Message</a>
+		<button class="px-3 py-1 rounded border-2 border-blue-500 text-blue-500 shadow-lg hover:bg-blue-200">Add Friend</button>
+	</div>
+</div>
+
+<div class="flex place-content-between">
+	<div class="w-full rounded-lg flex shadow border border-gray-300 p-2 mt-2 mr-1">
+		<p>Friends</p>
+	</div>
+	<div class="w-full rounded-lg flex shadow border border-gray-300 p-2 mt-2 ml-1">
+		<p>Games</p>
 	</div>
 </div>