+
+
+
+
+
ʕ·ᴥ·ʔ
+
home
+
+
+
+
george! yes!
+
+
+
+
+
george is my stuffed monkey. i am building her a computer body.
+
+
am i a crank? ...a little <3
+
+
+
+
+
+
+
+
diff --git a/site/giving-us-money.html b/site/giving-us-money.html
new file mode 100644
index 0000000..957afa6
--- /dev/null
+++ b/site/giving-us-money.html
@@ -0,0 +1,80 @@
+
+
+
+
+
+
+
+
ʕ·ᴥ·ʔ- august kline
+
+
+
+
+
+
+
+
+
+
+
ʕ·ᴥ·ʔ
+
home
+
+
+
+
give us money!
+
+
did you know the U.S. trans unemployment rate is
+ 18% ? or that the trans poverty rate is 34% ?
+
+
now more than ever, trans people need money! if you know a trans person,
+ give them anything you can. if you don't (or if you have more to give!), here are some
+ groups that need your money:
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/site/index.html b/site/index.html
new file mode 100644
index 0000000..730ccb6
--- /dev/null
+++ b/site/index.html
@@ -0,0 +1,55 @@
+
+
+
+
+
+
+
+
ʕ·ᴥ·ʔ- august kline
+
+
+
+
+
+
+
+
+
+
+
ʕ·ᴥ·ʔ
+
home
+
+
+
+
hi, i'm august...
+
+
+ i'm like, ludicrously into computers <3
+
as of january 2025, myself & my friends no longer legally
+ exist
+ here in the u.s.. i have a bag packed for if i have to flee my home. things are dark right now.
+ if you're cis, you can help by giving us money !
+
those in power are trying to wipe us out, but their failure will make our existence
+ undeniable .
+
+
anyways... hi! welcome <3 you can find more at the link authority
+
+
+
+
love ,kline
+
+
+
+
+
+
diff --git a/site/links.html b/site/links.html
new file mode 100644
index 0000000..7dfb90c
--- /dev/null
+++ b/site/links.html
@@ -0,0 +1,50 @@
+
+
+
+
+
+
+
+
ʕ·ᴥ·ʔ- august kline
+
+
+
+
+
+
+
+
+
+
+
ʕ·ᴥ·ʔ
+
home
+
+
+
+
+
+
i hope you like my fun quirky design choices
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/site/minecraft.html b/site/minecraft.html
new file mode 100644
index 0000000..14746ea
--- /dev/null
+++ b/site/minecraft.html
@@ -0,0 +1,43 @@
+
+
+
+
+
+
+
+
ʕ·ᴥ·ʔ- minecraft
+
+
+
+
+
+
+
+
+
+
+
+
ʕ·ᴥ·ʔ
+
home
+
+
+
+
+
+
i've played minecraft since i was like 10, and recently i started a world this year that i plan on
+ playing forever :)
+
+
+
i live on a little island called foxtrot island , cause there's a bunch of foxes there lol
+
+
+
+
+
+
diff --git a/site/style.css b/site/style.css
new file mode 100644
index 0000000..cb42f85
--- /dev/null
+++ b/site/style.css
@@ -0,0 +1,457 @@
+@font-face {
+ src: url("./assets/fonts/LatinModernMonoRegular.otf");
+ font-family: "LatinModernMono";
+ font-style: normal;
+ font-weight: normal;
+}
+
+@font-face {
+ src: url("./assets/fonts/LatinModernMonoBold.otf");
+ font-family: "LatinModernMono";
+ font-weight: bold;
+ font-style: normal;
+}
+
+@font-face {
+ src: url("./assets/fonts/LatinModernMonoBoldOblique.otf");
+ font-family: "LatinModernMono";
+ font-weight: bold;
+ font-style: oblique;
+}
+
+@font-face {
+ src: url("./assets/fonts/LatinModernMonoItalic.otf");
+ font-family: "LatinModernMono";
+ font-weight: normal;
+ font-style: oblique;
+}
+
+@font-face {
+ src: url("./assets/fonts/Bienchena.ttf");
+ font-family: "Bienchen";
+}
+
+:root {
+ --text-color: color-mix(in srgb, black 40%, darkslategrey 60%);
+ --text-bg-color: snow;
+ font-synthesis: none;
+ text-rendering: optimizeLegibility;
+ -webkit-font-smoothing: antialiased;
+ -moz-osx-font-smoothing: grayscale;
+ color: var(--text-color);
+}
+
+body,
+html {
+ block-size: 100%;
+ inline-size: 100%;
+ margin: 0;
+ padding: 0;
+}
+
+body {
+ display: flex;
+ background-color: linen;
+}
+
+::selection {
+ background: color-mix(in srgb, mistyrose 80%, transparent 20%);
+ /* background: lightpink; */
+}
+
+
+a {
+ &[href^="http"] {
+ --color: darkgreen;
+ text-decoration-style: dashed;
+ }
+
+ text-decoration-thickness: 1px;
+
+ --color: firebrick;
+ color: var(--color);
+ text-decoration-style: wavy;
+
+ @media not (prefers-reduced-motion) {
+ transition: 0.3s outline ease,
+ 0.2s text-shadow ease;
+ }
+
+ outline: 2px transparent solid;
+
+ &:hover {
+ text-shadow: 0px 0px 1px var(--color);
+ }
+
+ &:focus-visible {
+ outline: 2px var(--color) solid;
+ }
+}
+
+main {
+ user-select: none;
+ /* top: 50%; */
+ /* left: 50%; */
+ /* position: absolute; */
+ container-type: size;
+ background: var(--text-bg-color);
+ transform: rotate(-1deg);
+ aspect-ratio: 5.5 / 8.75;
+ font-family: "Bienchen";
+ box-shadow: 5px 5px 20px rgba(152, 97, 42, 0.1);
+ word-wrap: pretty;
+ margin: auto;
+
+ --scale: 0.9;
+
+ --block: calc(var(--scale) * 100svb);
+ --inline: calc(var(--scale) * 100svi * (8.75 / 5.5));
+
+ block-size: min(var(--inline), var(--block));
+
+ transition: 0.3s transform ease, 0.3s box-shadow ease;
+
+ &>div {
+ padding: 2% 5%;
+ font-size: 8cqb;
+ }
+
+ .content {
+ transform: rotate(-0.5deg);
+ }
+
+ h1 {
+ img {
+ max-inline-size: 70cqi;
+ }
+
+ font-size: 1em;
+ margin-block: 0.5em;
+ color: darkblue;
+ user-select: text;
+ }
+
+ p,
+ li {
+ font-family: "LatinModernMono";
+ line-height: 1.1em;
+ user-select: text;
+ }
+
+ .content {
+ font-size: 0.4em;
+ }
+
+ @media not (prefers-reduced-motion) {
+ &:hover {
+ transform: scale(1.025) rotate(0deg);
+ box-shadow: 0px 0px 30px rgba(152, 97, 42, 0.05);
+ }
+ }
+
+ .signature {
+ appearance: none;
+ color: unset;
+ text-decoration: none;
+ position: absolute;
+ right: 10%;
+ font-family: "Bienchen";
+ font-size: 0.65em;
+ line-height: 0.8em;
+ transform: rotate(-4deg);
+ text-align: end;
+
+ transition: outline 0.3s ease, transform 0.2s ease;
+
+ @media not (prefers-reduced-motion) {
+ * {
+ transition: text-shadow 0.2s ease;
+ text-shadow: -1px 2px 4px rgba(152, 97, 42, 0);
+ }
+
+
+ &:hover,
+ &:focus-visible {
+ transform: translateY(-2px) rotate(-2deg) scale(1.025);
+
+ * {
+ text-shadow: 0px 2px 4px rgba(152, 97, 42, 0.1);
+ }
+ }
+ }
+
+ outline: 2px transparent solid;
+
+ &:focus-visible {
+ outline: 2px crimson solid;
+ }
+
+ }
+
+ .valediction {
+ color: crimson;
+ letter-spacing: -0.03em;
+ }
+
+}
+
+.clipped {
+ position: absolute;
+ display: block;
+ container-type: inline-size;
+ z-index: 100;
+ top: 0;
+ right: 0;
+ inline-size: 20cqi;
+
+ :first-child {
+ inline-size: 100cqi;
+ position: relative;
+ }
+
+ .clipped-items {
+ appearance: none;
+ display: block;
+ transform: rotate(17deg);
+ color: unset;
+ text-shadow: unset;
+
+ img {
+ position: relative;
+ box-shadow: 0px 4px 8px rgba(152, 97, 42, 0.2);
+ outline: 2px transparent solid;
+ transition: outline 0.3s ease;
+ }
+
+ .slip {
+ appearance: unset;
+ margin: 0;
+
+ * {
+ margin: 0;
+ }
+
+ position: absolute;
+ background: antiquewhite;
+ color: var(--text-color);
+ font-size: 0.35em;
+ padding-inline: 0.5ch;
+ display: block;
+ z-index: -1;
+ --mask: conic-gradient(from 60deg at left, #0000, #000 1deg 59deg, #0000 60deg) left/51% 0.2em repeat-y,
+ conic-gradient(from -120deg at right, #0000, #000 1deg 59deg, #0000 60deg) right/51% 0.2em repeat-y;
+ -webkit-mask: var(--mask);
+ mask: var(--mask);
+ }
+
+ .slip-george {
+ bottom: 20%;
+ left: 40%;
+ transform: translateX(-50%) rotate(-5deg);
+ }
+
+ .slip-label {
+ z-index: 1;
+ bottom: 65%;
+ left: 70%;
+ transform: translateX(-50%) rotate(25deg);
+ }
+
+ &:focus-visible {
+ outline: none;
+
+ img {
+ outline: 2px crimson solid;
+ }
+ }
+ }
+
+ .paperclip {
+ position: absolute;
+ right: 0;
+ top: -20%;
+ inline-size: 50cqi;
+ filter: brightness(0.85);
+ }
+
+ @media (prefers-reduced-motion) {
+ .clipped-items {
+ transform: rotate(9deg) translate(-5%, 10%);
+
+ .slip-george {
+ bottom: -15%;
+ left: 40%;
+ transform: translateX(-50%) rotate(-15deg);
+ }
+ }
+
+ .paperclip {
+ transform: rotate(4deg);
+ top: -25%;
+ }
+ }
+
+
+ @media not (prefers-reduced-motion) {
+ * {
+ transition: transform 0.4s ease, top 0.3s ease, bottom 0.3s ease, left 0.3s ease;
+ }
+
+ &:has(.clipped-items:focus) {
+ .clipped-items {
+ transform: rotate(9deg) translate(-5%, 10%);
+ }
+
+ .paperclip {
+ transform: rotate(4deg);
+ top: -25%;
+ }
+ }
+
+ &:hover,
+ &:focus-visible {
+ .clipped-items {
+ transform: rotate(9deg) translate(-5%, 10%);
+
+ .slip-george {
+ bottom: 5%;
+ left: 50%;
+ transform: translateX(-50%) rotate(-18deg);
+ }
+
+ .slip-sitemap {
+ bottom: 70%;
+ left: -30%;
+ transform: translateX(-50%) rotate(7deg);
+ }
+ }
+
+ .paperclip {
+ transform: rotate(4deg);
+ top: -25%;
+ }
+ }
+ }
+}
+
+.authority {
+ img {
+ block-size: 8cqb;
+ opacity: 0.9;
+ }
+}
+
+.stamp {
+ display: block;
+
+ img {
+ position: absolute;
+ transition: 0.3s transform ease;
+ block-size: 15cqb;
+ }
+
+ &:hover {
+ img {
+ transform: rotate(0deg) scale(1.05) !important;
+ }
+ }
+}
+
+.taped {
+
+ img {
+ max-block-size: 35cqb;
+ max-inline-size: 60cqi;
+ /* box-shadow: 0px 0px 8px rgba(152, 97, 42, 0.3); */
+ }
+
+ &::before,
+ &::after {
+ content: "";
+ display: block;
+ position: absolute;
+ block-size: 4.5cqb;
+ aspect-ratio: 8 / 3;
+ transform: rotate(-45deg);
+ background-size: contain;
+ background-position: center;
+ background-repeat: no-repeat;
+ opacity: 0.95;
+ }
+
+ &::before {
+ top: 0cqb;
+ left: -6cqi;
+ background-image: var(--washi-url-0);
+ }
+
+ &::after {
+ bottom: 1cqb;
+ right: -6cqi;
+ background-image: var(--washi-url-1);
+ }
+}
+
+.taped,
+.gallery-3 {
+ display: inline-flex;
+ position: relative;
+ align-items: center;
+ justify-content: center;
+ margin-inline-start: 50%;
+ transform: translateX(-50%) rotate(1deg);
+}
+
+.gallery-3 {
+ img {
+ max-block-size: 25cqb;
+ max-inline-size: 40cqi;
+ }
+
+ div {
+
+ /* position: absolute; */
+ &::before,
+ &::after {
+ content: "";
+ display: block;
+ position: absolute;
+ block-size: 3cqb;
+ aspect-ratio: 8 / 3;
+ background-size: contain;
+ background-position: center;
+ background-repeat: no-repeat;
+ opacity: 0.95;
+ }
+
+ --washi-url-0: url("/assets/images/washi/0.png");
+ --washi-url-1: url("/assets/images/washi/0.png");
+
+ &::before {
+ top: -2cqb;
+ left: 50%;
+ transform: translateX(-50%);
+ background-image: var(--washi-url-0);
+ }
+ }
+
+ &>* {
+ position: relative;
+ }
+
+ &>:nth-child(1) {
+ transform: translate(40%, 10%) rotate(-8deg);
+ }
+
+ &>:nth-child(2) {
+ z-index: 100;
+ }
+
+ &>:nth-child(3) {
+ transform: translate(-40%, 10%) rotate(8deg);
+ }
+}
+
+.pos-anchor {
+ position: relative;
+}
diff --git a/src/blog/init.md b/src/blog/init.md
deleted file mode 100644
index a48c52a..0000000
--- a/src/blog/init.md
+++ /dev/null
@@ -1,13 +0,0 @@
----
-title: hello word
-date: 2024-9-30
-desc: the first post on my blog! check back in soon cause this is very janky rn lol
----
-
-# hi!
-
-i just wanted to get something up and running before cohost shuts down
-
-this will look prettier soon i was just rushing!
-
-you can subscribe with [rss](/feed.xml) and eventually i think i will add automated instagram posts whenever there's a new update, but that's for later
diff --git a/src/main.ts b/src/main.ts
deleted file mode 100644
index 87b707e..0000000
--- a/src/main.ts
+++ /dev/null
@@ -1,218 +0,0 @@
-import sunsetfourteenth from "/14thstsunrise.gif";
-import backwalkgeorge from "/backwalkgeorge.jpg";
-import ducklings from "/ducklings.gif";
-import ermine from "/ermine.gif";
-import fieldnotes from "/fieldnotes.gif";
-import flowers from "/flowers.jpg";
-import georgerasp from "/georgerasp.gif";
-import georgetoilet from "/georgetoilet.jpg";
-import heron from "/heron.jpg";
-import klinefloor from "/klinefloor.jpg";
-import klinemirror from "/klinemirror.jpg";
-import klineoutside from "/klineoutside.jpg";
-import klinetrain from "/klinetrain.jpg";
-import lamp from "/lamp.gif";
-import mirror from "/mirror.jpg";
-import ohio from "/ohio.jpg";
-import sashaklineburrito from "/sashaklineburrito.jpg";
-import sashaklinecar from "/sashaklinecar.jpg";
-import solderkitty from "/solderkitty.jpg";
-import sunsetkline from "/sunsetkline.jpg";
-
-const background = document.getElementById("background")!;
-
-const prefersReducedMotion = window.matchMedia(
- "(prefers-reduced-motion: reduce)",
-).matches;
-
-const setImages = () => {
- let images: string[] = [];
- let alts: string[] = [];
- if (prefersReducedMotion) {
- images = [
- backwalkgeorge,
- fieldnotes,
- flowers,
- georgetoilet,
- heron,
- klinefloor,
- klinemirror,
- klineoutside,
- klinetrain,
- mirror,
- ohio,
- sashaklineburrito,
- sashaklinecar,
- solderkitty,
- sunsetkline,
- ];
- alts = [
- "A small child holding a stuffed monkey and a santa hat walking away from the camera",
- "Animated gif of a notebook with a pretty landscape illustration cover",
- "A field of violet flowers",
- "A woman smiling next to a stuffed monkey",
- "A heron standing in a pond",
- "A woman in a green sweater and jeans sitting on the floor and smiling",
- "A woman in bed taking a mirror selfie where her face is distorted",
- "A selfie of a woman in a driveway next to a truck",
- "A young girl smiling in front of a train",
- "A shattered mirror",
- "Two adjacent houses lit by an early morning sunrise",
- "A selfie of two friends holding burritos, one of whom is wearing a cammo hat",
- "A selfie of two friends in a car, one of whom is wearing a cammo hat",
- "A pink porcelain kitty figurine supporting a soldering iron",
- "A selfie of a woman indoors, behind her the sun is setting in the window",
- ];
- } else {
- images = [
- sunsetfourteenth,
- backwalkgeorge,
- ducklings,
- ermine,
- fieldnotes,
- flowers,
- georgerasp,
- georgetoilet,
- heron,
- klinefloor,
- klinemirror,
- klineoutside,
- klinetrain,
- lamp,
- mirror,
- ohio,
- sashaklineburrito,
- sashaklinecar,
- solderkitty,
- sunsetkline,
- ];
- alts = [
- "Animated gif of a sunrise on a city street",
- "A small child holding a stuffed monkey and a santa hat walking away from the camera",
- "Animated gif of a duck and ducklings swimming in a pond",
- "Animated gif of an ermine peeking up out of a crack in concrete",
- "Animated gif of a notebook with a pretty landscape illustration cover",
- "A field of violet flowers",
- "Animated gif of an amber CRT screen with flashing text and Raspberry Pi logo",
- "A woman smiling next to a stuffed monkey",
- "A heron standing in a pond",
- "A woman in a green sweater and jeans sitting on the floor and smiling",
- "A woman in bed taking a mirror selfie where her face is distorted",
- "A selfie of a woman in a driveway next to a truck",
- "A young girl smiling in front of a train",
- "Animated gif of a lamp behind which cars drive past in the snow",
- "A shattered mirror",
- "Two adjacent houses lit by an early morning sunrise",
- "A selfie of two friends holding burritos, one of whom is wearing a cammo hat",
- "A selfie of two friends in a car, one of whom is wearing a cammo hat",
- "A pink porcelain kitty figurine supporting a soldering iron",
- "A selfie of a woman indoors, behind her the sun is setting in the window",
- ];
- }
- const randn_bm = (mean = 0, stdev = 0.4) => {
- const u = 1 - Math.random();
- const v = Math.random();
- const z = Math.sqrt(-2.0 * Math.log(u)) * Math.cos(2.0 * Math.PI * v);
- return z * stdev + mean;
- };
-
- const randNums = (count: number, minDistance: number): number[] => {
- const numbers: number[] = [];
-
- function isFarEnough(num: number): boolean {
- for (const n of numbers) {
- if (Math.abs(num - n) < minDistance) {
- return false;
- }
- }
- return true;
- }
-
- while (numbers.length < count) {
- const newNumber = randn_bm();
- if (isFarEnough(newNumber)) {
- numbers.push(newNumber);
- }
- }
-
- return numbers;
- };
-
- const lefts = randNums(images.length, 0.05);
- const tops = randNums(images.length, 0.05);
-
- for (let index in images) {
- const img = document.createElement("img");
- img.setAttribute("src", images[index]);
- img.setAttribute("alt", alts[index]);
- let seedX = Math.random() * Math.random() * 100;
- let seedY = Math.random() * Math.random() * 100;
- img.setAttribute("seedX", seedX.toString());
- img.setAttribute("seedY", seedY.toString());
- const left = lefts[index];
- const top = tops[index];
- const z = (Math.abs(left) + Math.abs(top)) / 2;
- const size = Math.random() * 5 + 9;
- const range = { x: window.innerWidth * 0.7, y: window.innerHeight * 0.7 };
- img.style.setProperty(
- "left",
- `${left * range.x + window.innerWidth / 2}px`,
- );
- img.style.setProperty("top", `${top * range.y + window.innerHeight / 2}px`);
- img.style.setProperty("--translate-z", `${z * 3000}px`);
- img.style.setProperty("inline-size", `${size}vmax`);
- background.append(img);
- }
-};
-
-const mobile = window.matchMedia("(hover: none) and (pointer: coarse)").matches;
-
-if (!mobile) {
- const root = document.documentElement;
- const onMove = (ev: MouseEvent) => {
- const rotateY = `${-(ev.clientX - window.innerWidth / 2) * 0.003}deg`;
- const rotateX = `${(ev.clientY - window.innerHeight / 2) * 0.003}deg`;
- root.style.setProperty("--rotate-x", rotateX);
- root.style.setProperty("--rotate-y", rotateY);
- };
- document.addEventListener("mousemove", onMove);
-}
-
-window.addEventListener("load", () => {
- background.setAttribute("loaded", "");
-
- const noise = (t: number) => {
- return Math.sin(2 * t) + Math.sin(Math.PI * t);
- };
-
- const toDomPrecision = (v: number) => {
- return Math.round(v * 1e4) / 1e4;
- };
-
- const dpi = window.devicePixelRatio;
- const moveImages = (t: number) => {
- const background = document.getElementById("background")!;
- const images = background.getElementsByTagName("img");
- for (let i = 0; i < images.length; i++) {
- const img = images[i];
- let top = toDomPrecision(
- Number(img.style.top.slice(0, img.style.top.length - 2)),
- );
- let left = toDomPrecision(
- Number(img.style.left.slice(0, img.style.left.length - 2)),
- );
- top += (noise(Number(img.getAttribute("seedY")) + t) * 0.4) / dpi; // move faster on lower-res displays to improve jitter
- left += (noise(Number(img.getAttribute("seedX")) + t) * 0.4) / dpi;
- img.style.setProperty("top", `${top}px`);
- img.style.setProperty("left", `${left}px`);
- }
- t += 0.0005;
- window.requestAnimationFrame(moveImages.bind(this, t));
- };
-
- if (!prefersReducedMotion) {
- moveImages(0);
- }
-});
-
-setImages();
diff --git a/src/vite-env.d.ts b/src/vite-env.d.ts
deleted file mode 100644
index 11f02fe..0000000
--- a/src/vite-env.d.ts
+++ /dev/null
@@ -1 +0,0 @@
-///
diff --git a/tsconfig.json b/tsconfig.json
deleted file mode 100644
index 75abdef..0000000
--- a/tsconfig.json
+++ /dev/null
@@ -1,23 +0,0 @@
-{
- "compilerOptions": {
- "target": "ES2020",
- "useDefineForClassFields": true,
- "module": "ESNext",
- "lib": ["ES2020", "DOM", "DOM.Iterable"],
- "skipLibCheck": true,
-
- /* Bundler mode */
- "moduleResolution": "bundler",
- "allowImportingTsExtensions": true,
- "resolveJsonModule": true,
- "isolatedModules": true,
- "noEmit": true,
-
- /* Linting */
- "strict": true,
- "noUnusedLocals": true,
- "noUnusedParameters": true,
- "noFallthroughCasesInSwitch": true
- },
- "include": ["src"]
-}
diff --git a/vite.config.ts b/vite.config.ts
deleted file mode 100644
index e5bd5d0..0000000
--- a/vite.config.ts
+++ /dev/null
@@ -1,186 +0,0 @@
-import { defineConfig } from "vite";
-import fs from "fs";
-import path from "path";
-import { marked, Token, Tokens } from "marked";
-import xml from "xml";
-import matter from "gray-matter";
-import highlight from "highlight.js";
-
-const blogDir = path.resolve(__dirname, "src/blog");
-const outputDir = path.resolve(__dirname, "dist/blog");
-const rssFeedPath = path.resolve(__dirname, "dist/feed.xml");
-
-const hostname = "https://augustkline.com";
-const blogUrl = `${hostname}/blog`;
-
-interface Articles {
- title: string;
- link: string;
- description: string;
- pubDate: string;
-}
-
-const renderer = new marked.Renderer();
-
-renderer.code = ({ text, lang }: Tokens.Code) => {
- const validLang = highlight.getLanguage(lang!) ? lang! : "plaintext";
- const highlightedCode = highlight.highlight(text!, { language: validLang });
- return `
${highlightedCode.value}`;
-};
-
-marked.setOptions({
- renderer,
- gfm: true,
- breaks: true,
-});
-
-function generateBlogHtml() {
- fs.mkdirSync(outputDir, { recursive: true });
-
- const articles: Articles[] = [];
-
- let blurbs: { date: string; content: string }[] = [];
-
- fs.readdirSync(blogDir).forEach((file) => {
- if (file.endsWith(".md")) {
- const filePath = path.join(blogDir, file);
- const str = fs.readFileSync(filePath, "utf-8");
- let { data, content } = matter(str);
-
- const slug = `${data.date!}-${data.title!.replace(/ /g, "-")}`;
-
- const html_content = marked.parse(content);
-
- const blogPostsPath = path.join(outputDir, `${slug}.html`);
-
- const postHtml = `
-
-
-
-
-
-
${data.title!}
-
-
-
-
-
- ${html_content}
- Back to Home
-
-
-
-
-
-
- `;
-
- const link = `/blog/${slug}.html`;
- const blurbHtml = `
-
- `;
-
- blurbs.push({ date: data.date!, content: blurbHtml });
-
- fs.writeFileSync(blogPostsPath, postHtml);
-
- // Store article data for RSS
- articles.push({
- title: data.title!,
- link: link,
- description: data.desc!,
- pubDate: data.date!,
- });
- }
- });
-
- const blogIndexPath = path.join(outputDir, "index.html");
- blurbs.sort((a, b) => {
- return new Date(b.date).getTime() - new Date(a.date).getTime();
- });
- let blurbsHtml: string = "";
- for (let blurb in blurbs) {
- blurbsHtml = blurbsHtml.concat(blurbs[blurb].content);
- }
- const blogIndexHtml = `
-
-
-
-
-
-
august kline's blog
-
-
-
-
-
- ʕ·ᴥ·ʔ-☆ august kline's blog ☆
- ${blurbsHtml}
-
-
-
-
-
-
- `;
- fs.writeFileSync(blogIndexPath, blogIndexHtml);
- return articles;
-}
-
-// Function to generate RSS feed
-function generateRssFeed(articles: Articles[]) {
- const feedItems = articles.map((article) => ({
- item: [
- { title: article.title },
- { link: article.link },
- { description: article.description },
- { pubDate: article.pubDate },
- ],
- }));
-
- const rss = {
- rss: [
- {
- channel: [
- { title: "ʕ·ᴥ·ʔ-☆ august kline's blog ☆" },
- { link: `${blogUrl}` }, // Update with your domain
- {
- description:
- "whatever's on my mind, short essays, tech stuff, etc :)",
- },
- ...feedItems,
- ],
- },
- ],
- };
-
- const rssXml = xml(rss, { declaration: true });
- fs.writeFileSync(rssFeedPath, rssXml);
-}
-
-// Export Vite config
-export default defineConfig({
- build: {
- rollupOptions: {
- output: {
- entryFileNames: `main.js`,
- },
- plugins: [
- {
- name: "generate-blog-html-and-rss",
- writeBundle() {
- // parses blog markdown, writes the blog endpoints and returns array of article data
- const articles = generateBlogHtml();
- generateRssFeed(articles);
- },
- },
- ],
- },
- },
-});
+ 
+ 
+ 
+ 
+ 
+ 
+ 
