Finally, a functioning blog

This commit is contained in:
nelle 2024-06-26 17:44:29 -06:00
parent 32bfe0213c
commit 18f90e6c4d
19 changed files with 3761 additions and 4022 deletions

7343
package-lock.json generated

File diff suppressed because it is too large Load diff

View file

@ -10,7 +10,9 @@
"astro": "astro"
},
"dependencies": {
"@astrojs/rss": "^3.0.0",
"astro": "^2.10.7"
"@astrojs/mdx": "^3.1.2",
"@astrojs/rss": "^4.0.7",
"@astrojs/sitemap": "^3.1.6",
"astro": "^4.11.3"
}
}

63
src/components/Card-Blog.astro Executable file
View file

@ -0,0 +1,63 @@
---
interface Props {
title: string;
body: string;
date: string;
href: string;
}
const { href, title, date, body } = Astro.props;
---
<li class="link-card">
<a href={href} class="informational">
<h2>
{title}
<span>&rarr;</span>
</h2>
<p>{date}</p>
<p>
{body}
</p>
</a>
</li>
<style>
.link-card {
list-style: none;
display: flex;
padding: 1px;
background-color: #23262d;
background-image: none;
background-size: 400%;
border-radius: 7px;
background-position: 100%;
transition: background-position 0.6s cubic-bezier(0.22, 1, 0.36, 1);
box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);
}
.link-card > a {
width: 100%;
text-decoration: none;
line-height: 1.4;
padding: calc(1.5rem - 1px);
border-radius: 8px;
color: white;
background-color: #23262d;
opacity: 0.8;
}
h2 {
margin: 0;
font-size: 1.25rem;
transition: color 0.6s cubic-bezier(0.22, 1, 0.36, 1);
}
p {
margin-top: 0.5rem;
margin-bottom: 0;
}
.link-card:is(:hover, :focus-within) {
background-position: 0;
background-image: var(--accent-gradient);
}
.link-card:is(:hover, :focus-within) h2 {
color: rgb(var(--accent-light));
}
</style>

View file

@ -1,4 +1,5 @@
---
const today = new Date();
---
<br><br>
<center>

View file

@ -0,0 +1,17 @@
---
interface Props {
date: Date;
}
const { date } = Astro.props;
---
<time datetime={date.toISOString()}>
{
date.toLocaleDateString('en-us', {
year: 'numeric',
month: 'short',
day: 'numeric',
})
}
</time>

View file

@ -1,4 +1,12 @@
---
interface Props {
title: string;
description: string;
}
const canonicalURL = new URL(Astro.url.pathname, Astro.site);
const { title, description } = Astro.props;
---
<meta charset="UTF-8" />

View file

@ -1,4 +1,6 @@
---
import HeaderLink from './HeaderLink.astro';
import { SITE_TITLE } from '../consts';
---
<center>

View file

@ -0,0 +1,25 @@
---
import type { HTMLAttributes } from 'astro/types';
type Props = HTMLAttributes<'a'>;
const { href, class: className, ...props } = Astro.props;
const { pathname } = Astro.url;
const subpath = pathname.match(/[^\/]+/g);
const isActive = href === pathname || href === '/' + subpath?.[0];
---
<a href={href} class:list={[className, { active: isActive }]} {...props}>
<slot />
</a>
<style>
a {
display: inline-block;
text-decoration: none;
}
a.active {
font-weight: bolder;
text-decoration: underline;
}
</style>

5
src/consts.ts Normal file
View file

@ -0,0 +1,5 @@
// Place any global data in this file.
// You can import this data from anywhere in your site by using the `import` keyword.
export const SITE_TITLE = 'LimePot';
export const SITE_DESCRIPTION = 'Personal Website of LimePotato';

View file

@ -0,0 +1,19 @@
---
title: 'Minecraft 88x31 Badges'
description: '88x31 badges for your Minecraft projects!'
pubDate: 'June 17 2024'
---
## I made (and still am making), a few 88x31 badges for minecraft mods and such, in aseprite heres what i have so far!
### (If you dont see one you want, and to download them go ahead and check the [git repo](https://git.nullafati.xyz/limepotato/mc-badges)
### [License](https://git.nullafati.xyz/limepotato/mc-badges/src/branch/main/LICENSE.md)
<img src="/assets/badges/mc-badges/made-with-fabric.png" />
<img src="/assets/badges/mc-badges/made-with-legacy-fabric.png" />
<img src="/assets/badges/mc-badges/made-with-neoforged.png" />
<img src="/assets/badges/mc-badges/made-with-quilt.png"/>

View file

@ -0,0 +1,35 @@
---
title: 'My Setup(s)!'
description: 'Whats your setup like? I hear nobody asking, Im glad you asked!'
pubDate: 'April 17 2024'
---
## My personal machine currently has
AMD Ryzen 5 2700, 32 GiB DDR4 3200 RAM, 2TB Internal Storage, and 1TB External Storage, I'm running Arch Linux installed with some custom scripts, I use KDE Plasma (6 broke wayland aaaaa!).
<img src="/assets/otherpics/pc-neofetch.png" alt="neofetch for my pc">
## My Server setup, was more frankensteined together from old parts I had or bought or were given
Intel i5-3470, 8 GiB RAM, 2 TB External drive, 2 500 GiB HDD's running in parallel in a software RAID, a 200GiB HDD for the OS, and one more 200GiB for other storage.
Its running Ubuntu Jammy(boooooo, itd be debian or arch but i'm too lazy to redo my entire setup right now). I plan to heavily upgrade this bad boy when I have the time and money, it runs pretty much everything, the git repo, the fediverse, matrix, game servers, its definitely choking on that memory though.
<img src="/assets/otherpics/server-neofetch.png" alt="neofetch for my server">
## I also have a Raspberry Pi 4B
8GiB Model, running, you guessed it, raspbian, it uses 64 GiB External drive as its os drive, i dont trust microSD in the SLIGHTEST. This thing actually holds up the entire infra with its chadlike beefy little arms. So proud of her.
<img src="/assets/otherpics/rpi-neofetch.png" alt="neofetch for raspberry pi">
# UPDATE: 06/05/2024
## Since making this post some things have shifted around, but not by very much, the beeg server now runs Arch linux, and my PC now has a 256GB NVME ssd in it, donated by my dead Steam Deck. Anyway, updated FastFetch
<img src="/assets/otherpics/main-fastfetch.png" alt="neofetch for my pc">
<img src="/assets/otherpics/obos-fastfetch.png" alt="neofetch for my server">
<img src="/assets/otherpics/rpi-fastfetch.png" alt="neofetch for raspberry pi">

15
src/content/config.ts Normal file
View file

@ -0,0 +1,15 @@
import { defineCollection, z } from 'astro:content';
const blog = defineCollection({
type: 'content',
// Type-check frontmatter using a schema
schema: z.object({
title: z.string(),
description: z.string(),
// Transform string to Date object
pubDate: z.coerce.date(),
updatedDate: z.coerce.date().optional(),
}),
});
export const collections = { blog };

View file

@ -0,0 +1,40 @@
---
import type { CollectionEntry } from 'astro:content';
import FormattedDate from '../components/FormattedDate.astro';
import Layout from "../layouts/Layout.astro";
type Props = CollectionEntry<'blog'>['data'];
const { title, description, pubDate, updatedDate } = Astro.props;
---
<Layout title="Minecraft 88x31 Badges">
<main>
<div class="content">
<div class="wrapper">
<center>
<article>
<div class="prose">
<div class="title">
<div class="date">
<FormattedDate date={pubDate} />
{
updatedDate && (
<div class="last-updated-on">
Last updated on <FormattedDate date={updatedDate} />
</div>
)
}
</div>
<h1>{title}</h1>
<h2 style="font-size: smaller;">{description}</h2>
<hr />
</div>
<slot />
</div>
</article>
</center>
</div>
</div>
</main>
</Layout>

View file

@ -1,27 +0,0 @@
---
import Layout from "../layouts/Layout.astro";
import Card from "../components/Card-noimg.astro";
const allPosts = await Astro.glob("../pages/posts/*.astro");
---
<Layout title="LimePot - Blog">
<div class="content">
<main>
<center>
<h1 class="title">The Blog Posts</h1>
<h2 class="subtitle">This is where I post things and stuff, eventually...</h2>
</center>
<br>
{
allPosts.map((post) => (
<ul role="list" class="link-card-grid">
<Card
href={post.url}
title={post.url}
/>
</ul>
))
}
</main>
</div>
</Layout>

View file

@ -0,0 +1,20 @@
---
import { type CollectionEntry, getCollection } from 'astro:content';
import BlogPost from '../../layouts/BlogPost.astro';
export async function getStaticPaths() {
const posts = await getCollection('blog');
return posts.map((post) => ({
params: { slug: post.slug },
props: post,
}));
}
type Props = CollectionEntry<'blog'>;
const post = Astro.props;
const { Content } = await post.render();
---
<BlogPost {...post.data}>
<Content />
</BlogPost>

View file

@ -0,0 +1,38 @@
---
import BaseHead from "../../components/Head.astro";
import Header from "../../components/Header.astro";
import Footer from "../../components/Footer.astro";
import Card from "../../components/Card-Blog.astro";
import Layout from "../../layouts/Layout.astro";
import { SITE_TITLE, SITE_DESCRIPTION } from "../../consts";
import { getCollection } from "astro:content";
import FormattedDate from "../../components/FormattedDate.astro";
const posts = (await getCollection("blog")).sort(
(a, b) => a.data.pubDate.valueOf() - b.data.pubDate.valueOf()
);
---
<Layout title="LimePot - Blog">
<div class="content">
<main>
<center>
<h1 class="title">The Blog Posts</h1>
<h2 class="subtitle">This is where I post things and stuff, eventually...</h2>
</center>
<br>
{
posts.map((post) => (
<>
<ul role="list" class="link-card-grid">
<Card
href={`/blog/${post.slug}/`}
title={post.data.title} />
</ul>
</>
))
}
</main>
</div>
</Layout>

View file

@ -1,41 +0,0 @@
---
import Layout from "../../layouts/Layout.astro";
---
<Layout title="Minecraft 88x31 Badges">
<main>
<div class="content">
<div class="wrapper">
<center>
<h1 class="title">88x31 badges for your Minecraft projects!</h1>
<h3 class="subtitle">Date: 2024-06-17</h3>
<br />
<h2 class="subtitle">
I made (and still am making), a few 88x31 badges for minecraft mods
and such, in aseprite heres what i have so far!
</h2>
<h2 class="subtitle">
(If you dont see one you want, and to download them go ahead and check the <a
href="https://git.nullafati.xyz/limepotato/mc-badges">git repo</a
>)
</h2>
<h2 class="subtitle">
<a href="https://git.nullafati.xyz/limepotato/mc-badges/src/branch/main/LICENSE.md">Images License</a>
</h2>
<br />
<br />
<img src="/assets/badges/mc-badges/made-with-fabric.png" />
<br />
<br />
<img src="/assets/badges/mc-badges/made-with-legacy-fabric.png" />
<br />
<br />
<img src="/assets/badges/mc-badges/made-with-neoforged.png" />
<br />
<br />
<img src="/assets/badges/mc-badges/made-with-quilt.png"/>
</center>
</div>
</div>
</main>
</Layout>

View file

@ -1,55 +0,0 @@
---
import Layout from "../../layouts/Layout.astro";
---
<Layout title="My Setup(s)!">
<main>
<div class="content">
<div class="wrapper">
<center>
<h1 class="title">"Whats your setup like?" I hear nobody asking, I'm glad you asked!</h1>
<h3 class="subtitle">Date: 2024-04-17</h3>
<br>
<br>
<br>
<br>
<h2 class="subtitle"> My personal machine currently has:</h2>
AMD Ryzen 5 2700, 32 GiB DDR4 3200 RAM, 2TB Internal Storage, and 1TB External Storage, I'm running Arch Linux installed with some custom scripts, I use KDE Plasma (6 broke wayland aaaaa!).
<br>
<br>
<img src="/assets/otherpics/pc-neofetch.png">
<br>
<br>
<br>
<h2 class="subtitle"> My Server setup, was more frankensteined together from old parts I had or bought or were given: </h2>
Intel i5-3470, 8 GiB RAM, 2 TB External drive, 2 500 GiB HDD's running in parallel in a software RAID, a 200GiB HDD for the OS, and one more 200GiB for other storage.
<br>
Its running Ubuntu Jammy(boooooo, itd be debian or arch but i'm too lazy to redo my entire setup right now). I plan to heavily upgrade this bad boy when I have the time and money, it runs pretty much everything, the git repo, the fediverse, matrix, game servers, its definitely choking on that memory though.
<br>
<br>
<img src="/assets/otherpics/server-neofetch.png">
<br>
<br>
<br>
<h2 class="subtitle">I also have a Raspberry Pi 4B</h2>
8GiB Model, running, you guessed it, raspbian, it uses 64 GiB External drive as its os drive, i dont trust microSD in the SLIGHTEST. This thing actually holds up the entire infra with its chadlike beefy little arms. So proud of her.
<br>
<br>
<img src="/assets/otherpics/rpi-neofetch.png">
<br>
<br>
<br>
<h1 class="title">UPDATE: 06/05/2024</h1>
<br>
<h2 class="subtitle"> Since making this post some things have shifted around, but not by very much, the beeg server now runs Arch linux, and my PC now has a 256GB NVME ssd in it, donated by my dead Steam Deck. Anyway, updated FastFetch!</h2>
<br>
<br>
<img src="/assets/otherpics/main-fastfetch.png">
<br>
<img src="/assets/otherpics/obos-fastfetch.png">
<br>
<img src="/assets/otherpics/rpi-fastfetch.png">
</center>
</div>
</div>
</main>
</Layout>

View file

@ -1,11 +1,16 @@
import rss, { pagesGlobToRssItems } from '@astrojs/rss';
import rss from '@astrojs/rss';
import { getCollection } from 'astro:content';
import { SITE_TITLE, SITE_DESCRIPTION } from '../consts';
export async function GET(context) {
return rss({
title: 'LimePot - Blog',
description: 'Tis a blog maybe or something IG',
site: context.site,
items: await pagesGlobToRssItems(import.meta.glob('./**/*.md')),
customData: `<language>en-us</language>`,
});
}
const posts = await getCollection('blog');
return rss({
title: SITE_TITLE,
description: SITE_DESCRIPTION,
site: context.site,
items: posts.map((post) => ({
...post.data,
link: `/blog/${post.slug}/`,
})),
});
}