Compare commits

..

13 Commits

Author SHA1 Message Date
52ee36828d added guest book background colours 2026-07-30 22:45:07 +12:00
ad980f5349 updated style on guest book 2026-07-30 22:44:34 +12:00
52fd67721f update styles 2026-07-30 22:44:18 +12:00
289da287c9 fixed go back link 2026-07-30 22:44:00 +12:00
21494c1547 now ignores the inprogress articles 2026-07-30 22:43:42 +12:00
3f0206ba95 fixed mobile view 2026-07-28 23:04:52 +12:00
91b7718633 pages that creates all the albums 2026-07-28 22:48:33 +12:00
c51fadab21 layout for the albums 2026-07-28 22:47:14 +12:00
72c277f1cb the collections for each album 2026-07-28 22:46:52 +12:00
ecf8fb71cf the pictures in question 2026-07-28 22:46:22 +12:00
5a2efd1b93 finally a place for my pictures 2026-07-28 22:45:30 +12:00
e23c854e06 added some more text editors 2026-07-28 22:45:08 +12:00
3d086dedf5 adding image collection object 2026-07-28 22:44:35 +12:00
68 changed files with 314 additions and 103 deletions

1
.gitignore vendored
View File

@@ -26,3 +26,4 @@ pnpm-debug.log*
.drizzle.env
worker-configuration.d.ts
src/content/in_progress/

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.3 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.8 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.1 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.4 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.9 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.6 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.3 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.5 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.5 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.8 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.3 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.1 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.6 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.4 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.2 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.0 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.1 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.2 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.6 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.2 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.1 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.4 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.2 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.6 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.1 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.9 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.7 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.4 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.3 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.8 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.9 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.1 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.8 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.5 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.0 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.2 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.7 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.5 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.4 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.5 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.9 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.3 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.4 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.0 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.5 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.7 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.5 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.7 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.8 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.6 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.3 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.4 MiB

View File

@@ -17,4 +17,18 @@ const blog = defineCollection({
}),
});
export const collections = { blog };
const album = defineCollection({
loader : glob({base : './src/content/pictures/', pattern : '**/*.yaml'}),
schema: ({image}) =>
z.object({
title : z.string(),
description : z.string(),
cover : image()
}),
});
export const collections = {
blog,
album,
};

View File

@@ -94,7 +94,9 @@ check this article often as i will be updating it
- https://codeberg.org/microcad/microcad
# text editors
- https://github.com/neurocyte/flow?tab=readme-ov-file
- https://github.com/neurocyte/flow
- https://github.com/4coder-community/4cc
- inclosed beta : https://fred-dev.tech/
- https://lite-xl.com/
- https://pragtical.dev/
- https://amp.rs/

View File

@@ -0,0 +1,3 @@
title: 'island cottage'
description: 'just a small cottage i built on an island, this was really my first foray in to a more creative style of building.'
cover: '../../assets/pictures/minecraft_builds/cottage/2021-08-25_12.19.03.png'

View File

@@ -0,0 +1,3 @@
title: 'large farm house'
description: 'after a while of building smaller houses and more *cozy* builds, i decided to try my hand at a larger build falling back into a more classic minecraft building pallet'
cover: '../../assets/pictures/minecraft_builds/farm-house/2024-07-18_14.42.07.png'

View File

@@ -0,0 +1,3 @@
title: 'french town'
description: 'after the smallness of the italian village i decided to start try my hand at larger buildings again but this time try to texture the buildings to show wear instead of texture for textures sake'
cover: '../../assets/pictures/minecraft_builds/french-town/2026-01-01_12.50.19.png'

View File

@@ -0,0 +1,3 @@
title: 'interiors'
description: 'just a collection all a few of the interiors ive actually furished'
cover: '../../assets/pictures/minecraft_builds/interiors/2025-12-31_16.29.26.png'

View File

@@ -0,0 +1,3 @@
title: 'italianesque village'
description: 'trying to strech my legs a bit on a larger build, however falling back to my normal small building style, but starting to play around with alot more colour'
cover: '../../assets/pictures/minecraft_builds/italianesque-village/far_off/2025-05-02_19.49.29.png'

View File

@@ -0,0 +1,3 @@
title: 'mountain farm'
description: 'my current attemps at making a more aesthetically pleasing farm'
cover: '../../assets/pictures/minecraft_builds/mountain-farm/2026-01-02_16.51.41.png'

View File

@@ -0,0 +1,3 @@
title: 'tuscany style farm'
description: 'deciding my italian village need some from of food source i though it approate to create this mountain side farm'
cover: '../../assets/pictures/minecraft_builds/tuscany-style-farm/2025-09-05_18.08.14.png'

45
src/layouts/Album.astro Normal file
View File

@@ -0,0 +1,45 @@
---
import { Image } from 'astro:assets';
import type { CollectionEntry } from 'astro:content';
import BaseHead from '../components/BaseHead.astro';
import Footer from '../components/Footer.astro';
import Header from '../components/Header.astro';
type Props = CollectionEntry<'album'>['data'];
const { title, description, cover, } = Astro.props;
---
<html lang="en">
<head>
<BaseHead title={title} description={description} />
</head>
<body>
<Header />
<main>
<article>
<div class="">
<h1 class="">
{title}
</h1>
<p class="">
{description}
</p>
<div>
<slot />
</div>
<p class="">
<a href="/pictures" class=""
>Go back →</a
>
</p>
</div>
</article>
</main>
<Footer />
</body>
</html>

View File

@@ -65,29 +65,33 @@ guest_logs.forEach(log => {
<Header />
<main>
<section>
<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" />
<form method="POST" style="display: grid">
<h1>sign the guest book</h1>
<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="website_link">Website link(optional):</label>
<input id="website_link" class="website_link" name="website_link" placeholder="etc. https://sirlilpanda.studio", pattern="((http|https):\/\/)(www.)?"/>
<label for="message">message</label>
<textarea id="message" name="message"></textarea>
<label for="message">message:</label>
<textarea id="message" name="message"></textarea>
<button type="submit">Submit</button>
</form>
<button type="submit">🖊sign the book🖊</button>
</form>
<h1>guest book</h1>
<ul>
<ul class="lastest-guestbook-logs">
<h3>consider adding to the guest book</h3>
<h5>heres what others had to say already:</h5>
<hr/>
{
guest_logs.map((log) => (
<li>
<p>[{log.date.toDateString()}] {log.name}
{log.website_link? (<a href={log.website_link}>{log.website_link}</a>) : ""}
: {log.message}</p>
<p class="title">[{log.date.toDateString()}] {log.name}
{log.website_link? (<a href={log.website_link}>{log.website_link}</a>) : ""}:</p>
<p class="message">-> "{log.message}"</p>
</li>
<hr/>
))
}
</ul>
@@ -97,3 +101,76 @@ guest_logs.forEach(log => {
<Footer />
</body>
</html>
<style>
label {
color: var(--text-color);
font-style: italic;
}
website_link:invalid {
border-color: red;
}
input {
background: var(--background-colour);
color: var(--text-color);
}
textarea {
background: var(--background-colour);
color: var(--text-color);
resize: vertical;
}
button {
margin-top: 1em;
width: fit-content;
padding: 1em;
font-size: 1em;
margin-left: auto;
margin-right: auto;
}
form {
background: var(--guest-book-background);
border-color: blanchedalmond;
border-style: solid;
box-shadow: var(--box-shadow);
border-radius: 2em;
padding: 2em;
}
.lastest-guestbook-logs {
padding-top: 2em;
border-radius: 2em;
padding-left: 1em;
padding-right: 1em;
padding-bottom: 1em;
background: var(--guest-book-background);
border-style: solid;
border-color: blanchedalmond;
box-shadow: var(--box-shadow);
margin-bottom: 5em;
}
ul > li {
padding-left: 1em;
padding-right: 1em;
transition: 250ms;
list-style-type: none;
}
hr {
color: blue;
border-top: 2px solid blue;
}
li > p {
margin: unset;
}
</style>

View File

@@ -39,9 +39,6 @@ const posts = (await getCollection('blog')).sort(
(a, b) => b.data.pubDate.valueOf() - a.data.pubDate.valueOf(),
);
---
<!doctype html>
@@ -82,10 +79,10 @@ const posts = (await getCollection('blog')).sort(
</a>
</div>
<ul class="lastest-guestbook-logs">
<h3>consider adding to the <a href="/guestBook">guestbook</a></h3>
<h5>heres what others had to say already</h5>
<ul class="lastest-guestbook-logs">
<hr/>
{
guest_logs.map((log) => (
<li>
@@ -93,6 +90,7 @@ const posts = (await getCollection('blog')).sort(
{log.website_link? (<a href={log.website_link}>{log.website_link}</a>) : ""}:</p>
<p class="message">{log.message}</p>
</li>
<hr/>
))
}
</ul>
@@ -201,9 +199,12 @@ const posts = (await getCollection('blog')).sort(
}
.lastest-guestbook-logs {
padding-top: 2em;
border-radius: 2em;
padding: 1em;
background: var(--background-colour);
padding-left: 1em;
padding-right: 1em;
padding-bottom: 1em;
background: var(--guest-book-background);
border-style: solid;
border-color: blanchedalmond;
box-shadow: var(--box-shadow);
@@ -212,23 +213,25 @@ const posts = (await getCollection('blog')).sort(
ul > li {
margin-top: 1em;
border-radius: 1em;
padding-left: 1em;
padding-right: 1em;
border-style: solid;
border-color: blanchedalmond;
transition: 250ms;
background: var(--background-colour);
list-style-type: none;
}
ul > li:hover {
hr {
color: blue;
border-top: 2px solid #1e0ff5;
}
/* ul > li:hover {
transform: translateY(-0.5em);
box-shadow: var(--box-shadow);
}
ul > li:nth-of-type(odd) {
background: var(--main-background-colour);
}
} */
</style>

View File

@@ -0,0 +1,37 @@
---
// useful https://jankraus.net/2024/04/05/how-to-build-a-simple-photo-gallery-with-astro/
import { type CollectionEntry, getCollection, } from 'astro:content';
import Album from '../../layouts/Album.astro';
import { Image } from 'astro:assets';
export const prerender = true;
async function getAlbumImages(id : any) {
let images = import.meta.glob<{default : ImageMetadata}>("/src/assets/pictures/**/*.png")
images = Object.fromEntries(Object.entries(images).filter(([key]) => key.includes(id)));
const resolvedImages = await Promise.all(Object.values(images).map((image) => image().then((mod) => mod.default)));
return resolvedImages;
}
export async function getStaticPaths() {
const albums = await getCollection('album');
return albums.map((album) => {
return {
params: {id: album.id,},
props: album ,
}
})
}
type Props = CollectionEntry<'album'>;
const album = Astro.props;
const images = await getAlbumImages(album.id);
// console.log(images)
---
<Album {...album.data}>
{images.map((image) => <Image src={image} alt=""></Image>)}
</Album>

View File

@@ -2,98 +2,107 @@
import BaseHead from '../../components/BaseHead.astro';
import Header from '../../components/Header.astro';
import Footer from '../../components/Footer.astro';
import { getCollection } from 'astro:content';
import { actions } from 'astro:actions';
import { Image } from 'astro:assets';
import { drizzle } from "drizzle-orm/d1";
import { GuestLog } from "../../schema";
import { env } from "cloudflare:workers";
export const prerender = false
const albums = await getCollection('album');
const db = drizzle(env.DB);
if (Astro.request.method === 'POST') {
// Parse form data
const formData = await Astro.request.formData();
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 !== ""
) {
if (message.length >= 255) {
return;
}
await db.insert(GuestLog).values([{
name : name,
message : message,
website_link : website_link,
date_viewed : new Date(),
}]);
}
}
let guest_logs : {id: number; name: string; message: string | null; date: Date;}[] = [];
try {
guest_logs = await db
.select()
.from(GuestLog)
.orderBy(GuestLog.date);
} catch (err) {
console.log(err);
}
guest_logs.forEach(log => {
console.log(log)
});
// console.log(albums)
---
<!--
albums.map(album => (
<h1>{album.data.title}</h1>
<img src=\"{album.data.cover}\" alt="">
-->
<!doctype html>
<html lang="en">
<head>
<BaseHead title="guest book" description="a guest book of everyone who have visited my site" />
<BaseHead title="photo albums" description="a collection of nice photos ive taken" />
</head>
<body>
<Header />
<main>
<section>
<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>
<h1>guest book</h1>
<ul>
{
guest_logs.map((log) => (
<li>
<p>[{log.date.toDateString()}] {log.name}
{log.website_link? (<a href={log.website_link}>{log.website_link}</a>) : ""}
: {log.message}</p>
</li>
))
}
</ul>
<h1>Albums</h1>
{( albums.map(album =>
<div class="album">
<a href={"pictures/" + album.id}>
<div class="album-text">
<h1>{album.data.title}</h1>
<p>{album.data.description}</p>
</div>
<Image src={album.data.cover} alt="" class="album-image"/>
</a>
</div>
<hr/>
))}
</section>
</main>
<Footer />
</body>
</html>
<style>
.album {
/* display: flex; */
margin-bottom: 2em;
width: fit-content;
transition: 250ms;
}
.album:hover {
transform: translateY(-1em);
}
.album-image {
border-style: solid;
}
.album-text {
position: absolute;
max-width: 20em;
margin-left: 1em;
margin-top: 1em;
background-color: rgba(250, 235, 215, 0.2);
rotate: -3deg;
transition: 250ms;
}
.album-text h1 {
color: black;
}
.album-text p {
color: rgb(0, 0, 0);
}
@media (max-width: 720px) {
.album-text {
padding-right: 1em;
}
.album-text h1 {
font-size: 1.4em;
}
.album-text p {
font-size: 0.8em;
}
}
</style>

View File

@@ -61,6 +61,7 @@
--main-background-colour : #fffeab;
--footer-colour : #f1c27c;
--top-footer-colour : rgb(182, 139, 46);
--guest-book-background : linear-gradient(180deg, #FFFEED, #fff7d7);
}
:root[data-theme="dark"] {
@@ -80,6 +81,7 @@
--main-background-colour : #3b3b3b;
--footer-colour : #535353;
--top-footer-colour : #5c5c5c;
--guest-book-background : linear-gradient(180deg, #1a1a1a, #1f1f1f);
}