update cv

Update README.md
2025-02-05 15:29:01 -05:00 · 2024-10-20 02:20:58 +00:00 · 2024-10-20 01:25:09 +00:00 · 2024-10-19 00:39:44 -04:00 · 2024-09-14 13:01:35 -04:00 · 2024-09-14 13:00:53 -04:00
21 changed files with 10825 additions and 330 deletions
--- a/.astro/settings.json
+++ b/.astro/settings.json
@ -1,5 +1,8 @@
 {
 	"devToolbar": {
 		"enabled": false
+	},
+	"_variables": {
+		"lastUpdateCheck": 1716930083693
 	}
 }
--- a/.prettierrc.mjs
+++ b/.prettierrc.mjs
@ -0,0 +1,13 @@
+// .prettierrc.mjs
+/** @type {import("prettier").Config} */
+export default {
+  plugins: ["prettier-plugin-astro"],
+  overrides: [
+    {
+      files: "*.astro",
+      options: {
+        parser: "astro",
+      },
+    },
+  ],
+};
--- a/README.md
+++ b/README.md
@ -1,68 +1 @@
-# Astro Starter Kit: Blog
-
-```sh
-npm create astro@latest -- --template blog
-```
-
-[![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/withastro/astro/tree/latest/examples/blog)
-[![Open with CodeSandbox](https://assets.codesandbox.io/github/button-edit-lime.svg)](https://codesandbox.io/p/sandbox/github/withastro/astro/tree/latest/examples/blog)
-[![Open in GitHub Codespaces](https://github.com/codespaces/badge.svg)](https://codespaces.new/withastro/astro?devcontainer_path=.devcontainer/blog/devcontainer.json)
-
-> 🧑‍🚀 **Seasoned astronaut?** Delete this file. Have fun!
-
-![blog](https://github.com/withastro/astro/assets/2244813/ff10799f-a816-4703-b967-c78997e8323d)
-
-Features:
-
- ✅ Minimal styling (make it your own!)
- ✅ 100/100 Lighthouse performance
- ✅ SEO-friendly with canonical URLs and OpenGraph data
- ✅ Sitemap support
- ✅ RSS Feed support
- ✅ Markdown & MDX support
-
-## 🚀 Project Structure
-
-Inside of your Astro project, you'll see the following folders and files:
-
-```text
-├── public/
-├── src/
-│   ├── components/
-│   ├── content/
-│   ├── layouts/
-│   └── pages/
-├── astro.config.mjs
-├── README.md
-├── package.json
-└── tsconfig.json
-```
-
-Astro looks for `.astro` or `.md` files in the `src/pages/` directory. Each page is exposed as a route based on its file name.
-
-There's nothing special about `src/components/`, but that's where we like to put any Astro/React/Vue/Svelte/Preact components.
-
-The `src/content/` directory contains "collections" of related Markdown and MDX documents. Use `getCollection()` to retrieve posts from `src/content/blog/`, and type-check your frontmatter using an optional schema. See [Astro's Content Collections docs](https://docs.astro.build/en/guides/content-collections/) to learn more.
-
-Any static assets, like images, can be placed in the `public/` directory.
-
-## 🧞 Commands
-
-All commands are run from the root of the project, from a terminal:
-
-| Command                   | Action                                           |
-| :------------------------ | :----------------------------------------------- |
-| `npm install`             | Installs dependencies                            |
-| `npm run dev`             | Starts local dev server at `localhost:4321`      |
-| `npm run build`           | Build your production site to `./dist/`          |
-| `npm run preview`         | Preview your build locally, before deploying     |
-| `npm run astro ...`       | Run CLI commands like `astro add`, `astro check` |
-| `npm run astro -- --help` | Get help using the Astro CLI                     |
-
-## 👀 Want to learn more?
-
-Check out [our documentation](https://docs.astro.build) or jump into our [Discord server](https://astro.build/chat).
-
-## Credit
-
-This theme is based off of the lovely [Bear Blog](https://github.com/HermanMartinus/bearblog/).
+# zack blog (old)
--- a/astro.config.mjs
+++ b/astro.config.mjs
@ -3,13 +3,14 @@ import mdx from "@astrojs/mdx";
 import sitemap from "@astrojs/sitemap";

 import tailwind from "@astrojs/tailwind";
+import syntaxTheme from "./syntax-theme.json";

 // https://astro.build/config
 export default defineConfig({
  site: "https://zackmyers.io",
  markdown: {
    shikiConfig: {
-      theme: "catppuccin-frappe",
+      theme: syntaxTheme,
    },
  },
  integrations: [mdx(), sitemap(), tailwind()],
--- a/flake.nix
+++ b/flake.nix
@ -62,6 +62,10 @@
        };
      };

+    hydraJobs = {
+      web = self.packages."x86_64-linux".default;
+    };
+
    devShells = eachSystem (pkgs: {
      default = pkgs.mkShell {
        buildInputs = [
--- a/package-lock.json
+++ b/package-lock.json
--- a/package.json
+++ b/package.json
@ -21,6 +21,8 @@
  },
  "devDependencies": {
    "@catppuccin/tailwindcss": "^0.1.6",
-    "@tailwindcss/typography": "^0.5.12"
+    "@tailwindcss/typography": "^0.5.12",
+    "prettier": "^3.2.5",
+    "prettier-plugin-astro": "^0.14.0"
  }
 }
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@ -7,7 +7,7 @@ settings:
 dependencies:
  '@astrojs/check':
    specifier: ^0.5.10
-    version: 0.5.10(typescript@5.4.5)
+    version: 0.5.10(prettier-plugin-astro@0.14.0)(prettier@3.2.5)(typescript@5.4.5)
  '@astrojs/mdx':
    specifier: ^2.3.0
    version: 2.3.0(astro@4.6.1)
@ -37,6 +37,12 @@ devDependencies:
  '@tailwindcss/typography':
    specifier: ^0.5.12
    version: 0.5.12(tailwindcss@3.4.3)
+  prettier:
+    specifier: ^3.2.5
+    version: 3.2.5
+  prettier-plugin-astro:
+    specifier: ^0.14.0
+    version: 0.14.0

 packages:

@ -52,13 +58,13 @@ packages:
      '@jridgewell/trace-mapping': 0.3.25
    dev: false

-  /@astrojs/check@0.5.10(typescript@5.4.5):
+  /@astrojs/check@0.5.10(prettier-plugin-astro@0.14.0)(prettier@3.2.5)(typescript@5.4.5):
    resolution: {integrity: sha512-vliHXM9cu/viGeKiksUM4mXfO816ohWtawTl2ADPgTsd4nUMjFiyAl7xFZhF34yy4hq4qf7jvK1F2PlR3b5I5w==}
    hasBin: true
    peerDependencies:
      typescript: ^5.0.0
    dependencies:
-      '@astrojs/language-server': 2.8.4(typescript@5.4.5)
+      '@astrojs/language-server': 2.8.4(prettier-plugin-astro@0.14.0)(prettier@3.2.5)(typescript@5.4.5)
      chokidar: 3.6.0
      fast-glob: 3.3.2
      kleur: 4.1.5
@ -69,6 +75,9 @@ packages:
      - prettier-plugin-astro
    dev: false

+  /@astrojs/compiler@1.8.2:
+    resolution: {integrity: sha512-o/ObKgtMzl8SlpIdzaxFnt7SATKPxu4oIP/1NL+HDJRzxfJcAkOTAb/ZKMRyULbz4q+1t2/DAebs2Z1QairkZw==}
+
  /@astrojs/compiler@2.7.1:
    resolution: {integrity: sha512-/POejAYuj8WEw7ZI0J8JBvevjfp9jQ9Wmu/Bg52RiNwGXkMV7JnYpsenVfHvvf1G7R5sXHGKlTcxlQWhoUTiGQ==}
    dev: false
@ -77,7 +86,7 @@ packages:
    resolution: {integrity: sha512-6B13lz5n6BrbTqCTwhXjJXuR1sqiX/H6rTxzlXx+lN1NnV4jgnq/KJldCQaUWJzPL5SiWahQyinxAbxQtwgPHA==}
    dev: false

-  /@astrojs/language-server@2.8.4(typescript@5.4.5):
+  /@astrojs/language-server@2.8.4(prettier-plugin-astro@0.14.0)(prettier@3.2.5)(typescript@5.4.5):
    resolution: {integrity: sha512-sJH5vGTBkhgA8+hdhzX78UUp4cFz4Mt7xkEkevD188OS5bDMkaue6hK+dtXWM47mnrXFveXA2u38K7S+5+IRjA==}
    hasBin: true
    peerDependencies:
@ -97,10 +106,12 @@ packages:
      '@volar/language-service': 2.1.6
      '@volar/typescript': 2.1.6
      fast-glob: 3.3.2
+      prettier: 3.2.5
+      prettier-plugin-astro: 0.14.0
      volar-service-css: 0.0.34(@volar/language-service@2.1.6)
      volar-service-emmet: 0.0.34(@volar/language-service@2.1.6)
      volar-service-html: 0.0.34(@volar/language-service@2.1.6)
-      volar-service-prettier: 0.0.34(@volar/language-service@2.1.6)
+      volar-service-prettier: 0.0.34(@volar/language-service@2.1.6)(prettier@3.2.5)
      volar-service-typescript: 0.0.34(@volar/language-service@2.1.6)
      volar-service-typescript-twoslash-queries: 0.0.34(@volar/language-service@2.1.6)
      vscode-html-languageservice: 5.2.0
@ -3649,6 +3660,19 @@ packages:
      which-pm: 2.0.0
    dev: false

+  /prettier-plugin-astro@0.14.0:
+    resolution: {integrity: sha512-7jRGJsexaRIyUzTk8uzXlP45cw6DQ5Ci4bTe0xCBCcuO1Fff8jJy9oI+kRCQKSdDFTSAArMSg8GpvzlKBtSaZA==}
+    engines: {node: ^14.15.0 || >=16.0.0}
+    dependencies:
+      '@astrojs/compiler': 1.8.2
+      prettier: 3.2.5
+      sass-formatter: 0.7.9
+
+  /prettier@3.2.5:
+    resolution: {integrity: sha512-3/GWa9aOC0YeD7LUfvOG2NiDyhOWRvt1k+rcKhOuYnMY24iiCphgneUfJDyFXd6rZCAnuLBv6UeAULtrhT/F4A==}
+    engines: {node: '>=14'}
+    hasBin: true
+
  /prismjs@1.29.0:
    resolution: {integrity: sha512-Kx/1w86q/epKcmte75LNrEoT+lX8pBpavuAbvJWRXar7Hz8jrtF+e3vY751p0R8H9HdArwaCTNDDzHg/ScJK1Q==}
    engines: {node: '>=6'}
@ -3903,10 +3927,18 @@ packages:
    dependencies:
      queue-microtask: 1.2.3

+  /s.color@0.0.15:
+    resolution: {integrity: sha512-AUNrbEUHeKY8XsYr/DYpl+qk5+aM+DChopnWOPEzn8YKzOhv4l2zH6LzZms3tOZP3wwdOyc0RmTciyi46HLIuA==}
+
  /safe-buffer@5.2.1:
    resolution: {integrity: sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ==}
    dev: false

+  /sass-formatter@0.7.9:
+    resolution: {integrity: sha512-CWZ8XiSim+fJVG0cFLStwDvft1VI7uvXdCNJYXhDvowiv+DsbD1nXLiQ4zrE5UBvj5DWZJ93cwN0NX5PMsr1Pw==}
+    dependencies:
+      suf-log: 2.5.3
+
  /sax@1.3.0:
    resolution: {integrity: sha512-0s+oAmw9zLl1V1cS9BtZN7JAd0cW5e0QH4W3LWEK6a4LaLEA2OTpGYWDY+6XasBLtz6wkm3u1xRw95mRuJ59WA==}
    dev: false
@ -4156,6 +4188,11 @@ packages:
      pirates: 4.0.6
      ts-interface-checker: 0.1.13

+  /suf-log@2.5.3:
+    resolution: {integrity: sha512-KvC8OPjzdNOe+xQ4XWJV2whQA0aM1kGVczMQ8+dStAO6KfEB140JEVQ9dE76ONZ0/Ylf67ni4tILPJB41U0eow==}
+    dependencies:
+      s.color: 0.0.15
+
  /supports-color@5.5.0:
    resolution: {integrity: sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==}
    engines: {node: '>=4'}
@ -4578,7 +4615,7 @@ packages:
      vscode-uri: 3.0.8
    dev: false

-  /volar-service-prettier@0.0.34(@volar/language-service@2.1.6):
+  /volar-service-prettier@0.0.34(@volar/language-service@2.1.6)(prettier@3.2.5):
    resolution: {integrity: sha512-BNfJ8FwfPi1Wm/JkuzNjraOLdtKieGksNT/bDyquygVawv1QUzO2HB1hiMKfZGdcSFG5ZL9R0j7bBfRTfXA2gg==}
    peerDependencies:
      '@volar/language-service': ~2.1.0
@ -4590,6 +4627,7 @@ packages:
        optional: true
    dependencies:
      '@volar/language-service': 2.1.6
+      prettier: 3.2.5
      vscode-uri: 3.0.8
    dev: false

--- a/src/components/BaseHead.astro
+++ b/src/components/BaseHead.astro
@ -1,17 +1,17 @@
 ---
 // Import the global.css file here so that it is included on
 // all pages through the use of the <BaseHead /> component.
-import '../styles/global.css';
+import "../styles/global.css";

 interface Props {
-	title: string;
-	description: string;
-	image?: string;
+  title: string;
+  description: string;
+  image?: string;
 }

 const canonicalURL = new URL(Astro.url.pathname, Astro.site);

-const { title, description, image = '/blog-placeholder-2.jpg' } = Astro.props;
+const { title, description, image = "/blog-placeholder-2.jpg" } = Astro.props;
 ---

 <!-- Global Metadata -->
@ -20,7 +20,7 @@ const { title, description, image = '/blog-placeholder-2.jpg' } = Astro.props;
 <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
 <meta name="generator" content={Astro.generator} />

-<link rel="stylesheet" href="/fonts/Iosevka.css">
+<link rel="stylesheet" href="/fonts/Iosevka.css" />

 <!-- Canonical URL -->
 <link rel="canonical" href={canonicalURL} />
--- a/src/components/Footer.astro
+++ b/src/components/Footer.astro
@ -2,47 +2,46 @@
 const today = new Date();
 ---

-<footer>
-	&copy; {today.getFullYear()} Zachary Myers. All rights reserved.
-	<div class="social-links">
-		<a href="https://twitter.com/_zackartz" target="_blank">
-			<span class="sr-only">Follow Zack on Twitter</span>
-			<svg viewBox="0 0 16 16" aria-hidden="true" width="32" height="32" astro-icon="social/twitter"
-				><path
-					fill="currentColor"
-					d="M5.026 15c6.038 0 9.341-5.003 9.341-9.334 0-.14 0-.282-.006-.422A6.685 6.685 0 0 0 16 3.542a6.658 6.658 0 0 1-1.889.518 3.301 3.301 0 0 0 1.447-1.817 6.533 6.533 0 0 1-2.087.793A3.286 3.286 0 0 0 7.875 6.03a9.325 9.325 0 0 1-6.767-3.429 3.289 3.289 0 0 0 1.018 4.382A3.323 3.323 0 0 1 .64 6.575v.045a3.288 3.288 0 0 0 2.632 3.218 3.203 3.203 0 0 1-.865.115 3.23 3.23 0 0 1-.614-.057 3.283 3.283 0 0 0 3.067 2.277A6.588 6.588 0 0 1 .78 13.58a6.32 6.32 0 0 1-.78-.045A9.344 9.344 0 0 0 5.026 15z"
-				></path></svg
-			>
-		</a>
-		<a href="https://github.com/zackartz" target="_blank">
-			<span class="sr-only">Go to Zacks's GitHub repo</span>
-			<svg viewBox="0 0 16 16" aria-hidden="true" width="32" height="32" astro-icon="social/github"
-				><path
-					fill="currentColor"
-					d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8z"
-				></path></svg
-			>
-		</a>
-	</div>
+<footer class="flex flex-col items-center w-full">
+  <p>
+    &copy; {today.getFullYear()} Zachary Myers. All rights reserved.
+    <div class="flex mt-4 space-x-3">
+      <a href="https://twitter.com/_zackartz" target="_blank">
+        <span class="sr-only">Follow Zack on Twitter</span>
+        <svg
+          viewBox="0 0 16 16"
+          aria-hidden="true"
+          width="32"
+          height="32"
+          astro-icon="social/twitter"
+          ><path
+            fill="currentColor"
+            d="M5.026 15c6.038 0 9.341-5.003 9.341-9.334 0-.14 0-.282-.006-.422A6.685 6.685 0 0 0 16 3.542a6.658 6.658 0 0 1-1.889.518 3.301 3.301 0 0 0 1.447-1.817 6.533 6.533 0 0 1-2.087.793A3.286 3.286 0 0 0 7.875 6.03a9.325 9.325 0 0 1-6.767-3.429 3.289 3.289 0 0 0 1.018 4.382A3.323 3.323 0 0 1 .64 6.575v.045a3.288 3.288 0 0 0 2.632 3.218 3.203 3.203 0 0 1-.865.115 3.23 3.23 0 0 1-.614-.057 3.283 3.283 0 0 0 3.067 2.277A6.588 6.588 0 0 1 .78 13.58a6.32 6.32 0 0 1-.78-.045A9.344 9.344 0 0 0 5.026 15z"
+          ></path></svg
+        >
+      </a>
+      <a href="https://github.com/zackartz" target="_blank">
+        <span class="sr-only">Go to Zacks's GitHub repo</span>
+        <svg
+          viewBox="0 0 16 16"
+          aria-hidden="true"
+          width="32"
+          height="32"
+          astro-icon="social/github"
+          ><path
+            fill="currentColor"
+            d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8z"
+          ></path></svg
+        >
+      </a>
+    </div>
+  </p>
+  <style>
+    footer {
+      padding: 2em 1em 6em 1em;
+      background: linear-gradient(var(--gray-gradient)) no-repeat;
+      color: rgb(var(--gray));
+      text-align: center;
+    }
+  </style>
 </footer>
-<style>
-	footer {
-		padding: 2em 1em 6em 1em;
-		background: linear-gradient(var(--gray-gradient)) no-repeat;
-		color: rgb(var(--gray));
-		text-align: center;
-	}
-	.social-links {
-		display: flex;
-		justify-content: center;
-		gap: 1em;
-		margin-top: 1em;
-	}
-	.social-links a {
-		text-decoration: none;
-		color: rgb(var(--gray));
-	}
-	.social-links a:hover {
-		color: rgb(var(--gray-dark));
-	}
-</style>
--- a/src/components/FormattedDate.astro
+++ b/src/components/FormattedDate.astro
@ -1,17 +1,17 @@
 ---
 interface Props {
-	date: Date;
+  date: Date;
 }

 const { date } = Astro.props;
 ---

 <time class="text-ctp-sky" datetime={date.toISOString()}>
-	{
-		date.toLocaleDateString('en-us', {
-			year: 'numeric',
-			month: 'short',
-			day: 'numeric',
-		})
-	}
+  {
+    date.toLocaleDateString("en-us", {
+      year: "numeric",
+      month: "short",
+      day: "numeric",
+    })
+  }
 </time>
--- a/src/components/Header.astro
+++ b/src/components/Header.astro
@ -1,37 +1,46 @@
 ---
-import HeaderLink from './HeaderLink.astro';
-import { SITE_TITLE } from '../consts';
+import HeaderLink from "./HeaderLink.astro";
+import { SITE_TITLE } from "../consts";
 ---

 <header>
-	<nav>
-		<h2 class="p-5 font-bold"><a href="/">{SITE_TITLE}</a></h2>
-		<div class="absolute w-screen flex justify-center top-0 p-5 space-x-4">
-			<HeaderLink href="/">Home</HeaderLink>
-			<HeaderLink href="/blog">Blog</HeaderLink>
-			<HeaderLink href="/about">About</HeaderLink>
-			<HeaderLink target="_blank" href="https://cv.zackmyers.io">CV</HeaderLink>
-		</div>
-		<div class="p-5 flex absolute top-0 right-0 space-x-4">
-		<a href="https://twitter.com/_zackartz" target="_blank">
-			<span class="sr-only">Follow Zack on Twitter</span>
-			<svg viewBox="0 0 16 16" aria-hidden="true" width="19" height="19" astro-icon="social/twitter"
-				><path
-					fill="currentColor"
-					d="M5.026 15c6.038 0 9.341-5.003 9.341-9.334 0-.14 0-.282-.006-.422A6.685 6.685 0 0 0 16 3.542a6.658 6.658 0 0 1-1.889.518 3.301 3.301 0 0 0 1.447-1.817 6.533 6.533 0 0 1-2.087.793A3.286 3.286 0 0 0 7.875 6.03a9.325 9.325 0 0 1-6.767-3.429 3.289 3.289 0 0 0 1.018 4.382A3.323 3.323 0 0 1 .64 6.575v.045a3.288 3.288 0 0 0 2.632 3.218 3.203 3.203 0 0 1-.865.115 3.23 3.23 0 0 1-.614-.057 3.283 3.283 0 0 0 3.067 2.277A6.588 6.588 0 0 1 .78 13.58a6.32 6.32 0 0 1-.78-.045A9.344 9.344 0 0 0 5.026 15z"
-				></path></svg
-			>
-		</a>
-		<a href="https://github.com/zackartz" target="_blank">
-			<span class="sr-only">Go to Zacks's GitHub repo</span>
-			<svg viewBox="0 0 16 16" aria-hidden="true" width="19" height="19" astro-icon="social/github"
-				><path
-					fill="currentColor"
-					d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8z"
-				></path></svg
-			>
-		</a>
-		</div>
-	</nav>
+  <nav class="flex relative justify-center pb-16 w-full">
+    <h2 class="absolute left-0 p-5 font-bold"><a href="/">{SITE_TITLE}</a></h2>
+    <div class="flex absolute top-0 justify-center p-5 space-x-4">
+      <HeaderLink href="/">Home</HeaderLink>
+      <HeaderLink href="/blog">Blog</HeaderLink>
+      <HeaderLink href="/about">About</HeaderLink>
+      <HeaderLink target="_blank" href="https://cv.zackmyers.io">CV</HeaderLink>
+    </div>
+    <div class="flex absolute top-0 right-0 p-5 space-x-4">
+      <a href="https://twitter.com/_zackartz" target="_blank">
+        <span class="sr-only">Follow Zack on Twitter</span>
+        <svg
+          viewBox="0 0 16 16"
+          aria-hidden="true"
+          width="19"
+          height="19"
+          astro-icon="social/twitter"
+          ><path
+            fill="currentColor"
+            d="M5.026 15c6.038 0 9.341-5.003 9.341-9.334 0-.14 0-.282-.006-.422A6.685 6.685 0 0 0 16 3.542a6.658 6.658 0 0 1-1.889.518 3.301 3.301 0 0 0 1.447-1.817 6.533 6.533 0 0 1-2.087.793A3.286 3.286 0 0 0 7.875 6.03a9.325 9.325 0 0 1-6.767-3.429 3.289 3.289 0 0 0 1.018 4.382A3.323 3.323 0 0 1 .64 6.575v.045a3.288 3.288 0 0 0 2.632 3.218 3.203 3.203 0 0 1-.865.115 3.23 3.23 0 0 1-.614-.057 3.283 3.283 0 0 0 3.067 2.277A6.588 6.588 0 0 1 .78 13.58a6.32 6.32 0 0 1-.78-.045A9.344 9.344 0 0 0 5.026 15z"
+          ></path></svg
+        >
+      </a>
+      <a href="https://github.com/zackartz" target="_blank">
+        <span class="sr-only">Go to Zacks's GitHub repo</span>
+        <svg
+          viewBox="0 0 16 16"
+          aria-hidden="true"
+          width="19"
+          height="19"
+          astro-icon="social/github"
+          ><path
+            fill="currentColor"
+            d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8z"
+          ></path></svg
+        >
+      </a>
+    </div>
+  </nav>
 </header>
-
--- a/src/components/HeaderLink.astro
+++ b/src/components/HeaderLink.astro
@ -1,24 +1,24 @@
 ---
-import type { HTMLAttributes } from 'astro/types';
+import type { HTMLAttributes } from "astro/types";

-type Props = HTMLAttributes<'a'>;
+type Props = HTMLAttributes<"a">;

 const { href, class: className, ...props } = Astro.props;

 const { pathname } = Astro.url;
 const subpath = pathname.match(/[^\/]+/g);
-const isActive = href === pathname || href === '/' + subpath?.[0];
+const isActive = href === pathname || href === "/" + subpath?.[0];
 ---

 <a href={href} class:list={[className, { active: isActive }]} {...props}>
-	<slot />
+  <slot />
 </a>
 <style>
-	a {
-		@apply inline-block no-underline;
-	}
-	a.active {
-		font-weight: bolder;
-		text-decoration: underline;
-	}
+  a {
+    @apply inline-block no-underline;
+  }
+  a.active {
+    font-weight: bolder;
+    text-decoration: underline;
+  }
 </style>
--- a/src/layouts/BlogPost.astro
+++ b/src/layouts/BlogPost.astro
@ -1,79 +1,73 @@
 ---
-import BaseHead from '../components/BaseHead.astro';
-import Header from '../components/Header.astro';
-import Footer from '../components/Footer.astro';
-import FormattedDate from '../components/FormattedDate.astro';
+import FormattedDate from "../components/FormattedDate.astro";

 type Props = any;

-const { title, description, pubDate, updatedDate, heroImage } = Astro.props;
+const { title, pubDate, updatedDate, heroImage } = Astro.props;
 ---

 <html lang="en" class="ctp-mocha bg-ctp-base">
-	<head>
-		<BaseHead title={title} description={description} />
-		<style>
-			.hero-image {
-				width: 100%;
-			}
-			.hero-image img {
-				display: block;
-				margin: 0 auto;
-				border-radius: 12px;
-				box-shadow: var(--box-shadow);
-			}
-			.prose {
-				width: 720px;
-				max-width: calc(100% - 2em);
-				margin: auto;
-				padding: 1em;
-				color: rgb(var(--gray-dark));
-			}
-			.title {
-				margin-bottom: 1em;
-				padding: 1em 0;
-				text-align: center;
-				line-height: 1;
-			}
-			.title h1 {
-				margin: 0 0 0.5em 0;
-			}
-			.date {
-				margin-bottom: 0.5em;
-				color: rgb(var(--gray));
-			}
-			.last-updated-on {
-				font-style: italic;
-			}
-		</style>
-	</head>
+  <head>
+    <style>
+      .hero-image {
+        width: 100%;
+      }
+      .hero-image img {
+        display: block;
+        margin: 0 auto;
+        border-radius: 12px;
+        box-shadow: var(--box-shadow);
+      }
+      .prose {
+        width: 720px;
+        max-width: calc(100% - 2em);
+        margin: auto;
+        padding: 1em;
+        color: rgb(var(--gray-dark));
+      }
+      .title {
+        margin-bottom: 1em;
+        padding: 1em 0;
+        text-align: center;
+        line-height: 1;
+      }
+      .title h1 {
+        margin: 0 0 0.5em 0;
+      }
+      .date {
+        margin-bottom: 0.5em;
+        color: rgb(var(--gray));
+      }
+      .last-updated-on {
+        font-style: italic;
+      }
+    </style>
+  </head>
+
+  <main class="px-8 bg-base">
+    <article>
+      <div class="hero-image">
+        {heroImage && <img width={1020} height={510} src={heroImage} alt="" />}
+      </div>
+      <div class="prose lg:prose-xl">
+        <div class="title">
+          <div class="date">
+            <FormattedDate date={pubDate} />
+            {
+              updatedDate && (
+                <div class="last-updated-on">
+                  Last updated on <FormattedDate date={updatedDate} />
+                </div>
+              )
+            }
+          </div>
+          <h1 class="text-ctp-text">{title}</h1>
+          <hr class="border-ctp-surface0" />
+        </div>
+        <slot />
+      </div>
+    </article>
+  </main>
+

-	<body class="bg-base">
-		<Header />
-		<main class="px-8">
-			<article>
-				<div class="hero-image">
-					{heroImage && <img width={1020} height={510} src={heroImage} alt="" />}
-				</div>
-				<div class="prose lg:prose-xl">
-					<div class="title">
-						<div class="date">
-							<FormattedDate date={pubDate} />
-							{
-								updatedDate && (
-									<div class="last-updated-on">
-										Last updated on <FormattedDate date={updatedDate} />
-									</div>
-								)
-							}
-						</div>
-						<h1 class="text-ctp-text">{title}</h1>
-						<hr class="border-ctp-surface0" />
-					</div>
-					<slot />
-				</div>
-			</article>
-		</main>
-		<Footer />
-	</body>
 </html>
--- a/src/layouts/Layout.astro
+++ b/src/layouts/Layout.astro
@ -0,0 +1,21 @@
+---
+import BaseHead from "../components/BaseHead.astro";
+import Header from "../components/Header.astro";
+import Footer from "../components/Footer.astro";
+
+const { title, description } = Astro.props;
+---
+
+<!doctype html>
+<html lang="en" class="ctp-mocha">
+  <head>
+    <BaseHead title={title} description={description} />
+  </head>
+  <body class="flex justify-center bg-ctp-crust">
+    <div class="relative w-full max-w-6xl min-h-screen bg-ctp-base">
+      <Header />
+      <slot />
+      <Footer />
+    </div>
+  </body>
+</html>
--- a/src/pages/about.astro
+++ b/src/pages/about.astro
@ -1,14 +1,21 @@
 ---
-import Layout from '../layouts/BlogPost.astro';
+import Layout from "../layouts/Layout.astro";
+import BlogPost from "../layouts/BlogPost.astro";
 ---

-<Layout
-	title="About Me"
-	description="About Zachary Myers"
-	pubDate={new Date('April 13 2024')}
->
-	<article>
-		<h3 class="">Hey there!</h3>
-		<p class="">My name is Zachary Myers, I am a software engineer from Honolulu, now living in Saint Joseph, MI. I am most interested in backend programming, and primarily use languages like Rust and Go, though also have plenty of experience with JavaScript and TypeScript as well. I am looking for work! Feel free to <a href="https://cv.zackmyers.io" target="_blank">check out my cv</a> and <a href="mailto:me@zackmyers.io">reach out</a> if you are interested!</p>
-	</article>
+<Layout title="About Me" description="About Zachary Myers">
+  <BlogPost title="About" description="About Zachary" pubDate={new Date()}>
+    <article>
+      <h3 class="">Hey there!</h3>
+      <p class="">
+        My name is Zachary Myers, I am a software engineer from Honolulu, now
+        living in Saint Joseph, MI. I am most interested in backend programming,
+        and primarily use languages like Rust and Go, though also have plenty of
+        experience with JavaScript and TypeScript as well. I am looking for
+        work! Feel free to <a href="https://cv.zackmyers.io" target="_blank"
+          >check out my cv</a
+        > and <a href="mailto:me@zackmyers.io">reach out</a> if you are interested!
+      </p>
+    </article>
+  </BlogPost>
 </Layout>
--- a/src/pages/blog/[...slug].astro
+++ b/src/pages/blog/[...slug].astro
@ -1,19 +1,22 @@
 ---
-import { getCollection } from 'astro:content';
-import BlogPost from '../../layouts/BlogPost.astro';
+import { getCollection } from "astro:content";
+import Layout from "../../layouts/Layout.astro";
+import BlogPost from "../../layouts/BlogPost.astro";

 export async function getStaticPaths() {
-	const posts: any[] = await getCollection('blog');
-	return posts.map((post) => ({
-		params: { slug: post.slug },
-		props: post,
-	}));
+  const posts: any[] = await getCollection("blog");
+  return posts.map((post) => ({
+    params: { slug: post.slug },
+    props: post,
+  }));
 }

 const post: any = Astro.props;
 const { Content } = await post.render();
 ---

-<BlogPost class="prose lg:prose-xl" {...post.data}>
-	<Content />
-</BlogPost>
+<Layout>
+  <BlogPost class="prose lg:prose-xl" {...post.data}>
+    <Content />
+  </BlogPost>
+</Layout>
--- a/src/pages/blog/index.astro
+++ b/src/pages/blog/index.astro
@ -1,43 +1,57 @@
 ---
-import BaseHead from '../../components/BaseHead.astro';
-import Header from '../../components/Header.astro';
-import Footer from '../../components/Footer.astro';
-import { SITE_TITLE, SITE_DESCRIPTION } from '../../consts';
-import { getCollection } from 'astro:content';
-import FormattedDate from '../../components/FormattedDate.astro';
+import Layout from "../../layouts/Layout.astro";
+import FormattedDate from "../../components/FormattedDate.astro";
+import { SITE_TITLE, SITE_DESCRIPTION } from "../../consts";
+import { getCollection } from "astro:content";

-const posts: any[] = (await getCollection('blog')).sort(
-	(a: any, b: any) => a.data.pubDate.valueOf() - b.data.pubDate.valueOf()
+const posts: any[] = (await getCollection("blog")).sort(
+  (a: any, b: any) => a.data.pubDate.valueOf() - b.data.pubDate.valueOf(),
 );
 ---

-<!doctype html>
-<html lang="en" class="ctp-mocha bg-ctp-base">
-	<head>
-		<BaseHead title={SITE_TITLE} description={SITE_DESCRIPTION} />
-		</head>
-	<body>
-		<Header />
-		<main class="w-full flex justify-center">
-{posts.length === 0 && <p class="py-48">Sorry! No posts at the minute, coming soon!</p>}
-			<section>
-				<ul class="space-y-4">
-					{
-						posts.sort((a, b) => b.data.pubDate - a.data.pubDate).map((post) => (
-							<li class="p-4 rounded-xl shadow-lg border border-ctp-surface2">
-								<a href={`/blog/${post.slug}/`}>
-									<img class="rounded-lg" width={720} height={360} src={post.data.heroImage} alt="" />
-									<h4 class="text-2xl p-3 font-bold text-center text-ctp-mauve">{post.data.title}</h4>
-									<p class="text-center">
-										<FormattedDate date={post.data.pubDate} />
-									</p>
-								</a>
-							</li>
-						))
-					}
-				</ul>
-			</section>
-		</main>
-		<Footer />
-	</body>
-</html>
+<Layout title={SITE_TITLE} description={SITE_DESCRIPTION}>
+  <main class="flex relative justify-center w-full">
+    {
+      posts.length === 0 && (
+        <p class="py-48">Sorry! No posts at the minute, coming soon!</p>
+      )
+    }
+    <section class="p-16">
+      <h1 class="pb-8 w-3/4 text-4xl font-bold leading-gi">
+        My thoughts on NixOS, Rust, and other software tools.
+      </h1>
+      <h2 class="pb-24 text-lg">
+        My thoughts & experiences collected into one place.
+      </h2>
+      <div class="border-l border-ctp-surface0">
+        <ul class="space-y-4">
+          {
+            posts
+              .sort((a, b) => b.data.pubDate - a.data.pubDate)
+              .map((post) => (
+                <div class="flex">
+                  <div class="p-4 my-auto w-[164px]">
+                    <FormattedDate date={post.data.pubDate} />
+                  </div>
+
+                  <li class="w-full">
+                    <div class="flex flex-col p-8 w-full rounded-xl border transition-all border-ctp-base hover:border-ctp-surface0">
+                      <a href={`/blog/${post.slug}/`}>
+                        <h4 class="text-lg font-bold text-ctp-mauve">
+                          {post.data.title}
+                        </h4>
+                        <h5 class="mt-2 text-sm">{post.data.description}</h5>
+                        <p class="pt-2 text-sm font-bold text-ctp-blue">
+                          Read ->
+                        </p>
+                      </a>
+                    </div>
+                  </li>
+                </div>
+              ))
+          }
+        </ul>
+      </div>
+    </section>
+  </main>
+</Layout>
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@ -1,32 +1,46 @@
 ---
-import BaseHead from '../components/BaseHead.astro';
-import Header from '../components/Header.astro';
-import Footer from '../components/Footer.astro';
-import { SITE_TITLE, SITE_DESCRIPTION } from '../consts';
+import BaseHead from "../components/BaseHead.astro";
+import Header from "../components/Header.astro";
+import Footer from "../components/Footer.astro";
+import { SITE_TITLE, SITE_DESCRIPTION } from "../consts";
 ---

 <!doctype html>
-<html lang="en" class="ctp-mocha bg-ctp-base"> 
-	<head>
-		<BaseHead title={SITE_TITLE} description={SITE_DESCRIPTION} />
-	</head>
-	<body class="h-screen bg-base relative">
-		<Header />
-		<main class="p-16 flex flex-col w-full h-[84%]
+<html lang="en" class="ctp-mocha bg-ctp-crust">
+  <head>
+    <BaseHead title={SITE_TITLE} description={SITE_DESCRIPTION} />
+  </head>
+  <body class="relative h-screen">
+    <Header />
+    <main class="p-16 flex flex-col w-full h-[84%]
 			justify-center items-center">
-			<div class="flex flex-col items-center space-y-4">
-				<h1 class="font-bold text-ctp-text text-5xl">Zachary Myers</h1>
-				<p class="py-4 text-ctp-blue">Software Engineer, Hardware Hacker, Photographer</p>
-			</div>
-			<a href="/about">
-			<button class="rounded-full bg-ctp-blue text-black w-32 mt-4 flex px-4 py-3 justify-center">About me <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6">
-  <path stroke-linecap="round" stroke-linejoin="round" d="M17.25 8.25 21 12m0 0-3.75 3.75M21 12H3" />
-</svg>
-</button>
-				</a>
-<div class="absolute bottom-5">
-		<Footer  />
-				</div>
-		</main>
-	</body>
+      <div class="flex flex-col items-center space-y-4">
+        <h1 class="text-5xl font-bold text-ctp-text">Zachary Myers</h1>
+        <p class="py-4 text-ctp-blue">
+          Software Engineer, Hardware Hacker, Photographer
+        </p>
+      </div>
+      <a href="/about">
+        <button
+          class="flex justify-center py-3 px-4 mt-4 w-32 text-black rounded-full bg-ctp-blue"
+          >About me <svg
+            xmlns="http://www.w3.org/2000/svg"
+            fill="none"
+            viewBox="0 0 24 24"
+            stroke-width="1.5"
+            stroke="currentColor"
+            class="w-6 h-6"
+          >
+            <path
+              stroke-linecap="round"
+              stroke-linejoin="round"
+              d="M17.25 8.25 21 12m0 0-3.75 3.75M21 12H3"></path>
+          </svg>
+        </button>
+      </a>
+      <div class="absolute bottom-5">
+        <Footer />
+      </div>
+    </main>
+  </body>
 </html>
--- a/src/styles/global.css
+++ b/src/styles/global.css
@ -6,6 +6,10 @@
  --gray-dark: var(--ctp-text);
 }

+::selection {
+  @apply bg-ctp-mauve text-ctp-base;
+}
+
@layer base {
  html {
    @apply text-ctp-text;
--- a/syntax-theme.json
+++ b/syntax-theme.json
Author	SHA1	Message	Date
zack	2b2a2ff39f	update cv	2025-02-05 15:29:01 -05:00
zoey	9477af4043	Update README.md	2024-10-20 02:20:58 +00:00
zoey	bc2f45151d	Update README.md	2024-10-20 01:25:09 +00:00
zack	61356cd5fa	update hydra build	2024-10-19 00:39:44 -04:00
zack	04422a6a54	Merge remote-tracking branch 'refs/remotes/gl/main'	2024-09-14 13:01:35 -04:00
zack	7731b1d8dd	fix(header): update cv link	2024-09-14 13:00:53 -04:00
zoey	9bdd0ceb2a	change url	2024-08-01 03:34:27 +00:00
zackartz	6af9d01d69	update pnpm-lock	2024-05-28 17:52:42 -04:00
zackartz	f50572713b	redesign c:	2024-05-28 17:46:33 -04:00
zackartz	4ae31ee714	update resume location	2024-05-24 12:08:26 -04:00