base64 decode, announcement pill

.vitepress/config.mts

@@ -6,6 +6,7 @@ import { commitRef, meta } from "./constants";
 import { pwa } from "./pwa";
 import { generateMeta } from "./hooks/meta";
 import { fileURLToPath } from "url";
+import { copyableCodePlugin } from "./markdown";
 
 export default defineConfig({
   title: "FMHY",
@@ -57,14 +58,19 @@ export default defineConfig({
     },
     resolve: {
       alias: [
-				{
-					find: /^.*VPSwitchAppearance\.vue$/,
-					replacement: fileURLToPath(
-						new URL("./theme/components/ThemeSwitch.vue", import.meta.url),
-					),
-				},
-      ]
-    }
+        {
+          find: /^.*VPSwitchAppearance\.vue$/,
+          replacement: fileURLToPath(
+            new URL("./theme/components/ThemeSwitch.vue", import.meta.url),
+          ),
+        },
+      ],
+    },
+  },
+  markdown: {
+    config(md) {
+      md.use(copyableCodePlugin);
+    },
   },
   themeConfig: {
     search: {

.vitepress/markdown.ts

@@ -0,0 +1,26 @@
+import { type MarkdownRenderer } from "vitepress";
+
+// FIXME: tasky: possibly write less horror jank?
+export function copyableCodePlugin(md: MarkdownRenderer) {
+  const decode = (str: string): string => Buffer.from(str, "base64").toString("binary");
+  // Save the original rule for backticks
+  const defaultRender =
+    md.renderer.rules.code_inline ||
+    function(tokens, idx, options, env, self) {
+      return self.renderToken(tokens, idx, options);
+    };
+
+  md.renderer.rules.code_inline = function(tokens, idx, options, env, self) {
+    // @ts-expect-error shut the fuck up already I HATE THIS
+    if (!env.frontmatter.title || (env.frontmatter.title && !env.frontmatter.title === "base64")) {
+      return defaultRender(tokens, idx, options, env, self);
+    }
+    const token = tokens[idx];
+    const content = token.content;
+    const buttonHTML = `<button class='base64' onclick="navigator.clipboard.writeText('${decode(
+      content,
+    )}')"><code>${content}</code></button>`;
+
+    return buttonHTML;
+  };
+}

.vitepress/theme/Layout.vue

@@ -1,6 +1,7 @@
 <script setup lang="ts">
 import DefaultTheme from "vitepress/theme";
 import Sidebar from "./components/SidebarCard.vue";
+import Announcement from "./components/Announcement.vue";
 
 const { Layout } = DefaultTheme;
 </script>
@@ -10,9 +11,9 @@ const { Layout } = DefaultTheme;
     <template #sidebar-nav-after>
       <Sidebar />
     </template>
-    <template>
-    <Content />
-
+    <template #home-hero-prelink>
+      <Announcement />
     </template>
+    <Content />
   </Layout>
 </template>

.vitepress/theme/components/Announcement.vue

@@ -0,0 +1,15 @@
+<script setup lang="ts">
+import { useData } from "vitepress";
+
+const { frontmatter } = useData();
+</script>
+
+<template>
+  <a
+    v-if="frontmatter.hero.prelink"
+    :href="frontmatter.hero.prelink.link"
+    target="_blank"
+    class="inline-flex items-center rounded-lg bg-[var(--vp-c-default-soft)] px-4 py-1 text-sm font-semibold mb-3">
+    {{ frontmatter.hero.prelink.title }}
+  </a>
+</template>

.vitepress/theme/style.css

@@ -93,6 +93,20 @@
   background-color: var(--vp-button-brand-bg);
 }
 
+.VPFooter a {
+  text-decoration-line: underline;
+  text-decoration-style: dashed;
+  text-underline-offset: 5px;
+  transition: 0.3s;
+}
+
+.VPFooter a:hover {
+  color: var(--vp-c-text-1);
+  text-decoration-line: underline;
+  text-decoration-style: dashed;
+  text-underline-offset: 5px;
+}
+
 /* Custom scrollbar */
 .VPSidebar::-webkit-scrollbar {
   block-size: 4px;
@@ -123,3 +137,9 @@
     --vp-home-hero-image-filter: blur(68px);
   }
 }
+
+.base64 {
+  min-width: 100%;
+  width: 0px;
+  white-space: pre-wrap;
+}