sirlilpanda/website
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

now shows the 88x31 buttons added website link to the forum and updated styles

Browse Source
This commit is contained in:
panda
2026-03-22 23:41:24 +13:00
parent 26f22f3148
commit 0619a4efff
1 changed files with 84 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

89
src/pages/index.astro
View File

@@ -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>