From 506d97a7d16fa186beee3eda314492d9297e90c5 Mon Sep 17 00:00:00 2001 From: Kyren223 Date: Tue, 12 Nov 2024 18:44:51 +0200 Subject: [PATCH] Added blog and changed some other stuff --- astro.config.mjs | 14 +- package.json | 2 + pnpm-lock.yaml | 13 ++ src/components/Card.astro | 61 ------ src/components/Markdown.astro | 14 +- src/components/MarkdownB.astro | 11 - src/components/Nav.astro | 5 +- src/components/Prose.astro | 8 - src/content/aadkadocs/blogs/index.md | 42 ---- src/content/aadkadocs/blogs/test.md | 23 --- src/content/aadkadocs/blogs/test2.md | 66 ------ src/content/blogs/blog-1.md | 19 -- src/content/blogs/blog-2.md | 19 -- src/content/config.ts | 6 +- src/layouts/Blog.astro | 28 +++ src/layouts/Layout.astro | 93 +-------- src/pages/blogs/[...slug].astro | 31 +-- src/pages/index.astro | 27 +-- src/pages/main.astro | 123 ----------- src/styles/custom.css | 10 - src/styles/{ => fonts}/JetBrainsMono.css | 0 src/styles/markdown.css | 218 -------------------- src/styles/{ => markdown}/asides.css | 0 src/styles/markdown/markdown.css | 251 +++++++++++++++++++++++ src/styles/{ => markdown}/props.css | 0 src/styles/{ => markdown}/reset.css | 0 src/styles/{ => markdown}/shiki.css | 0 src/styles/{ => markdown}/util.css | 0 src/styles/terminal.css | 88 ++++++++ tsconfig.json | 5 +- 30 files changed, 419 insertions(+), 758 deletions(-) delete mode 100644 src/components/Card.astro delete mode 100644 src/components/MarkdownB.astro delete mode 100644 src/components/Prose.astro delete mode 100644 src/content/aadkadocs/blogs/index.md delete mode 100644 src/content/aadkadocs/blogs/test.md delete mode 100644 src/content/aadkadocs/blogs/test2.md delete mode 100644 src/content/blogs/blog-2.md create mode 100644 src/layouts/Blog.astro delete mode 100644 src/pages/main.astro delete mode 100644 src/styles/custom.css rename src/styles/{ => fonts}/JetBrainsMono.css (100%) delete mode 100644 src/styles/markdown.css rename src/styles/{ => markdown}/asides.css (100%) create mode 100644 src/styles/markdown/markdown.css rename src/styles/{ => markdown}/props.css (100%) rename src/styles/{ => markdown}/reset.css (100%) rename src/styles/{ => markdown}/shiki.css (100%) rename src/styles/{ => markdown}/util.css (100%) create mode 100644 src/styles/terminal.css diff --git a/astro.config.mjs b/astro.config.mjs index 3ca0b57..03cc6e0 100644 --- a/astro.config.mjs +++ b/astro.config.mjs @@ -2,19 +2,21 @@ import { defineConfig } from "astro/config"; import mdx from "@astrojs/mdx"; -import starlight from "@astrojs/starlight"; - import tailwind from "@astrojs/tailwind"; +import expressiveCode from "astro-expressive-code"; +import { pluginLineNumbers } from "@expressive-code/plugin-line-numbers"; + // https://astro.build/config export default defineConfig({ integrations: [ tailwind(), - starlight({ - title: "My delightful docs site", - customCss: ["./src/styles/custom.css"], + expressiveCode({ + plugins: [pluginLineNumbers()], + defaultProps: { + showLineNumbers: false, + }, }), mdx(), ], }); - diff --git a/package.json b/package.json index bc69cc1..8f3586d 100644 --- a/package.json +++ b/package.json @@ -13,7 +13,9 @@ "@astrojs/mdx": "^3.1.9", "@astrojs/starlight": "^0.29.0", "@astrojs/tailwind": "^5.1.2", + "@expressive-code/plugin-line-numbers": "^0.38.3", "astro": "^4.16.10", + "astro-expressive-code": "^0.38.3", "tailwindcss": "^3.4.14" }, "devDependencies": { diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 5807cfd..9923043 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -17,9 +17,15 @@ importers: '@astrojs/tailwind': specifier: ^5.1.2 version: 5.1.2(astro@4.16.10(rollup@4.24.4)(typescript@5.6.3))(tailwindcss@3.4.14) + '@expressive-code/plugin-line-numbers': + specifier: ^0.38.3 + version: 0.38.3 astro: specifier: ^4.16.10 version: 4.16.10(rollup@4.24.4)(typescript@5.6.3) + astro-expressive-code: + specifier: ^0.38.3 + version: 0.38.3(astro@4.16.10(rollup@4.24.4)(typescript@5.6.3)) tailwindcss: specifier: ^3.4.14 version: 3.4.14 @@ -322,6 +328,9 @@ packages: '@expressive-code/plugin-frames@0.38.3': resolution: {integrity: sha512-qL2oC6FplmHNQfZ8ZkTR64/wKo9x0c8uP2WDftR/ydwN/yhe1ed7ZWYb8r3dezxsls+tDokCnN4zYR594jbpvg==} + '@expressive-code/plugin-line-numbers@0.38.3': + resolution: {integrity: sha512-QbK9NL44ST9w5ANVEu0a7fkjlq+fXgxyPqiSyFC4Nw/sAXd0MUwT1C8V0qlve4pZYLz53CR9tn4JQQbR0Z1tOg==} + '@expressive-code/plugin-shiki@0.38.3': resolution: {integrity: sha512-kqHnglZeesqG3UKrb6e9Fq5W36AZ05Y9tCREmSN2lw8LVTqENIeCIkLDdWtQ5VoHlKqwUEQFTVlRehdwoY7Gmw==} @@ -2517,6 +2526,10 @@ snapshots: dependencies: '@expressive-code/core': 0.38.3 + '@expressive-code/plugin-line-numbers@0.38.3': + dependencies: + '@expressive-code/core': 0.38.3 + '@expressive-code/plugin-shiki@0.38.3': dependencies: '@expressive-code/core': 0.38.3 diff --git a/src/components/Card.astro b/src/components/Card.astro deleted file mode 100644 index bd6d597..0000000 --- a/src/components/Card.astro +++ /dev/null @@ -1,61 +0,0 @@ ---- -interface Props { - title: string; - body: string; - href: string; -} - -const { href, title, body } = Astro.props; ---- - - - diff --git a/src/components/Markdown.astro b/src/components/Markdown.astro index ef3ed1d..c9b7108 100644 --- a/src/components/Markdown.astro +++ b/src/components/Markdown.astro @@ -1,12 +1,12 @@ --- -import "../../styles/asides.css"; -import "../../styles/markdown.css"; -import "../../styles/props.css"; -import "../../styles/reset.css"; -import "../../styles/shiki.css"; -import "../../styles/util.css"; +import "../styles/markdown/asides.css"; +import "../styles/markdown/markdown.css"; +import "../styles/markdown/props.css"; +import "../styles/markdown/reset.css"; +import "../styles/markdown/shiki.css"; +import "../styles/markdown/util.css"; ---
- +
diff --git a/src/components/MarkdownB.astro b/src/components/MarkdownB.astro deleted file mode 100644 index adc46c1..0000000 --- a/src/components/MarkdownB.astro +++ /dev/null @@ -1,11 +0,0 @@ ---- -import Markdown from './Markdown.astro'; -import "../../styles/asides.css"; -import "../../styles/markdown.css"; -import "../../styles/props.css"; -import "../../styles/reset.css"; -import "../../styles/shiki.css"; -import "../../styles/util.css"; ---- - - diff --git a/src/components/Nav.astro b/src/components/Nav.astro index 1d7d979..5ab1b8c 100644 --- a/src/components/Nav.astro +++ b/src/components/Nav.astro @@ -28,11 +28,10 @@ const directories = ["skills", "projects", "blogs"]; display: flex; flex-wrap: wrap; justify-content: space-between; - border: 0; - border-bottom: 1px; + border: 1.5px var(--alt); border-style: solid; margin-bottom: 0.75rem; - padding-bottom: 0.75rem; + padding: 0.75rem; } #nav-links a { margin-right: 0.15rem; diff --git a/src/components/Prose.astro b/src/components/Prose.astro deleted file mode 100644 index d1aa1c4..0000000 --- a/src/components/Prose.astro +++ /dev/null @@ -1,8 +0,0 @@ ---- ---- -
- -
diff --git a/src/content/aadkadocs/blogs/index.md b/src/content/aadkadocs/blogs/index.md deleted file mode 100644 index dfab5a3..0000000 --- a/src/content/aadkadocs/blogs/index.md +++ /dev/null @@ -1,42 +0,0 @@ ---- -title: The search for the perfect ed25519 key pair -template: splash ---- - -Todo write intro to catch attention - -### Why care about ed25519 key pairs? - -Ed25519 is a cryptographic algorithm for generating -a pair of keys, a public one that can be shared with anyone -and a private one that is kept as a secret. - -### The ssh public key format - -If you have ever accessed a remote server it was most likely by -ssh-ing into it. -You have also most likely had to copy paste something similar to this: - -``` -ssh-ed25519 AAAAC3NzaC1lZDI1NTE5AAAAIBSSj+yfJLWEb+Df4r4603TOFAUBREYS43qQB+c9i9UW -``` - -Let's break it down - -- The first part `ssh-ed25519` is the algorithm type, other common algorithms are `ssh-rsa` and `ssh-ecdsa` -- The second part is a base64-encoded binary format consiting of - - the length of the algorithm string, for ed25519 it's always 11 (4 bytes long) - - the algorithm type, for ed25519 it's always `ssh-ed25519` in binary (11 bytes long) - - the length of the key, 32 bytes for ed25519 (4 bytes long) - - the actual ed25519 key (32 bytes long) - -### Embedding a word in base64 - -Base64 is a widely used format for writing binary in a compact and human readable way, -it uses A-Z, a-z, 0-9, '/' and '+' adding up to 64 unique characters. - -It's possible to choose specific bytes in a way that when encoding it with base64 -it will form a word. - -For example, to encode "Kyren" in base64, we can use the following bytes -`00101011 00101010 01001110` or in hex `2b 2a de` diff --git a/src/content/aadkadocs/blogs/test.md b/src/content/aadkadocs/blogs/test.md deleted file mode 100644 index f8e3832..0000000 --- a/src/content/aadkadocs/blogs/test.md +++ /dev/null @@ -1,23 +0,0 @@ ---- -title: My dakdkadkadk a -description: EEEEEE akd ak dka kdak ak dka kdka dk ak -template: splash ---- - -# My oadkadkakd - -## Secondary - -Testing some content with multiline thing - -```go example.go -package main - -import "fmt" - -func main() { - fmt.Println("Hello, World!") -} -``` - -Hmm diff --git a/src/content/aadkadocs/blogs/test2.md b/src/content/aadkadocs/blogs/test2.md deleted file mode 100644 index 02b9fbd..0000000 --- a/src/content/aadkadocs/blogs/test2.md +++ /dev/null @@ -1,66 +0,0 @@ ---- -title: My docs -description: Learn more about my project in this docs site built with Starlight. -template: splash ---- - -# My Title - -## Secondary - -### Test - -#### 4 - -##### 5 - -###### 6 - -####### 7 Should be normal - -Testing some content with multiline thing -let's see what happens if this wraps -This should be super close - -This should be far - -- Some bullets -- Adka kda kd ak -- d kakd akd ka k - -- [ ] Check me -- [x] Already checked - -## Smaller header - -How about code blocks - -```go example.go -package main - -import "fmt" - -func main() { - fmt.Println("Hello, World!") -} -``` - -Hmm - -> ![INFO] -> Does this work - -This is `highlighting` I think is what it's called - -:::caution -If you are not sure you want an awesome docs site, think twice before using [Starlight](/). -::: - -:::danger -Your users may be more productive and find your product easier to use thanks to helpful Starlight features. - -- Clear navigation -- User-configurable colour theme -- [i18n support](/guides/i18n/) - -::: diff --git a/src/content/blogs/blog-1.md b/src/content/blogs/blog-1.md index 75128e5..4630f17 100644 --- a/src/content/blogs/blog-1.md +++ b/src/content/blogs/blog-1.md @@ -1,7 +1,3 @@ ---- -title: The search for the perfect ed25519 key pair -template: splash ---- # My Title ## Secondary @@ -35,21 +31,6 @@ func main() { Hmm -> ![INFO] > Does this work This is `highlighting` I think is what it's called - -:::caution -If you are not sure you want an awesome docs site, think twice before using [Starlight](/). -::: - -:::danger -Your users may be more productive and find your product easier to use thanks to helpful Starlight features. - -- Clear navigation -- User-configurable colour theme -- [i18n support](/guides/i18n/) - -::: - diff --git a/src/content/blogs/blog-2.md b/src/content/blogs/blog-2.md deleted file mode 100644 index c6b02c0..0000000 --- a/src/content/blogs/blog-2.md +++ /dev/null @@ -1,19 +0,0 @@ ---- -title: The search for the perfect ed25519 key pair -template: splash ---- -# Other blog - -How about code blocks - -```go example.go -package main - -import "fmt" - -func main() { - fmt.Println("Hello, World!") -} -``` - -adkadkakdakd diff --git a/src/content/config.ts b/src/content/config.ts index 9d8d958..33140f3 100644 --- a/src/content/config.ts +++ b/src/content/config.ts @@ -1,5 +1,7 @@ -import { defineCollection } from "astro:content"; +import { defineCollection, z } from "astro:content"; export const collections = { - blogs: defineCollection({}), + blogs: defineCollection({ + type: "content", + }), }; diff --git a/src/layouts/Blog.astro b/src/layouts/Blog.astro new file mode 100644 index 0000000..0300b59 --- /dev/null +++ b/src/layouts/Blog.astro @@ -0,0 +1,28 @@ +--- +import Markdown from "../components/Markdown.astro"; + +interface Props { + title: string; +} + +const { title } = Astro.props; +--- + + + + + + + + + + {title} + + +
+ + + +
+ + diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro index 17d0a70..d8e68d1 100644 --- a/src/layouts/Layout.astro +++ b/src/layouts/Layout.astro @@ -1,4 +1,6 @@ --- +import "../styles/terminal.css"; + interface Props { title: string; } @@ -20,94 +22,3 @@ const { title } = Astro.props; - - diff --git a/src/pages/blogs/[...slug].astro b/src/pages/blogs/[...slug].astro index 417d1a6..37e6f53 100644 --- a/src/pages/blogs/[...slug].astro +++ b/src/pages/blogs/[...slug].astro @@ -1,32 +1,19 @@ --- -import Markdown from "../../components/MarkdownB.astro"; +import Blog from "../../layouts/Blog.astro"; import { getCollection } from "astro:content"; export async function getStaticPaths() { - const blogEntries = await getCollection("blogs"); - return blogEntries.map((entry) => ({ - params: { slug: entry.slug }, - props: { entry }, - })); + const blogEntries = await getCollection("blogs"); + return blogEntries.map((entry) => ({ + params: { slug: entry.slug }, + props: { entry }, + })); } const { entry } = Astro.props; const { Content } = await entry.render(); --- - - - - - - - - - Test - - -
- -
- - + + + diff --git a/src/pages/index.astro b/src/pages/index.astro index 8b1d8e5..2a47693 100644 --- a/src/pages/index.astro +++ b/src/pages/index.astro @@ -26,7 +26,7 @@ And when I am not coding I am most likely playing video games, watching Anime or solving Rubik's cubes fast.`.trimStart(); --- - +