fuck me

.github/dependabot.yml

@@ -5,10 +5,10 @@
 
 version: 2
 updates:
-  - package-ecosystem: "npm" # See documentation for possible values
-    directory: "/" # Location of package manifests
+  - package-ecosystem: 'npm' # See documentation for possible values
+    directory: '/' # Location of package manifests
     schedule:
-      interval: "monthly"
+      interval: 'monthly'
     allow:
-      - dependency-type: "direct"
+      - dependency-type: 'direct'
     open-pull-requests-limit: 20

.github/workflows/stale.yml

@@ -7,7 +7,7 @@ name: Mark stale issues and pull requests
 
 on:
   schedule:
-    - cron: "39 23 * * *"
+    - cron: '39 23 * * *'
 
 jobs:
   stale:
@@ -20,13 +20,13 @@ jobs:
       - uses: actions/stale@v7
         with:
           repo-token: ${{ secrets.GITHUB_TOKEN }}
-          stale-issue-label: "no-issue-activity"
-          stale-pr-label: "no-pr-activity"
-          stale-issue-message: "This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions."
-          stale-pr-message: "This PR has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions."
-          close-issue-message: "This issue was closed because it has been stalled for 5 days with no activity."
+          stale-issue-label: 'no-issue-activity'
+          stale-pr-label: 'no-pr-activity'
+          stale-issue-message: 'This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.'
+          stale-pr-message: 'This PR has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.'
+          close-issue-message: 'This issue was closed because it has been stalled for 5 days with no activity.'
           days-before-stale: 30
           days-before-close: 5
           days-before-pr-close: -1
-          exempt-issue-labels: "not-stale,bug,pinned,security,pending,awaiting-approval,work-in-progress"
-          exempt-pr-labels: "not-stale,bug,pinned,security,pending,awaiting-approval,work-in-progress"
+          exempt-issue-labels: 'not-stale,bug,pinned,security,pending,awaiting-approval,work-in-progress'
+          exempt-pr-labels: 'not-stale,bug,pinned,security,pending,awaiting-approval,work-in-progress'

.prettierignore

@@ -5,4 +5,5 @@ node_modules
 **/.cache
 
 pnpm-lock.yaml
-dist
+dist
+.*/*

.prettierrc.js

@@ -2,19 +2,19 @@
 module.exports = {
 	printWidth: 100,
 	semi: true,
-	singleQuote: false,
+	singleQuote: true,
 	tabWidth: 2,
 	useTabs: true,
-	plugins: ["prettier-plugin-astro", "prettier-plugin-tailwindcss" /* Must come last */],
+	plugins: ['prettier-plugin-astro', 'prettier-plugin-tailwindcss' /* Must come last */],
 	overrides: [
 		{
-			files: "**/*.astro",
+			files: '**/*.astro',
 			options: {
-				parser: "astro",
+				parser: 'astro',
 			},
 		},
 		{
-			files: ["*.mdx", "*.md"],
+			files: ['*.mdx', '*.md'],
 			options: {
 				printWidth: 80,
 			},

astro.config.ts

@@ -1,20 +1,20 @@
-import fs from "node:fs";
-import mdx from "@astrojs/mdx";
-import sitemap from "@astrojs/sitemap";
-import tailwind from "@astrojs/tailwind";
-import expressiveCode from "astro-expressive-code";
-import icon from "astro-icon";
-import { defineConfig } from "astro/config";
-import rehypeExternalLinks from "rehype-external-links";
-import remarkUnwrapImages from "remark-unwrap-images";
+import fs from 'node:fs';
+import mdx from '@astrojs/mdx';
+import sitemap from '@astrojs/sitemap';
+import tailwind from '@astrojs/tailwind';
+import expressiveCode from 'astro-expressive-code';
+import icon from 'astro-icon';
+import { defineConfig } from 'astro/config';
+import rehypeExternalLinks from 'rehype-external-links';
+import remarkUnwrapImages from 'remark-unwrap-images';
 
-import { expressiveCodeOptions } from "./src/site.config";
-import { remarkReadingTime } from "./src/utils/remark-reading-time";
+import { expressiveCodeOptions } from './src/site.config';
+import { remarkReadingTime } from './src/utils/remark-reading-time';
 
 // https://astro.build/config
 export default defineConfig({
 	image: {
-		domains: ["webmention.io"],
+		domains: ['webmention.io'],
 	},
 	integrations: [
 		expressiveCode(expressiveCodeOptions),
@@ -30,33 +30,33 @@ export default defineConfig({
 			[
 				rehypeExternalLinks,
 				{
-					rel: ["nofollow, noopener, noreferrer"],
-					target: "_blank",
+					rel: ['nofollow, noopener, noreferrer'],
+					target: '_blank',
 				},
 			],
 		],
 		remarkPlugins: [remarkUnwrapImages, remarkReadingTime],
 		remarkRehype: {
 			footnoteLabelProperties: {
-				className: [""],
+				className: [''],
 			},
 		},
 	},
 	// https://docs.astro.build/en/guides/prefetch/
 	prefetch: true,
 	// ! Please remember to replace the following site property with your own domain
-	site: "https://canaris.is-a.dev",
+	site: 'https://canaris.is-a.dev',
 	vite: {
 		optimizeDeps: {
-			exclude: ["@resvg/resvg-js"],
+			exclude: ['@resvg/resvg-js'],
 		},
-		plugins: [rawFonts([".ttf", ".woff"])],
+		plugins: [rawFonts(['.ttf', '.woff'])],
 	},
 });
 
 function rawFonts(ext: string[]) {
 	return {
-		name: "vite-plugin-raw-fonts",
+		name: 'vite-plugin-raw-fonts',
 		// eslint-disable-next-line @typescript-eslint/ban-ts-comment
 		transform(_, id) {
 			if (ext.some((e) => id.endsWith(e))) {

postcss.config.js

@@ -1,8 +1,8 @@
 module.exports = {
 	plugins: {
 		autoprefixer: {},
-		"postcss-import": {},
+		'postcss-import': {},
 		tailwindcss: {},
-		"tailwindcss/nesting": {},
+		'tailwindcss/nesting': {},
 	},
 };

src/components/BaseHead.astro

@@ -1,18 +1,18 @@
 ---
-import type { SiteMeta } from "@/types";
+import type { SiteMeta } from '@/types';
 
-import { siteConfig } from "@/site-config";
+import { siteConfig } from '@/site-config';
 
-import "../styles/global.css";
+import '../styles/global.css';
 
 type Props = SiteMeta;
 
 const { articleDate, description, ogImage, title } = Astro.props;
 
-const titleSeparator = "•";
+const titleSeparator = '•';
 const siteTitle = `${title} ${titleSeparator} ${siteConfig.title}`;
 const canonicalURL = new URL(Astro.url.pathname, Astro.site);
-const socialImageURL = new URL(ogImage ? ogImage : "/social-card.png", Astro.url).href;
+const socialImageURL = new URL(ogImage ? ogImage : '/social-card.png', Astro.url).href;
 ---
 
 <meta charset="utf-8" />
@@ -36,7 +36,7 @@ const socialImageURL = new URL(ogImage ? ogImage : "/social-card.png", Astro.url
 <meta content="" name="theme-color" />
 
 {/* Open Graph / Facebook */}
-<meta content={articleDate ? "article" : "website"} property="og:type" />
+<meta content={articleDate ? 'article' : 'website'} property="og:type" />
 <meta content={title} property="og:title" />
 <meta content={description} property="og:description" />
 <meta content={canonicalURL} property="og:url" />

src/components/FormattedDate.astro

@@ -1,9 +1,9 @@
 ---
-import type { HTMLAttributes } from "astro/types";
+import type { HTMLAttributes } from 'astro/types';
 
-import { getFormattedDate } from "@/utils";
+import { getFormattedDate } from '@/utils';
 
-type Props = HTMLAttributes<"time"> & {
+type Props = HTMLAttributes<'time'> & {
 	date: Date;
 	dateTimeOptions?: Intl.DateTimeFormatOptions;
 };

src/components/Paginator.astro

@@ -1,5 +1,5 @@
 ---
-import type { PaginationLink } from "@/types";
+import type { PaginationLink } from '@/types';
 
 interface Props {
 	nextUrl?: PaginationLink;
@@ -15,13 +15,13 @@ const { nextUrl, prevUrl } = Astro.props;
 			{prevUrl && (
 				<a class="me-auto py-2 sm:hover:text-accent" data-astro-prefetch href={prevUrl.url}>
 					{prevUrl.srLabel && <span class="sr-only">{prevUrl.srLabel}</span>}
-					{prevUrl.text ? prevUrl.text : "Previous"}
+					{prevUrl.text ? prevUrl.text : 'Previous'}
 				</a>
 			)}
 			{nextUrl && (
 				<a class="ms-auto py-2 sm:hover:text-accent" data-astro-prefetch href={nextUrl.url}>
 					{nextUrl.srLabel && <span class="sr-only">{nextUrl.srLabel}</span>}
-					{nextUrl.text ? nextUrl.text : "Next"}
+					{nextUrl.text ? nextUrl.text : 'Next'}
 				</a>
 			)}
 		</nav>

src/components/Search.astro

@@ -1,7 +1,7 @@
 ---
 // Heavy inspiration taken from Astro Starlight -> https://github.com/withastro/starlight/blob/main/packages/starlight/components/Search.astro
 
-import "@pagefind/default-ui/css/ui.css";
+import '@pagefind/default-ui/css/ui.css';
 ---
 
 <site-search class="ms-auto" id="search">
@@ -64,13 +64,13 @@ import "@pagefind/default-ui/css/ui.css";
 		closeModal = () => {
 			if (this.dialog.open) {
 				this.dialog.close();
-				window.removeEventListener("click", this.onWindowClick);
+				window.removeEventListener('click', this.onWindowClick);
 			}
 		};
 
 		onWindowClick = (event: MouseEvent) => {
 			// check if it's a link
-			const isLink = "href" in (event.target || {});
+			const isLink = 'href' in (event.target || {});
 			// make sure the click is either a link or outside of the dialog
 			if (
 				isLink ||
@@ -82,56 +82,56 @@ import "@pagefind/default-ui/css/ui.css";
 
 		onWindowKeydown = (e: KeyboardEvent) => {
 			// check if it's the / key
-			if (e.key === "/" && !this.dialog.open) {
+			if (e.key === '/' && !this.dialog.open) {
 				this.openModal();
 				e.preventDefault();
 			}
 		};
 
 		openModal = (event?: MouseEvent) => {
 			this.dialog.showModal();
-			this.querySelector("input")?.focus();
+			this.querySelector('input')?.focus();
 			event?.stopPropagation();
-			window.addEventListener("click", this.onWindowClick);
+			window.addEventListener('click', this.onWindowClick);
 		};
 
 		constructor() {
 			super();
-			this.openBtn = this.querySelector<HTMLButtonElement>("button[data-open-modal]")!;
-			this.closeBtn = this.querySelector<HTMLButtonElement>("button[data-close-modal]")!;
-			this.dialog = this.querySelector("dialog")!;
-			this.dialogFrame = this.querySelector(".dialog-frame")!;
+			this.openBtn = this.querySelector<HTMLButtonElement>('button[data-open-modal]')!;
+			this.closeBtn = this.querySelector<HTMLButtonElement>('button[data-close-modal]')!;
+			this.dialog = this.querySelector('dialog')!;
+			this.dialogFrame = this.querySelector('.dialog-frame')!;
 
-			this.openBtn.addEventListener("click", this.openModal);
+			this.openBtn.addEventListener('click', this.openModal);
 			this.openBtn.disabled = false;
-			this.closeBtn.addEventListener("click", this.closeModal);
+			this.closeBtn.addEventListener('click', this.closeModal);
 		}
 
 		connectedCallback() {
 			// Listen for keyboard shortcut
-			window.addEventListener("keydown", this.onWindowKeydown);
+			window.addEventListener('keydown', this.onWindowKeydown);
 
 			// only add pagefind in production
 			if (import.meta.env.DEV) return;
 			const onIdle = window.requestIdleCallback || ((cb) => setTimeout(cb, 1));
 			onIdle(async () => {
-				const { PagefindUI } = await import("@pagefind/default-ui");
+				const { PagefindUI } = await import('@pagefind/default-ui');
 				new PagefindUI({
 					baseUrl: import.meta.env.BASE_URL,
-					bundlePath: import.meta.env.BASE_URL.replace(/\/$/, "") + "/pagefind/",
-					element: "#cactus__search",
+					bundlePath: import.meta.env.BASE_URL.replace(/\/$/, '') + '/pagefind/',
+					element: '#cactus__search',
 					showImages: false,
 					showSubResults: true,
 				});
 			});
 		}
 
 		disconnectedCallback() {
-			window.removeEventListener("keydown", this.onWindowKeydown);
+			window.removeEventListener('keydown', this.onWindowKeydown);
 		}
 	}
 
-	customElements.define("site-search", SiteSearch);
+	customElements.define('site-search', SiteSearch);
 </script>
 
 <style is:global>
@@ -146,15 +146,15 @@ import "@pagefind/default-ui/css/ui.css";
 		overflow: hidden;
 	}
 	#cactus__search .pagefind-ui__search-clear:focus {
-		outline: 1px solid theme("colors.accent-2");
+		outline: 1px solid theme('colors.accent-2');
 	}
 	#cactus__search .pagefind-ui__search-clear::before {
-		content: "";
+		content: '';
 		-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke-width='1.5' stroke='currentColor' %3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M6 18L18 6M6 6l12 12'%3E%3C/path%3E%3C/svg%3E")
 			center / 60% no-repeat;
 		mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke-width='1.5' stroke='currentColor' %3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M6 18L18 6M6 6l12 12'%3E%3C/path%3E%3C/svg%3E")
 			center / 60% no-repeat;
-		background-color: theme("colors.accent");
+		background-color: theme('colors.accent');
 		display: block;
 		width: 100%;
 		height: 100%;
@@ -171,8 +171,8 @@ import "@pagefind/default-ui/css/ui.css";
 		background-image: linear-gradient(
 			transparent,
 			transparent 5px,
-			theme("colors.textColor") 5px,
-			theme("colors.textColor")
+			theme('colors.textColor') 5px,
+			theme('colors.textColor')
 		);
 	}
 
@@ -181,24 +181,24 @@ import "@pagefind/default-ui/css/ui.css";
 		background-image: linear-gradient(
 			transparent,
 			transparent 4px,
-			theme("colors.link") 4px,
-			theme("colors.link")
+			theme('colors.link') 4px,
+			theme('colors.link')
 		);
 	}
 
 	#cactus__search mark {
-		color: theme("colors.quote");
+		color: theme('colors.quote');
 		background-color: transparent;
 		font-weight: 600;
 	}
 </style>
 
 <style>
 	#cactus__search {
-		--pagefind-ui-primary: theme("colors.accent");
-		--pagefind-ui-text: theme("colors.textColor");
-		--pagefind-ui-background: theme("colors.bgColor");
-		--pagefind-ui-border: theme("colors.zinc.400");
+		--pagefind-ui-primary: theme('colors.accent');
+		--pagefind-ui-text: theme('colors.textColor');
+		--pagefind-ui-background: theme('colors.bgColor');
+		--pagefind-ui-border: theme('colors.zinc.400');
 		--pagefind-ui-border-width: 1px;
 	}
 </style>