diff --git a/.gitignore b/.gitignore
index 6d4c0aa..e1f5aa2 100644
--- a/.gitignore
+++ b/.gitignore
@@ -19,3 +19,6 @@ pnpm-debug.log*
# macOS-specific files
.DS_Store
+src/pages/posts/.obsidian/
+.vscode
+src/pages/posts/.trash
diff --git a/.gitmodules b/.gitmodules
index f7663f6..cfd2e76 100644
--- a/.gitmodules
+++ b/.gitmodules
@@ -1,3 +1,6 @@
[submodule "src/styles/terminal-css"]
- path = src/styles/terminal-css
- url = git@github.com:ArgentumCation/terminal-css.git
+path = src/styles/terminal-css
+url = git@github.com:ArgentumCation/terminal-css.git
+[submodule "littlelink"]
+ path = littlelink
+ url = git@github.com:ArgentumCation/littlelink.git
diff --git a/astro.config.mjs b/astro.config.mjs
index bbd3e06..3ab7246 100644
--- a/astro.config.mjs
+++ b/astro.config.mjs
@@ -3,7 +3,7 @@ import mdx from '@astrojs/mdx';
export default defineConfig({
markdown: {
- syntaxHighlight: 'shiki',
+ syntaxHighlight: false,
shikiConfig: {
theme: 'css-variables'
}
diff --git a/littlelink b/littlelink
new file mode 160000
index 0000000..0d65b55
--- /dev/null
+++ b/littlelink
@@ -0,0 +1 @@
+Subproject commit 0d65b55b253309e4571253cafb003698083da726
diff --git a/package.json b/package.json
index 427688c..34c7fd9 100644
--- a/package.json
+++ b/package.json
@@ -13,6 +13,8 @@
"@astrojs/mdx": "^0.18.1",
"accessible-astro-components": "^1.6.5",
"astro": "^2.0.18",
+ "highlight.js": "^11.7.0",
+ "highlightjs-line-numbers.js": "^2.8.0",
"sass": "^1.59.3"
}
}
\ No newline at end of file
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index e157859..bbe5970 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -4,12 +4,16 @@ specifiers:
'@astrojs/mdx': ^0.18.1
accessible-astro-components: ^1.6.5
astro: ^2.0.18
+ highlight.js: ^11.7.0
+ highlightjs-line-numbers.js: ^2.8.0
sass: ^1.59.3
dependencies:
'@astrojs/mdx': 0.18.1_astro@2.1.2
accessible-astro-components: 1.6.5
astro: 2.1.2_sass@1.59.3
+ highlight.js: 11.7.0
+ highlightjs-line-numbers.js: 2.8.0
sass: 1.59.3
packages:
@@ -1625,6 +1629,15 @@ packages:
space-separated-tokens: 2.0.2
dev: false
+ /highlight.js/11.7.0:
+ resolution: {integrity: sha512-1rRqesRFhMO/PRF+G86evnyJkCgaZFOI+Z6kdj15TA18funfoqJXvgPCLSf0SWq3SRfg1j3HlDs8o4s3EGq1oQ==}
+ engines: {node: '>=12.0.0'}
+ dev: false
+
+ /highlightjs-line-numbers.js/2.8.0:
+ resolution: {integrity: sha512-TEf1gw0c8mb8nan0QwliqS7obT4cpUd9hzsGzsZLweteNnWea/VIqy5/aQqsa5wnz9lnvmtAkS1ZtDTjB/goYQ==}
+ dev: false
+
/html-escaper/3.0.3:
resolution: {integrity: sha512-RuMffC89BOWQoY0WKGpIhn5gX3iI54O6nRA0yC124NYVtzjmFWBIiFd8M0x+ZdX0P9R4lADg1mgP8C7PxGOWuQ==}
dev: false
diff --git a/src/components/BaseHead.astro b/src/components/BaseHead.astro
index 481a767..2db14ce 100644
--- a/src/components/BaseHead.astro
+++ b/src/components/BaseHead.astro
@@ -2,7 +2,8 @@
// Import the global.css file here so that it is included on
// all pages through the use of the component.
import "../styles/global.css";
-import "../styles/terminal-css/css/lunar-witch.css";
+import "../styles/terminal-css/lunar-witch.css";
+//import "../styles/terminal-css/base16-lunar-witch.css";
const { title, description } = Astro.props;
---
@@ -15,7 +16,27 @@ const { title, description } = Astro.props;
{title}
-
+
+
diff --git a/src/components/Footer.astro b/src/components/Footer.astro
index e183c3f..1151f41 100644
--- a/src/components/Footer.astro
+++ b/src/components/Footer.astro
@@ -3,5 +3,9 @@ const today = new Date();
---
diff --git a/src/components/Header.astro b/src/components/Header.astro
index d50d90d..d8c11e0 100644
--- a/src/components/Header.astro
+++ b/src/components/Header.astro
@@ -1,7 +1,15 @@
-
+
diff --git a/src/layouts/BlogLayout.astro b/src/layouts/BlogLayout.astro
index 5282bc0..0f9b260 100644
--- a/src/layouts/BlogLayout.astro
+++ b/src/layouts/BlogLayout.astro
@@ -1,5 +1,6 @@
---
import Header from "../components/Header.astro";
+import Footer from "../components/Footer.astro";
import BaseHead from "../components/BaseHead.astro";
const { title } = Astro.props;
---
@@ -10,11 +11,12 @@ const { title } = Astro.props;
title={title}
description="I don't know what I'm doing here either"
/>
-
+
{title}
+
diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro
index ddd9959..7606218 100644
--- a/src/layouts/Layout.astro
+++ b/src/layouts/Layout.astro
@@ -12,7 +12,7 @@ const {
-
+
diff --git a/src/pages/index.astro b/src/pages/index.astro
index b9d5e41..fa6ca9d 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -1,8 +1,13 @@
---
+import BaseHead from "../components/BaseHead.astro";
+import Header from "../components/Header.astro";
+import Footer from "../components/Footer.astro";
---
+
+
Astro
+
+
+
+ ArgentumCation
+ Look I know it's a kinda shit homepage, I'm working on it.
+
+
+
-
- Astro
-
diff --git a/src/pages/posts/traefik-setup.mdx b/src/pages/posts/traefik-setup.mdx
new file mode 100644
index 0000000..e3bdc4d
--- /dev/null
+++ b/src/pages/posts/traefik-setup.mdx
@@ -0,0 +1,143 @@
+---
+title: "Getting up and running with Traefik"
+author: "ArgentumCation"
+layout: ../../layouts/Layout.astro
+pubDate: "03 Apr, 2023"
+slug: "traefik-setup"
+---
+
+- Okay so you've got a server now and need a reverse proxy
+- Traefik is pretty decent at that, it'll set up your HTTPS certs and auto generate routes from your docker images
+- only problem is its an absolute bitch to set up
+- Here's a stripped down `docker-compose.yml` to give you an idea of how I have it set up
+- The end result should be a lighttpd server running on `blog.argentumcation.com`
+```yaml
+# Just setting some default values for my containers
+x-service_defaults:
+ &service_defaults
+ env_file: .env
+ restart: unless-stopped
+ extra_hosts:
+ - host.docker.internal:host-gateway
+services:
+ traefik:
+ <<: *service_defaults
+ container_name: traefik
+ env_file:
+ - .env
+ # Cloudflare API token to add new paths
+ - $ENV_DIR/traefik.secrets.env
+ hostname: traefik
+ image: traefik:latest
+ labels:
+ - traefik.http.services.traefik-docker.loadbalancer.server.port=8080
+ # For the management interface
+ - '8080:8080'
+ # To let traefik receive incoming HTTP traffic
+ - '80:80'
+ # To let traefik receive incoming HTTPS traffic
+ - '443:443'
+ volumes:
+ # This lets traefik see your docker services
+ - $DOCKER_SOCK:/var/run/docker.sock:ro
+ # Traefik Configs
+ - $CONF_DIR/traefik/traefik.yml:/traefik.yml
+ - $CONF_DIR/traefik/traefik_dynamic.yml:/etc/traefik/traefik_dynamic.yml
+ # Let's Encrypt folder (for storing HTTPS cert related stuff)
+ - $CONF_DIR/letsencrypt:/letsencrypt
+ # Example container we're proxying with traefik
+ lighttpd:
+ <<: *service_defaults
+ container_name: public_lighttpd
+ image: sebp/lighttpd
+ labels:
+ # This is the hostname that traefik will proxy to this container
+ - traefik.http.routers.lighttpd-docker.rule=Host(`blog.$PUBLIC`)
+ # This is the port the container is listening on, often traefik can detect this
+ # automatically, but we'll just be explicit here
+ - traefik.http.services.lighttpd-docker.loadbalancer.server.port=80
+```
+- `traefik.secrets.env` contains my cloudflare API key so that Traefik can automatically add DNS routes
+- For reference, here's my `.env` file
+```sh
+# GENERAL
+PUBLIC=argentumcation.com
+TZ=America/New_York
+
+#for container specific env vars
+ENV_DIR=./env
+
+CONF_DIR=./config
+
+DOCKER_DIR=/home/mira/docker
+DOCKER_SOCK=/var/run/docker.sock
+
+# So my containers run as a non-root user
+UID=1000
+GID=1000
+PUID=1000
+PGID=1000
+USER_UID=1000
+USER_GID=1000
+```
+- And of course, the actual traefik configuration files:
+ - `traefik.yml`:
+```yaml
+accessLog:
+ filePath: ./traefik-access.log
+
+api:
+ dashboard: true
+ debug: true
+ insecure: true
+certificatesResolvers:
+ letsencrypt:
+ acme:
+ dnschallenge:
+ provider: cloudflare #look, I know, don't judge me
+ email: [redacted]
+ storage: /letsencrypt/acme.json
+entryPoints:
+ web:
+ address: ":80"
+ forwardedHeaders:
+ insecure: true
+ http:
+ middlewares:
+ - https_redirect@file
+
+ websecure:
+ address: ":443"
+ forwardedHeaders:
+ insecure: true
+ http:
+ tls:
+ certresolver: letsencrypt
+ domains:
+ - main: argentumcation.com
+ sans:
+ - "*.argentumcation.com"
+log:
+ level: INFO
+providers:
+ docker:
+ # Routes will be set to [container-name].argentumcation.com by default
+ defaultRule: Host(`{{ index .Labels "com.docker.compose.service" }}.argentumcation.com`)
+ endpoint: unix:///var/run/docker.sock
+ exposedByDefault: true # exposes auto-discovered containers by default, not secure but I'm lazy
+ network: docker_default
+ watch: true
+ file:
+ directory: /etc/traefik/
+ watch: true
+
+```
+ - `traefik-dynamic.yml`
+```yaml
+http:
+ middlewares: #This should redirect incoming http connections to https
+ https_redirect:
+ redirectscheme:
+ scheme: https
+ permanent: true
+```
\ No newline at end of file
diff --git a/src/styles/global.css b/src/styles/global.css
index e628362..762bd7d 100644
--- a/src/styles/global.css
+++ b/src/styles/global.css
@@ -1,65 +1,229 @@
+@import "https://unpkg.com/terminal.css@0.7.2/dist/terminal.min.css";
:root {
- --astro-code-color-text: var(--fg);
- --astro-code-color-background: var(--black);
- --astro-code-token-constant: var(--red);
- --astro-code-token-string: var(--bright-green);
- --astro-code-token-comment: var(--bright-black);
- --astro-code-token-keyword: var(--bright-cyan);
- --astro-code-token-parameter: var(--bright-magenta);
- --astro-code-token-function: var(--bright-blue);
- --astro-code-token-string-expression: var(--bright-green);
- --astro-code-token-punctuation: var(--fg);
- --astro-code-token-link: var(--blue);
+ /* Terminal Colors */
+ --background-color: var(--base00, var(--background));
+ --font-color: var(--base05, var(--foreground));
+ --invert-font-color: var(--base00, var(--background));
+ --primary-color: var(--base0D, var(--cyan));
+ --secondary-color: var(--base0D, var(--cyan));
+ --tertiary-color: var(--base0B, var(--green));
+ --error-color: var(--base08, var(--red));
+ --progress-bar-background: var(--base04, var(--blue));
+ --progress-bar-fill: var(--base02, var(--cyan));
+ --code-bg-color: var(--base00, var(--background));
+
+ /* Astro Config */
+ --astro-code-color-text: var(--base05, --foreground);
+ --astro-code-color-background: var(--base00, --background);
+ --astro-code-token-constant: var(--base09, var(--orange, var(--cyan)));
+ --astro-code-token-string: var(--base0B, --green);
+ --astro-code-token-comment: var(--base03, --bright-black);
+ --astro-code-token-keyword: var(--base0E, --magenta);
+ --astro-code-token-parameter: var(--base08, --red);
+ --astro-code-token-function: var(--base0D, --blue);
+ --astro-code-token-string-expression: var(--base0B, --green);
+ --astro-code-token-punctuation: var(--base05, --foreground);
+ --astro-code-token-link: var(--base09, var(--orange, var(--cyan)));
+ /*Fonts*/
+ --mono-font-stack: Liga SFMono Nerd Font, Ubuntu, Menlo, Monaco, Cascadia Code,
+ Lucida Console, Liberation Mono, DejaVu Sans Mono, Bitstream Vera Sans Mono,
+ Courier New, monospace, serif;
+ --font-stack: var(--mono-font-stack);
}
-footer {
- /* margin-top: 20vh; */
- padding: 0.5em;
-}
-
-main {
- margin: 0 auto;
- padding: 1.5em;
- max-width: 75vmax;
- min-height: 100vh;
-}
-
-code {
- counter-reset: step;
- counter-increment: step 0;
-}
-
-code .line::before {
- content: counter(step);
- counter-increment: step;
- width: 1rem;
- margin-right: 1.5rem;
- display: inline-block;
- text-align: right;
- color: var(--bright-black);
- font-weight: bolder;
-}
-
-article {
- margin: 0 auto;
-}
-
-.nav {
- background: var(--bright-black) !important;
- color: var(--fg);
+pre code.hljs {
+ display: block;
+ overflow-x: auto;
padding: 1em;
}
-.nav .current {
- background: var(--bright-black) !important;
- color: var(--fg);
- margin-bottom: 0.5em;
+code.hljs {
+ padding: 3px 5px;
}
-.nav a:hover {
- background: var(--bright-black) !important;
- color: var(--fg);
+
+.hljs {
+ color: var(--base05, var(--foreground));
+ background: var(--base00, var(--background));
+}
+
+.hljs::selection,
+.hljs ::selection {
+ background-color: var(--base02, var(--cyan));
+ color: var(--base05, var(--foreground));
+}
+
+/* purposely do not highlight these things */
+.hljs-formula,
+.hljs-params,
+.hljs-property {
+}
+
+/* base03 - var(--base03,) - Comments, Invisibles, Line Highlighting */
+.hljs-comment {
+ color: var(--base03, var(--bright-black));
+}
+
+/* base04 - var(--base04,) - Dark Foreground (Used for status bars) */
+.hljs-tag {
+ color: var(--base04, var(--blue));
+}
+
+/* base05 - var(--base05,) - Default Foreground, Caret, Delimiters, Operators */
+.hljs-subst,
+.hljs-punctuation,
+.hljs-operator {
+ color: var(--base05, var(--foreground));
+}
+
+.hljs-operator {
+ opacity: 0.7;
+}
+
+/* base08 - Variables, XML Tags, Markup Link Text, Markup Lists, Diff Deleted */
+.hljs-bullet,
+.hljs-variable,
+.hljs-template-variable,
+.hljs-selector-tag,
+.hljs-name,
+.hljs-deletion {
+ color: var(--base08, var(--red));
+}
+
+/* base09 - Integers, Boolean, Constants, XML Attributes, Markup Link Url */
+.hljs-symbol,
+.hljs-number,
+.hljs-link,
+.hljs-attr,
+.hljs-variable.constant_,
+.hljs-literal {
+ color: var(--base09, var(--orange, var(--cyan)));
+}
+
+/* base0A - Classes, Markup Bold, Search Text Background */
+.hljs-title,
+.hljs-class .hljs-title,
+.hljs-title.class_ {
+ color: var(--base0A, var(--yellow));
+}
+
+.hljs-strong {
+ font-weight: bold;
+ color: var(--base0A, var(--yellow));
+}
+
+/* base0B - Strings, Inherited Class, Markup Code, Diff Inserted */
+.hljs-code,
+.hljs-addition,
+.hljs-title.class_.inherited__,
+.hljs-string {
+ color: var(--base0B, var(--green));
+}
+
+/* base0C - Support, Regular Expressions, Escape Characters, Markup Quotes */
+.hljs-built_in,
+.hljs-doctag, /* guessing */
+.hljs-quote,
+.hljs-keyword.hljs-atrule,
+.hljs-regexp {
+ color: var(--base0C, var(--cyan));
+}
+
+/* base0D - Functions, Methods, Attribute IDs, Headings */
+.hljs-function .hljs-title,
+.hljs-attribute,
+.ruby .hljs-property,
+.hljs-title.function_,
+.hljs-section {
+ color: var(--base0D, var(--blue));
+}
+
+/* base0E - Keywords, Storage, Selector, Markup Italic, Diff Changed */
+.hljs-type,
+/* .hljs-selector-id, */
+/* .hljs-selector-class, */
+/* .hljs-selector-attr, */
+/* .hljs-selector-pseudo, */
+.hljs-template-tag,
+.diff .hljs-meta,
+.hljs-keyword {
+ color: var(--base0E, var(--magenta));
+}
+.hljs-emphasis {
+ color: var(--base0E, var(--magenta));
+ font-style: italic;
+}
+
+/* base0F - Deprecated, Opening/Closing Embedded Language Tags, e.g. */
+.hljs-meta,
+/*
+ prevent top level .keyword and .string scopes
+ from leaking into meta by accident
+*/
+.hljs-meta .hljs-keyword,
+.hljs-meta .hljs-string {
+ color: var(--base0F, var(--orange, var(--cyan)));
+}
+
+.hljs-meta .hljs-keyword,
+/* for v10 compatible themes */
+.hljs-meta-keyword {
+ font-weight: bold;
+}
+
+code {
+ background-color: var(--base03, var(--bright-black));
+}
+
+footer {
+ padding-bottom: 1em;
}
.astro-code {
background-color: unset;
padding: 0.5rem;
}
+
+main {
+ min-height: 85vh;
+}
+
+li:has(.card)::after {
+ content: unset;
+}
+
+ol {
+ list-style-type: decimal;
+}
+ol ol {
+ list-style-type: lower-alpha;
+}
+
+ol ol ol {
+ list-style-type: lower-roman;
+}
+
+ol ol ol ol {
+ list-style-type: simp-chinese-informal;
+}
+
+ol ol ol ol ol {
+ list-style-type: devanagari;
+}
+
+ol ol ol ol ol ol {
+ list-style-type: katakana;
+}
+
+ol ol ol ol ol ol ol {
+ list-style-type: lower-greek;
+}
+
+ol ol ol ol ol ol ol ol {
+ list-style-type: cjk-earthly-branch;
+}
+ol ol ol ol ol ol ol ol ol {
+ list-style-type: cjk-heavenly-stem;
+}
+
+ol ol ol ol ol ol ol ol ol ol {
+ list-style-type: hebrew;
+}
diff --git a/src/styles/terminal-css b/src/styles/terminal-css
index baa520f..1892e39 160000
--- a/src/styles/terminal-css
+++ b/src/styles/terminal-css
@@ -1 +1 @@
-Subproject commit baa520f5374bb3fa0df59696c0bcb18024cfb728
+Subproject commit 1892e39f3d5fabd8f8f4232285ded1a88ed1430d