diff --git a/src/pages/index.astro b/src/pages/index.astro
index 6c26ba5..f4b91a9 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -6,6 +6,7 @@ import Icon from '../components/Icon.astro';
 
 import { SITE_DESCRIPTION, SITE_TITLE } from '../consts';
 
+import SkillCard from '../components/skillCard.astro'
 import { desc } from "drizzle-orm";
 import { drizzle } from "drizzle-orm/d1";
 import { GuestLog } from "../schema";
@@ -21,9 +22,11 @@ if (Astro.request.method === 'POST') {
     console.log(formData);
     const name = formData.get('name');
     const message = formData.get('message');
+    const website_link = formData.get('website_link');
   
     if (
   		typeof name === 'string' && 
+  		typeof website_link === 'string' && 
   		typeof message === 'string' &&
   		name !== "" &&
   		message !== "" 
@@ -36,16 +39,21 @@ if (Astro.request.method === 'POST') {
       	await db.insert(GuestLog).values([{ 
 			name : name, 
 			message	: message,
+			website_link : website_link,
 			date_viewed : new Date(),
 		}]);
     }
 }
 
-
-const guest_logs = await db
+let guest_logs : {id: number; name: string; message: string | null; date: Date;}[] = [];
+try {
+guest_logs = await db
 	.select()
 	.from(GuestLog)
-	.orderBy(desc(GuestLog.date));
+	.orderBy(GuestLog.date);
+} catch (err) {
+	console.log(err);
+}
 
 guest_logs.forEach(log => {
 	console.log(log)
@@ -60,28 +68,99 @@ guest_logs.forEach(log => {
 	<body>
 		<Header />
 		<main>
+			<div class="IntroHeader"></div>
+			<h1 class="greeting">Hello!!, im sirlilpanda</h1>
 			<Icon />
+
+			
+			<h1 id="about_me">About me</h1>
+			<p1>
+				im an insane computer engineer who has to many hobbies and projects for me to actually work on. 
+				That is just the best way to describe me you think of a hobby ive probably dabbled in it.
+			</p1>
+
 			<h1>guest book</h1>
 			<ul>
 			{
 				guest_logs.map((log) => (
 					<li>
-						<p>[{log.date.toDateString()}] {log.name} : {log.message}</p>
+						<p>[{log.date.toDateString()}] {log.name} 
+							{log.website_link? (<a href={log.website_link}>{log.website_link}</a>) : ""}
+							: {log.message}</p>
 					</li>
 				))
 			}
 			</ul>
-			<h1>sign the guest book</h1>
+			<h1>sign the <span style="background-color: blueviolet;">guest</span> book</h1>
 			<form method="POST" style="display: grid">
 				<label for="name">Name</label>
 				<input id="name" name="name" />
 
+				<label for="website_link">Website link(optional)</label>
+				<input id="website_link" name="website_link" />
+
 				<label for="message">message</label>
 				<textarea id="message" name="message"></textarea>
 
 				<button type="submit">Submit</button>
 			</form>
+				
+			<a href="https://sirlilpanda.studio" title="Visit sirlilpandas website">
+				<img src="panda_big.gif" alt="check out a man driven to insanity" width={88*4} height={31*4}>
+			</a>
+
+			<a href="https://onio.neocities.org" title="Visit Onio Café">
+				<img src="https://onio.neocities.org/thebutton.gif" alt="Come Chat With Us!" width="88" height="31">
+			</a>
+
 		</main>
 		<Footer />
 	</body>
 </html>
+
+
+<style>
+	.IntroHeader {
+		display: flexbox;
+	}
+
+
+
+ @keyframes gradient {
+        0% {
+            background-position: 0% 90%;
+        }
+		100% {
+            background-position: 90% 0%;
+        }
+    }
+	
+	.greeting{
+		background : linear-gradient(
+			-45deg, 
+			#ff0000, 
+			#ffbc7e, 
+			#fcff4e, 
+			#27ff88,
+			#27ffff,
+			#1e0ff5,
+			#9e27ff,
+			#ff0000, 
+			#ffbc7e, 
+			#fcff4e, 
+			#27ff88,
+			#27ffff,
+			#1e0ff5,
+			#9e27ff,
+			#ff0000 
+		);
+        background-size: 300% 300%;
+		-webkit-background-clip: text;
+		background-clip: text;
+		color: transparent;
+        transition: 250ms;
+		animation: gradient 2s linear infinite;
+		font-size: 2.5em;
+	}
+
+</style>
\ No newline at end of file
