Compare commits
12 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
 Avraham Sakal
|
5e13636094 | ||
|
Avraham Sakal
|
9eb7dda047 | ||
|
Avraham Sakal
|
b2d21088cb | ||
|
Avraham Sakal
|
15601e7bd4 | ||
|
Avraham Sakal
|
102d4716e0 | ||
|
Avraham Sakal
|
a116090136 | ||
|
Avraham Sakal
|
79deff3b6c | ||
|
Avraham Sakal
|
f4714839dd | ||
|
Avraham Sakal
|
8532af4c04 | ||
|
Avraham Sakal
|
1d0f679dea | ||
|
Avraham Sakal
|
345a18729a | ||
|
Avraham Sakal
|
626d94694c |
@@ -22,3 +22,5 @@ pnpm-debug.log*
|
||||
|
||||
# jetbrains setting folder
|
||||
.idea/
|
||||
|
||||
.wrangler
|
||||
@@ -1,8 +1,9 @@
|
||||
// @ts-check
|
||||
import { defineConfig } from "astro/config";
|
||||
import fulldev from "fulldev-ui/integration";
|
||||
import node from "@astrojs/node";
|
||||
// import fulldev from "fulldev-ui/integration";
|
||||
import UnoCSS from "unocss/astro";
|
||||
import mdx from "@astrojs/mdx";
|
||||
import cloudflare from "@astrojs/cloudflare";
|
||||
// import { createRequire } from "node:module";
|
||||
|
||||
// const require = createRequire(import.meta.url);
|
||||
@@ -10,32 +11,31 @@ import UnoCSS from "unocss/astro";
|
||||
// https://astro.build/config
|
||||
export default defineConfig({
|
||||
// pre-render by default; opt-in to dynamic SSR:
|
||||
output: "hybrid",
|
||||
output: "server",
|
||||
|
||||
adapter: node({
|
||||
mode: "standalone",
|
||||
}),
|
||||
adapter: cloudflare(),
|
||||
|
||||
integrations: [
|
||||
mdx(),
|
||||
UnoCSS({
|
||||
// injectReset: true, // or a path to the reset file
|
||||
}),
|
||||
fulldev({
|
||||
// css: '/src/css/custom.css',
|
||||
colors: {
|
||||
theme: "dark",
|
||||
dark: {
|
||||
background: "#111110",
|
||||
base: "#3E63DD",
|
||||
brand: "#359",
|
||||
},
|
||||
light: {
|
||||
background: "#EEEEEC",
|
||||
base: "#6F6D66",
|
||||
brand: "#3E63DD",
|
||||
},
|
||||
},
|
||||
injectReset: "@unocss/reset/normalize.css",
|
||||
}),
|
||||
// fulldev({
|
||||
// // css: '/src/css/custom.css',
|
||||
// colors: {
|
||||
// theme: "dark",
|
||||
// dark: {
|
||||
// background: "#111110",
|
||||
// base: "#3E63DD",
|
||||
// brand: "#359",
|
||||
// },
|
||||
// light: {
|
||||
// background: "#EEEEEC",
|
||||
// base: "#6F6D66",
|
||||
// brand: "#3E63DD",
|
||||
// },
|
||||
// },
|
||||
// }),
|
||||
],
|
||||
|
||||
vite: {
|
||||
+11
-5
@@ -12,12 +12,18 @@
|
||||
},
|
||||
"dependencies": {
|
||||
"@astrojs/check": "^0.9.4",
|
||||
"@astrojs/node": "^8.3.4",
|
||||
"astro": "^4.16.13",
|
||||
"@astrojs/cloudflare": "^12.0.1",
|
||||
"@astrojs/mdx": "^4.0.1",
|
||||
"@radix-ui/colors": "^3.0.0",
|
||||
"astro": "^5.0.3",
|
||||
"fulldev-ui": "^0.4.33",
|
||||
"typescript": "^5.6.3"
|
||||
"typescript": "^5.7.2"
|
||||
},
|
||||
"devDependencies": {
|
||||
"unocss": "^0.64.1"
|
||||
"@iconify-json/mdi": "^1.2.1",
|
||||
"@unocss/preset-uno": "^0.64.1",
|
||||
"@unocss/reset": "^0.65.1",
|
||||
"unocss": "^0.64.1",
|
||||
"wrangler": "^3.93.0"
|
||||
}
|
||||
}
|
||||
}
|
||||
Generated
+1646
-512
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,13 @@
|
||||
---
|
||||
---
|
||||
<div class:list={["flex", "flex-justify-between"]}>
|
||||
<div class:list={["flex", "flex-content-start"]}>
|
||||
<slot name="left" />
|
||||
</div>
|
||||
<div class:list={["flex", "flex-content-center"]}>
|
||||
<slot name="center" />
|
||||
</div>
|
||||
<div class:list={["flex", "flex-content-end"]}>
|
||||
<slot name="right" />
|
||||
</div>
|
||||
</div>
|
||||
+22
-4
@@ -1,11 +1,29 @@
|
||||
// 1. Import utilities from `astro:content`
|
||||
import { defineCollection } from "astro:content";
|
||||
import { defineCollection, z } from "astro:content";
|
||||
// 2. Define your collection(s)
|
||||
const blogCollection = defineCollection({
|
||||
/* ... */
|
||||
const journalCollection = defineCollection({
|
||||
type: "content",
|
||||
schema: z.object({
|
||||
title: z.string(),
|
||||
date: z.date(),
|
||||
tags: z.string().array(),
|
||||
category: z.string().optional(),
|
||||
description: z.string().optional(),
|
||||
}),
|
||||
});
|
||||
const articleCollection = defineCollection({
|
||||
type: "content",
|
||||
schema: z.object({
|
||||
title: z.string(),
|
||||
date: z.date(),
|
||||
tags: z.string().array(),
|
||||
category: z.string().optional(),
|
||||
description: z.string().optional(),
|
||||
}),
|
||||
});
|
||||
// 3. Export a single `collections` object to register your collection(s)
|
||||
// This key should match your collection directory name in "src/content"
|
||||
export const collections = {
|
||||
blog: blogCollection,
|
||||
"journal-entries": journalCollection,
|
||||
articles: articleCollection,
|
||||
};
|
||||
|
||||
@@ -1,6 +1,9 @@
|
||||
---
|
||||
title: MySQL JSON Shenanigans
|
||||
date: 2024-11-19
|
||||
tags: ["mysql"]
|
||||
category: "MySQL"
|
||||
description: "Out of the box, there is a MySQL text encoding mismatch between VARCHAR columns and JSON columns."
|
||||
---
|
||||
|
||||
In an effort to support out-of-date installations of our app, I had to keep a JSON column in our database. The column is obsolete, as are the values within it; but these installations continue to use it. So, knowing this, I decided to put the proper values into the column. I didn't want to pollute the code of our services to do so, though. So I made it into a `GENERATED` column.
|
||||
@@ -1,6 +1,9 @@
|
||||
---
|
||||
title: Elasticsearch Ingestion Daemon
|
||||
date: 2024-11-20
|
||||
tags: ["elasticsearch"]
|
||||
category: "Elasticsearch"
|
||||
description: "Batch-processing boundaries need to be defined with enough information to point to exactly one record, taking into account records being updated between batches."
|
||||
---
|
||||
|
||||
I still saw requests coming in through an old Cloudflare-Worker-based proxy I had set up, before I released the current one, which rewrites `m3u8` files on-the-fly, besides proxying the segment files themselves (among other features). I updated our website and app to use the new proxy; where were these requests coming from? I inspected some requests as they came in using the Cloudflare interface, and I found that the User Agent was always one of our apps; and different versions of it at that. We still had un-updated versions of our app out in the wild, but I also saw requests from the latest version! How could this be?
|
||||
@@ -1,6 +1,9 @@
|
||||
---
|
||||
title: React-Admin Wrestling, a Little More Elasticsearch
|
||||
date: 2024-11-21
|
||||
tags: ["react", "react-admin", "elasticsearch"]
|
||||
category: "React Admin"
|
||||
description: "(This article is still incomplete. I began writing this entry after work the day it happened, and I didn't get a chance to get back to it until today (12 days later), so I forgot what I was planning on writing about!)"
|
||||
---
|
||||
|
||||
React-admin is a wonderful framework, and is quite flexible; but if you need something that it doesn't offer, it's very difficult to dig through the docs to find out how to do it.
|
||||
+10
-7
@@ -1,5 +1,8 @@
|
||||
---
|
||||
title: "@astrojs/node Build Error"
|
||||
tags: ["astro"]
|
||||
category: "Astro"
|
||||
description: "Always prefix native imports with `node:`, even in dependencies. If a dependency doesn't do it, adjust your build-step to do it for you."
|
||||
date: 2024-11-23
|
||||
---
|
||||
|
||||
@@ -28,13 +31,13 @@ It ran fine in dev mode (`pnpm run dev`), but when I tried to build it (`pnpm ru
|
||||
```
|
||||
23:29:44 [ERROR] [vite] x Build failed in 331ms
|
||||
[commonjs--resolver] Failed to resolve entry for package "fs". The package may have incorrect main/module/exports specified in its package.json.
|
||||
file: /home/avraham/sakal.us/blog-astro/node_modules/.pnpm/send@0.19.1/node_modules/send/index.js
|
||||
file: .../blog-astro/node_modules/.pnpm/send@0.19.1/node_modules/send/index.js
|
||||
Stack trace:
|
||||
at packageEntryFailure (file:///home/avraham/sakal.us/blog-astro/node_modules/.pnpm/vite@5.4.11_sass@1.81.0/node_modules/vite/dist/node/chunks/dep-CB_7IfJ-.js:46637:15)
|
||||
at tryNodeResolve (file:///home/avraham/sakal.us/blog-astro/node_modules/.pnpm/vite@5.4.11_sass@1.81.0/node_modules/vite/dist/node/chunks/dep-CB_7IfJ-.js:46450:16)
|
||||
at Object.handler (file:///home/avraham/sakal.us/blog-astro/node_modules/.pnpm/vite@5.4.11_sass@1.81.0/node_modules/vite/dist/node/chunks/dep-CB_7IfJ-.js:65653:15)
|
||||
at async PluginDriver.hookFirstAndGetPlugin (file:///home/avraham/sakal.us/blog-astro/node_modules/.pnpm/rollup@4.27.2/node_modules/rollup/dist/es/shared/node-entry.js:21099:28)
|
||||
at async ModuleLoader.resolveId (file:///home/avraham/sakal.us/blog-astro/node_modules/.pnpm/rollup@4.27.2/node_modules/rollup/dist/es/shared/node-entry.js:20132:15)
|
||||
at packageEntryFailure (file://.../blog-astro/node_modules/.pnpm/vite@5.4.11_sass@1.81.0/node_modules/vite/dist/node/chunks/dep-CB_7IfJ-.js:46637:15)
|
||||
at tryNodeResolve (file://.../blog-astro/node_modules/.pnpm/vite@5.4.11_sass@1.81.0/node_modules/vite/dist/node/chunks/dep-CB_7IfJ-.js:46450:16)
|
||||
at Object.handler (file://.../blog-astro/node_modules/.pnpm/vite@5.4.11_sass@1.81.0/node_modules/vite/dist/node/chunks/dep-CB_7IfJ-.js:65653:15)
|
||||
at async PluginDriver.hookFirstAndGetPlugin (file://.../blog-astro/node_modules/.pnpm/rollup@4.27.2/node_modules/rollup/dist/es/shared/node-entry.js:21099:28)
|
||||
at async ModuleLoader.resolveId (file://.../blog-astro/node_modules/.pnpm/rollup@4.27.2/node_modules/rollup/dist/es/shared/node-entry.js:20132:15)
|
||||
ELIFECYCLE Command failed with exit code 1.
|
||||
```
|
||||
|
||||
@@ -62,4 +65,4 @@ export default defineConfig({
|
||||
});
|
||||
```
|
||||
|
||||
The worked famously.
|
||||
This worked famously.
|
||||
+11
-6
@@ -1,6 +1,9 @@
|
||||
---
|
||||
title: "Content Frontmatter Causes `astro build` Error?"
|
||||
date: 2024-11-24
|
||||
tags: ["astro"]
|
||||
category: "Astro"
|
||||
description: "Keep your eyes peeled for special characters."
|
||||
---
|
||||
|
||||
Another entry for this site. I ran `pnpm run build` after adding yesterday's entry, and got this error:
|
||||
@@ -17,13 +20,13 @@ end of the stream or a document separator is expected
|
||||
See https://docs.astro.build/en/guides/troubleshooting/#document-or-window-is-not-defined for more information.
|
||||
|
||||
Location:
|
||||
/home/avraham/sakal.us/blog-astro/src/content/journal-entries/2024-11-23.md:1:7
|
||||
.../blog-astro/src/content/journal-entries/2024-11-23.md:1:7
|
||||
Stack trace:
|
||||
at generateError (/home/avraham/sakal.us/blog-astro/node_modules/.pnpm/js-yaml@3.14.1/node_modules/js-yaml/lib/js-yaml/loader.js:167:10)
|
||||
at readDocument (/home/avraham/sakal.us/blog-astro/node_modules/.pnpm/js-yaml@3.14.1/node_modules/js-yaml/lib/js-yaml/loader.js:1545:5)
|
||||
at load (/home/avraham/sakal.us/blog-astro/node_modules/.pnpm/js-yaml@3.14.1/node_modules/js-yaml/lib/js-yaml/loader.js:1614:19)
|
||||
at module.exports (/home/avraham/sakal.us/blog-astro/node_modules/.pnpm/gray-matter@4.0.3/node_modules/gray-matter/lib/parse.js:12:17)
|
||||
at matter (/home/avraham/sakal.us/blog-astro/node_modules/.pnpm/gray-matter@4.0.3/node_modules/gray-matter/index.js:50:10)
|
||||
at generateError (.../blog-astro/node_modules/.pnpm/js-yaml@3.14.1/node_modules/js-yaml/lib/js-yaml/loader.js:167:10)
|
||||
at readDocument (.../blog-astro/node_modules/.pnpm/js-yaml@3.14.1/node_modules/js-yaml/lib/js-yaml/loader.js:1545:5)
|
||||
at load (.../blog-astro/node_modules/.pnpm/js-yaml@3.14.1/node_modules/js-yaml/lib/js-yaml/loader.js:1614:19)
|
||||
at module.exports (.../blog-astro/node_modules/.pnpm/gray-matter@4.0.3/node_modules/gray-matter/lib/parse.js:12:17)
|
||||
at matter (.../blog-astro/node_modules/.pnpm/gray-matter@4.0.3/node_modules/gray-matter/index.js:50:10)
|
||||
ELIFECYCLE Command failed with exit code 1.
|
||||
```
|
||||
|
||||
@@ -48,3 +51,5 @@ date: 2024-11-23
|
||||
|
||||
<... rest of the file...>
|
||||
```
|
||||
|
||||
It seems that the `@` character signals an import from another file, and obviously there wasn't any so-named file.
|
||||
@@ -0,0 +1,64 @@
|
||||
---
|
||||
title: "Getting FullDev UI to Work with MDX in Astro"
|
||||
tags: ["astro", "fulldev-ui"]
|
||||
category: "Astro"
|
||||
description: "I'm using MDX in my Astro blog, and I want to use FullDev UI's components in it."
|
||||
date: 2024-12-01
|
||||
---
|
||||
|
||||
I wanted to keep the moving parts of this blog to a minimum, so I wanted to use plain Markdown for the content. But, I also wanted to use the [FullDev UI](https://fulldev.dev) styling for headings, text, links, etc. because the rest of the site is using [FullDev UI](https://fulldev.dev).
|
||||
|
||||
So, I had to add the MDX integration to the blog. This allowed me to override which components to used for each Markdown element. So far, I've only overridden the `p` and `a` components:
|
||||
|
||||
```jsx
|
||||
<Layout title={journalEntry.data.title}>
|
||||
<main>
|
||||
<Heading>{journalEntry.data.title}</Heading>
|
||||
<Content
|
||||
components={{
|
||||
p: RegularText,
|
||||
a: Link,
|
||||
}}
|
||||
/>
|
||||
</main>
|
||||
</Layout>
|
||||
```
|
||||
|
||||
The `RegularText` component is a simple wrapper around `Text` from FullDev UI:
|
||||
|
||||
```jsx
|
||||
import Text from "fulldev-ui/components/Text.astro";
|
||||
|
||||
<Text contrast={true}>
|
||||
<slot />
|
||||
</Text>;
|
||||
```
|
||||
|
||||
I had to create this wrapper as a separate component because the Astro syntax doesn't allow defining inline components like this:
|
||||
|
||||
```jsx
|
||||
<Layout title={journalEntry.data.title}>
|
||||
<main>
|
||||
<Heading>{journalEntry.data.title}</Heading>
|
||||
<Content
|
||||
components={{
|
||||
p: () => (
|
||||
<Text contrast={true}>
|
||||
<slot />
|
||||
</Text>
|
||||
),
|
||||
a: Link,
|
||||
}}
|
||||
/>
|
||||
</main>
|
||||
</Layout>
|
||||
```
|
||||
|
||||
In that case it gives a build error:
|
||||
|
||||
```
|
||||
15:06:29 [ERROR] Expected ">" but found "contrast"
|
||||
Stack trace:
|
||||
at failureErrorWithLog (.../blog-astro/node_modules/.pnpm/esbuild@0.21.5/node_modules/esbuild/lib/main.js:1472:15)
|
||||
[...] See full stack trace in the browser, or rerun with --verbose.
|
||||
```
|
||||
@@ -0,0 +1,25 @@
|
||||
---
|
||||
title: "Kubernetes Crash: Node Pressure"
|
||||
tags: ["kubernetes"]
|
||||
category: "Kubernetes"
|
||||
description: 'All pods were evicted, due to "disk pressure".'
|
||||
date: 2024-12-07
|
||||
---
|
||||
|
||||
I run my own private git server, using Gitea; and it's deployed on my one-node Kubernetes cluster. I tried pushing a commit for this very blog, and I got a `521` error response from the server.
|
||||
|
||||
```
|
||||
The node was low on resource: ephemeral-storage. Threshold quantity: 3681937462,
|
||||
available: 10701128Ki. Container frontend was using 32Ki, request is 0, has larger
|
||||
consumption of ephemeral-storage.
|
||||
```
|
||||
|
||||
Or:
|
||||
|
||||
```
|
||||
Pod was rejected: The node had condition: [DiskPressure].
|
||||
```
|
||||
|
||||
My disk was nowhere near full (86%), so I thought maybe clickhouse was taking up too many inodes. That wasn't the case.
|
||||
|
||||
I found [this on StackOverflow](https://stackoverflow.com/a/76529494), and it turned out that 85% is the threshold for `imagefs`, which is what Kubernetes uses to hold image layers. It's not that I had too many images on the disk (I had less than 3GB-worth), rather since my disk usage was at 86%, only 14% was available for more image layers, which Kubernetes says is no good. I just deleted some journal log files, which only added up to 4Gb, so this may happen again. The problem is that the disk is rather small, and Clickhouse is allocated like 50Gb due to my [stock options project](https://calendar-optimizer-frontend.sakal.us/).
|
||||
+16
-50
@@ -1,5 +1,9 @@
|
||||
---
|
||||
import Header from 'fulldev-ui/components/Header.astro'
|
||||
import LeftRightSplit from '../structure/LeftRightSplit.astro';
|
||||
import Heading from '../typography/Heading.astro';
|
||||
import Row from '../structure/Row.astro';
|
||||
import NavLink from '../widgets/NavLink.astro';
|
||||
|
||||
interface Props {
|
||||
title: string;
|
||||
}
|
||||
@@ -11,66 +15,28 @@ const { title } = Astro.props;
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="description" content="Astro description" />
|
||||
<meta name="description" content="A practical coding blog in the form of journal entries and articles." />
|
||||
<meta name="viewport" content="width=device-width" />
|
||||
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
||||
<link rel="preload" href="/hero.png" />
|
||||
<meta name="generator" content={Astro.generator} />
|
||||
<title>{title}</title>
|
||||
</head>
|
||||
<body>
|
||||
<Header
|
||||
heading="The Clog"
|
||||
links={[
|
||||
{
|
||||
text: 'Journal',
|
||||
href: '/journal',
|
||||
},
|
||||
{
|
||||
text: 'Articles',
|
||||
href: '/articles',
|
||||
},
|
||||
]}
|
||||
buttons={[
|
||||
{
|
||||
title: 'Gitea',
|
||||
icon: 'brand-git',
|
||||
href: 'https://git.sakal.us/avraham/',
|
||||
target: '_blank',
|
||||
contrast: true,
|
||||
},
|
||||
]}
|
||||
frame="fill"
|
||||
position="relative"
|
||||
color="brand"
|
||||
/>
|
||||
<body class="text-brand-1 p-0 m-0">
|
||||
<LeftRightSplit class="px-8 bg-brand-12 border-b-groove border-width-1 border-brand-10 mb-4">
|
||||
<Heading slot="left"><a href="/" class="text-brand-3 decoration-none">The Clog</a></Heading>
|
||||
<Row slot="right" >
|
||||
<NavLink href="/journal">Journal</NavLink>
|
||||
<NavLink href="/articles">Articles</NavLink>
|
||||
<NavLink class="i-mdi-git" href="https://git.sakal.us/avraham/">Gitea</NavLink>
|
||||
</Row>
|
||||
</LeftRightSplit>
|
||||
<slot />
|
||||
</body>
|
||||
</html>
|
||||
<style is:global>
|
||||
:root {
|
||||
--accent: 136, 58, 234;
|
||||
--accent-light: 224, 204, 250;
|
||||
--accent-dark: 49, 10, 101;
|
||||
--accent-gradient: linear-gradient(
|
||||
45deg,
|
||||
rgb(var(--accent)),
|
||||
rgb(var(--accent-light)) 30%,
|
||||
white 60%
|
||||
);
|
||||
}
|
||||
html {
|
||||
font-family: system-ui, sans-serif;
|
||||
background: #13151a;
|
||||
}
|
||||
code {
|
||||
font-family:
|
||||
Menlo,
|
||||
Monaco,
|
||||
Lucida Console,
|
||||
Liberation Mono,
|
||||
DejaVu Sans Mono,
|
||||
Bitstream Vera Sans Mono,
|
||||
Courier New,
|
||||
monospace;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,9 +1,30 @@
|
||||
---
|
||||
import Layout from '../../layouts/Layout.astro';
|
||||
import Section from 'fulldev-ui/components/Section.astro';
|
||||
import { getCollection } from 'astro:content';
|
||||
|
||||
const articles = await getCollection('articles');
|
||||
export const prerender = true;
|
||||
---
|
||||
<Layout title="Articles">
|
||||
<main>
|
||||
<Section
|
||||
title="Articles"
|
||||
text="Coming Soon!"
|
||||
cards={articles.map((article)=>({
|
||||
frame:"panel",
|
||||
title:article.data.title,
|
||||
tagline: article.data.date.toISOString().substring(0,10),
|
||||
// list: ["one", "two"],
|
||||
badge: article.data.category,
|
||||
href: `/articles/${article.slug}`,
|
||||
description: article.data.description,
|
||||
}))}
|
||||
|
||||
align='center'
|
||||
justify="start"
|
||||
structure="grid"
|
||||
>
|
||||
</Section>
|
||||
</main>
|
||||
</Layout>
|
||||
+18
-3
@@ -1,11 +1,26 @@
|
||||
---
|
||||
import Layout from '../layouts/Layout.astro';
|
||||
import Hero from 'fulldev-ui/blocks/Hero.astro';
|
||||
import LeftRightSplit from '../structure/LeftRightSplit.astro';
|
||||
import NavLink from '../widgets/NavLink.astro';
|
||||
---
|
||||
|
||||
<Layout title="The Clog">
|
||||
<main>
|
||||
<Hero
|
||||
<LeftRightSplit class="px-4 align-center">
|
||||
<div slot="left" class="text-center w-full my-auto">
|
||||
<p>The Coding Blog</p>
|
||||
<h1 class="text-4xl font-bold text-brand-3">Welcome to The Clog</h1>
|
||||
<p>A practical coding blog in the form of journal entries and articles.</p>
|
||||
<div>
|
||||
<NavLink href="/journal">Journal</NavLink>
|
||||
<NavLink href="/articles">Articles</NavLink>
|
||||
</div>
|
||||
</div>
|
||||
<div slot="right" class="h-auto max-h-dvh max-w-full w-full my-auto">
|
||||
<img src="/hero.png" class="object-contain" />
|
||||
</div>
|
||||
</LeftRightSplit>
|
||||
<!-- <Hero
|
||||
badge="The Coding Blog"
|
||||
heading="Welcome to The Clog"
|
||||
text="A practical coding blog in the form of journal entries and articles."
|
||||
@@ -16,6 +31,6 @@ import Hero from 'fulldev-ui/blocks/Hero.astro';
|
||||
structure="split"
|
||||
image="/hero.png"
|
||||
class:list={["p-space-6"]}
|
||||
/>
|
||||
/> -->
|
||||
</main>
|
||||
</Layout>
|
||||
|
||||
@@ -0,0 +1,36 @@
|
||||
---
|
||||
import { getCollection } from 'astro:content';
|
||||
import Layout from '../../layouts/Layout.astro';
|
||||
import Heading from '../../typography/Heading.astro';
|
||||
import Link from 'fulldev-ui/components/Link.astro';
|
||||
import DownTheCenter from '../../structure/DownTheCenter.astro';
|
||||
import ReadableWidth from '../../sizing/ReadableWidth.astro';
|
||||
|
||||
export const prerender = true;
|
||||
|
||||
// 1. Generate a new path for every collection entry
|
||||
export async function getStaticPaths() {
|
||||
const journalEntries = await getCollection('journal-entries');
|
||||
return journalEntries.map(journalEntry => ({
|
||||
params: { slug: journalEntry.slug }, props: { journalEntry },
|
||||
}));
|
||||
}
|
||||
|
||||
// 2. For your template, you can get the entry directly from the prop
|
||||
const { journalEntry } = Astro.props;
|
||||
const { Content } = await journalEntry.render();
|
||||
|
||||
---
|
||||
<Layout title={journalEntry.data.title}>
|
||||
<main>
|
||||
<DownTheCenter>
|
||||
<ReadableWidth>
|
||||
<Heading>{journalEntry.data.title}</Heading>
|
||||
<Content components={{
|
||||
// p: RegularText,
|
||||
a: Link,
|
||||
}} />
|
||||
</ReadableWidth>
|
||||
</DownTheCenter>
|
||||
</main>
|
||||
</Layout>
|
||||
@@ -1,9 +1,42 @@
|
||||
---
|
||||
import { getCollection } from 'astro:content';
|
||||
import Layout from '../../layouts/Layout.astro';
|
||||
|
||||
|
||||
const journalEntries = await getCollection('journal-entries');
|
||||
|
||||
export const prerender = true;
|
||||
---
|
||||
<Layout title="Journal Entries">
|
||||
<main>
|
||||
|
||||
<div class="flex gap-4 flex-wrap">
|
||||
{journalEntries.map((journalEntry)=>(
|
||||
<div class="w-64 border-solid border-brand-3 border-width-1 rounded-2 px-2 py-1 bg-brand-12 opacity-80">
|
||||
<p>{journalEntry.data.date.toISOString().substring(0,10)} <span class="border-solid border-brand-3 border-width-1 rounded-100 px-2 py-1">{journalEntry.data.category}</span></p>
|
||||
<h3><a class="text-brand-3 decoration-none" href={`/journal/${journalEntry.slug}`}>{journalEntry.data.title}</a></h3>
|
||||
<p>{journalEntry.data.description}</p>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
<!-- <Section
|
||||
title="Journal Entries"
|
||||
cards={journalEntries.map((journalEntry)=>({
|
||||
frame:"panel",
|
||||
title:journalEntry.data.title,
|
||||
tagline: journalEntry.data.date.toISOString().substring(0,10),
|
||||
badge: journalEntry.data.category,
|
||||
// badges: journalEntry.data.tags,
|
||||
href: `/journal/${journalEntry.slug}`,
|
||||
description: journalEntry.data.description,
|
||||
// html: <Text>{journalEntry.data.description}</Text>,
|
||||
size: "sm",
|
||||
}))}
|
||||
|
||||
align='center'
|
||||
justify="start"
|
||||
structure="grid"
|
||||
size="md"
|
||||
>
|
||||
</Section> -->
|
||||
</main>
|
||||
</Layout>
|
||||
@@ -0,0 +1,5 @@
|
||||
---
|
||||
---
|
||||
<div class="max-w-3xl">
|
||||
<slot />
|
||||
</div>
|
||||
@@ -0,0 +1,5 @@
|
||||
---
|
||||
---
|
||||
<div class="flex flex-col items-center justify-center">
|
||||
<slot />
|
||||
</div>
|
||||
@@ -0,0 +1,7 @@
|
||||
---
|
||||
|
||||
---
|
||||
<div class={`flex flex-row justify-between ${Astro.props.class||''}`}>
|
||||
<slot name="left" />
|
||||
<slot name="right" />
|
||||
</div>
|
||||
@@ -0,0 +1,5 @@
|
||||
---
|
||||
---
|
||||
<div class="flex flex-row gap-3 items-center justify-start">
|
||||
<slot />
|
||||
</div>
|
||||
@@ -0,0 +1,5 @@
|
||||
---
|
||||
---
|
||||
<h1 class="text-4xl font-bold text-brand-1">
|
||||
<slot />
|
||||
</h1>
|
||||
@@ -0,0 +1,5 @@
|
||||
---
|
||||
---
|
||||
<a class="text-brand underline-dotted" href={Astro.props.href}>
|
||||
<slot />
|
||||
</a>
|
||||
@@ -0,0 +1,5 @@
|
||||
---
|
||||
---
|
||||
<a class="text-brand-3 px-4 py-2 decoration-none border-brand-3 border-solid border-rounded border-width-1 border-transparent hover:border-brand-3" href={Astro.props.href}>
|
||||
<slot />
|
||||
</a>
|
||||
+4
-1
@@ -1,3 +1,6 @@
|
||||
{
|
||||
"extends": "astro/tsconfigs/strict"
|
||||
"extends": "astro/tsconfigs/strict",
|
||||
"compilerOptions": {
|
||||
"strictNullChecks": true
|
||||
}
|
||||
}
|
||||
|
||||
+29
-5
@@ -1,8 +1,32 @@
|
||||
import { defineConfig } from "unocss";
|
||||
import fulldevUI from "fulldev-ui/unocss";
|
||||
import { defineConfig, presetIcons } from "unocss";
|
||||
import presetUno from "@unocss/preset-uno";
|
||||
import { indigo } from "@radix-ui/colors";
|
||||
// import fulldevUI from "fulldev-ui/unocss";
|
||||
|
||||
export default defineConfig({
|
||||
injectReset: false,
|
||||
//@ts-ignore
|
||||
presets: [fulldevUI],
|
||||
// injectReset: true,
|
||||
theme: {
|
||||
colors: {
|
||||
brand: {
|
||||
"1": indigo.indigo1,
|
||||
"2": indigo.indigo2,
|
||||
"3": indigo.indigo3,
|
||||
"4": indigo.indigo4,
|
||||
"5": indigo.indigo5,
|
||||
"6": indigo.indigo6,
|
||||
"7": indigo.indigo7,
|
||||
"8": indigo.indigo8,
|
||||
"9": indigo.indigo9,
|
||||
"10": indigo.indigo10,
|
||||
"11": indigo.indigo11,
|
||||
"12": indigo.indigo12,
|
||||
},
|
||||
},
|
||||
},
|
||||
presets: [
|
||||
presetUno,
|
||||
//@ts-ignore
|
||||
// fulldevUI,
|
||||
presetIcons(),
|
||||
],
|
||||
});
|
||||
|
||||
@@ -0,0 +1,8 @@
|
||||
# Generated by Wrangler on Fri Dec 06 2024 12:22:28 GMT-0500 (Eastern Standard Time)
|
||||
name = "blog"
|
||||
compatibility_date = "2024-12-06"
|
||||
|
||||
pages_build_output_dir = "dist"
|
||||
|
||||
[env]
|
||||
production = { }
|
||||
Reference in New Issue
Block a user