Finally, a functioning blog
This commit is contained in:
parent
32bfe0213c
commit
18f90e6c4d
19 changed files with 3761 additions and 4022 deletions
7343
package-lock.json
generated
7343
package-lock.json
generated
File diff suppressed because it is too large
Load diff
|
@ -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
63
src/components/Card-Blog.astro
Executable 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>→</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>
|
|
@ -1,4 +1,5 @@
|
|||
---
|
||||
const today = new Date();
|
||||
---
|
||||
<br><br>
|
||||
<center>
|
||||
|
|
17
src/components/FormattedDate.astro
Normal file
17
src/components/FormattedDate.astro
Normal 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>
|
|
@ -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" />
|
||||
|
|
|
@ -1,4 +1,6 @@
|
|||
---
|
||||
import HeaderLink from './HeaderLink.astro';
|
||||
import { SITE_TITLE } from '../consts';
|
||||
---
|
||||
|
||||
<center>
|
||||
|
|
25
src/components/HeaderLink.astro
Normal file
25
src/components/HeaderLink.astro
Normal 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
5
src/consts.ts
Normal 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';
|
19
src/content/blog/minecraft-badges.md
Normal file
19
src/content/blog/minecraft-badges.md
Normal 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"/>
|
35
src/content/blog/my-setup.md
Normal file
35
src/content/blog/my-setup.md
Normal 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
15
src/content/config.ts
Normal 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 };
|
40
src/layouts/BlogPost.astro
Normal file
40
src/layouts/BlogPost.astro
Normal 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>
|
|
@ -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>
|
20
src/pages/blog/[...slug].astro
Normal file
20
src/pages/blog/[...slug].astro
Normal 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>
|
38
src/pages/blog/index.astro
Normal file
38
src/pages/blog/index.astro
Normal 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>
|
|
@ -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>
|
|
@ -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>
|
|
@ -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}/`,
|
||||
})),
|
||||
});
|
||||
}
|
Loading…
Reference in a new issue