app.vue

@@ -1,9 +1,6 @@
-<script>
-import Backdrop from "./components/Backdrop.vue";
-</script>
 <template>
   <div>
-    <Backdrop />
+    <NuxtRouteAnnouncer />
-    <router-view />
+    <NuxtWelcome />
   </div>
 </template>

assets/app.css

@@ -1,2 +0,0 @@
-@import "tailwindcss";
-@plugin "daisyui";

components/Backdrop.vue

@@ -1,151 +0,0 @@
-<script setup>
-import { ref, onMounted, onUnmounted } from "vue";
-
-const canvas = ref(null);
-const cursor = ref({ x: 0, y: 0 });
-let ctx = null;
-let animationFrame = null;
-let chars = [];
-
-class Char {
-  constructor(x, y, char) {
-    this.x = x;
-    this.y = y;
-    this.char = char;
-    this.speed = 0.02 + Math.random() * 0.8;
-    this.opacity = 0.05 + Math.random() * 0.15;
-    this.actualY = y;
-  }
-
-  draw() {
-    const distToCursor = Math.hypot(
-      this.x - cursor.value.x,
-      this.y - cursor.value.y,
-    );
-
-    const highlight = Math.max(0, 0.5 - distToCursor / 250);
-    ctx.fillStyle = `rgba(203, 166, 247, ${this.opacity + highlight})`;
-    ctx.fillText(this.char, this.x, this.y);
-  }
-
-  update() {
-    this.actualY += this.speed;
-    this.y = this.actualY % window.innerHeight;
-
-    if (this.y < this.speed) {
-      this.char = String.fromCharCode(0x2729 + Math.floor(Math.random() * 706));
-      this.opacity = 0.05 + Math.random() * 0.15;
-    }
-  }
-}
-
-const calculateFontSize = () => {
-  const baseSize = 16;
-  const screenWidth = window.innerWidth;
-
-  // For smaller screens
-  if (screenWidth < 768) {
-    return Math.max(18, baseSize * (screenWidth / 768));
-  }
-
-  // For larger screens
-  return Math.min(22, Math.max(18, baseSize * (screenWidth / 1920)));
-};
-
-const init = () => {
-  if (!canvas.value) return;
-
-  ctx = canvas.value.getContext("2d", { alpha: false });
-  canvas.value.width = window.innerWidth;
-  canvas.value.height = window.innerHeight;
-
-  const fontSize = calculateFontSize();
-  const columnSpacing = fontSize * 1.5;
-
-  // Adjust number of columns based on screen size
-  const minColumns = 15; // Ensure at least this many columns on mobile
-  const columns = Math.max(
-    minColumns,
-    Math.floor(window.innerWidth / columnSpacing),
-  );
-
-  // Adjust rows based on screen height
-  const rowSpacing = fontSize * 2;
-  const minRows = 15; // Ensure at least this many rows on small screens
-  const maxRows = 25; // Cap for performance on large screens
-  const rows = Math.min(
-    maxRows,
-    Math.max(minRows, Math.floor(window.innerHeight / rowSpacing)),
-  );
-
-  chars = [];
-  for (let i = 0; i < columns; i++) {
-    for (let j = 0; j < rows; j++) {
-      const x = i * (window.innerWidth / columns); // Evenly distribute columns
-      const y = j * rowSpacing - Math.random() * window.innerHeight;
-      const char = String.fromCharCode(
-        0x2729 + Math.floor(Math.random() * 706),
-      );
-      chars.push(new Char(x, y, char));
-    }
-  }
-
-  ctx.font = `${fontSize}px monospace`;
-};
-
-const animate = () => {
-  ctx.fillStyle = "rgb(17, 17, 20)";
-  ctx.fillRect(0, 0, canvas.value.width, canvas.value.height);
-
-  chars.forEach((char) => {
-    char.draw();
-    char.update();
-  });
-
-  animationFrame = requestAnimationFrame(animate);
-};
-
-const handleMouseMove = (e) => {
-  cursor.value = {
-    x: e.clientX,
-    y: e.clientY,
-  };
-};
-
-let resizeTimeout;
-const handleResize = () => {
-  if (resizeTimeout) {
-    clearTimeout(resizeTimeout);
-  }
-
-  resizeTimeout = setTimeout(() => {
-    if (canvas.value) {
-      canvas.value.width = window.innerWidth;
-      canvas.value.height = window.innerHeight;
-      init();
-    }
-  }, 250);
-};
-
-onMounted(() => {
-  init();
-  animate();
-  window.addEventListener("mousemove", handleMouseMove);
-  window.addEventListener("resize", handleResize);
-});
-
-onUnmounted(() => {
-  if (animationFrame) {
-    cancelAnimationFrame(animationFrame);
-  }
-  if (resizeTimeout) {
-    clearTimeout(resizeTimeout);
-  }
-  window.removeEventListener("mousemove", handleMouseMove);
-  window.removeEventListener("resize", handleResize);
-});
-</script>
-
-<template>
-  <canvas ref="canvas" class="fixed inset-0 -z-10 h-full w-full bg-crust" />
-</template>

eslint.config.mjs

@@ -1,5 +1,6 @@
 // @ts-check
-import withNuxt from "./.nuxt/eslint.config.mjs";
+import withNuxt from './.nuxt/eslint.config.mjs'
 
-export default withNuxt();
+export default withNuxt(
-// Your custom configs here
+  // Your custom configs here
+)

nuxt.config.ts

@@ -1,23 +1,18 @@
-import tailwindcss from "@tailwindcss/vite";
 // https://nuxt.com/docs/api/configuration/nuxt-config
 export default defineNuxtConfig({
-  compatibilityDate: "2025-05-15",
+  compatibilityDate: '2025-05-15',
   devtools: { enabled: true },
-  target: "static",
+  target: 'static',
-  // make static output
+ // make static output
   ssr: false,
   nitro: {
-    preset: "static",
+    preset: 'static'
   },
   modules: [
-    "@nuxt/content",
+    '@nuxt/content',
-    "@nuxt/eslint",
+    '@nuxt/eslint',
-    "@nuxt/fonts",
+    '@nuxt/fonts',
-    "@nuxt/icon",
+    '@nuxt/icon',
-    "@nuxt/image",
+    '@nuxt/image'
-  ],
+  ]
-  vite: {
+})
-    plugins: [tailwindcss()],
-  },
-  css: ["~/assets/app.css"],
-});

package.json

@@ -15,12 +15,9 @@
     "@nuxt/fonts": "0.11.4",
     "@nuxt/icon": "1.13.0",
     "@nuxt/image": "1.10.0",
-    "@tailwindcss/vite": "^4.1.10",
     "better-sqlite3": "^11.10.0",
-    "daisyui": "^5.0.43",
     "eslint": "^9.0.0",
     "nuxt": "^3.17.5",
-    "tailwindcss": "^4.1.10",
     "vue": "^3.5.16",
     "vue-router": "^4.5.1"
   }

pages/index.vue

@@ -1,15 +0,0 @@
-<template>
-  <div class="hero min-h-screen">
-    <div class="hero-content text-center">
-      <div class="max-w-md">
-        <h1 class="text-5xl font-bold">Hello there</h1>
-        <p class="py-6">
-          Provident cupiditate voluptatem et in. Quaerat fugiat ut assumenda
-          excepturi exercitationem quasi. In deleniti eaque aut repudiandae et a
-          id nisi.
-        </p>
-        <button class="btn btn-primary">Get Started</button>
-      </div>
-    </div>
-  </div>
-</template>