Add GitHub Actions workflow for GitHub Pages deployment

Set up automatic deployment to GitHub Pages on push to main branch. Fix TypeScript compilation errors and configure Vite for GitHub Pages hosting.

- Add GitHub Actions workflow (.github/workflows/deploy.yml)
  - Build with pnpm on Node 22
  - Deploy to GitHub Pages using artifacts
- Add vite.config.ts with base URL for GitHub Pages
- Move content.md to public/ folder for static serving
- Fix TypeScript errors:
  - Add optional chaining for parsedContent in main.ts
  - Prefix unused match parameters with underscore in parser.ts
- Add .astro/ to .gitignore

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>

Author: stared

.github/workflows/deploy.yml

@@ -0,0 +1,56 @@
+name: Deploy to GitHub Pages
+
+on:
+  push:
+    branches:
+      - main
+  workflow_dispatch:
+
+permissions:
+  contents: read
+  pages: write
+  id-token: write
+
+concurrency:
+  group: "pages"
+  cancel-in-progress: false
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      - name: Install pnpm
+        uses: pnpm/action-setup@v4
+        with:
+          version: 10.19.0
+
+      - name: Setup Node
+        uses: actions/setup-node@v4
+        with:
+          node-version: 22
+          cache: 'pnpm'
+
+      - name: Install dependencies
+        run: pnpm install
+
+      - name: Build
+        run: pnpm build
+
+      - name: Upload artifact
+        uses: actions/upload-pages-artifact@v3
+        with:
+          path: ./dist
+
+  deploy:
+    environment:
+      name: github-pages
+      url: ${{ steps.deployment.outputs.page_url }}
+    runs-on: ubuntu-latest
+    needs: build
+    steps:
+      - name: Deploy to GitHub Pages
+        id: deployment
+        uses: actions/deploy-pages@v4

.gitignore

@@ -4,6 +4,7 @@ pnpm-lock.yaml
 
 # Build outputs
 dist/
+.astro/
 *.local
 
 # Editor directories and files

public/content.md

@@ -0,0 +1,53 @@
+# Interactive Schrödinger Equation
+
+## Equation
+
+$$
+\mark[imaginary]{i}\mark[planck]{\hbar}\mark[timederiv]{\frac{\partial\psi}{\partial t}} = \mark[kinetic]{-\frac{\hbar^2}{2m}}\mark[spatial]{\frac{\partial^2\psi}{\partial x^2}} + \mark[potential]{V(x)}\mark[wavefunction]{\psi}
+$$
+
+## Description
+
+To understand how a quantum system evolves, multiply the [imaginary unit]{.imaginary} by [Planck constant]{.planck} by [how the wave changes]{.timederiv}. This equals the [energy from motion]{.kinetic} of [how curved the wave is]{.spatial}, plus the [energy from position]{.potential} acting on [the quantum wave]{.wavefunction}.
+
+## .imaginary
+
+Indicates the quantum nature of the equation and ensures unitary time evolution. The imaginary unit $i$ is fundamental to quantum mechanics, distinguishing it from classical physics.
+
+## .planck
+
+Fundamental constant connecting energy and frequency.
+
+**Value:** $\hbar \approx 1.055 \times 10^{-34}$ J·s
+
+This reduced Planck constant sets the scale for quantum effects.
+
+## .timederiv
+
+Rate of change of the wavefunction with respect to time.
+
+This derivative tells us how the quantum state evolves as time progresses.
+
+## .kinetic
+
+Kinetic energy operator coefficient, where $m$ is the particle mass.
+
+The factor $-\frac{\hbar^2}{2m}$ appears in the kinetic energy term of the Hamiltonian.
+
+## .spatial
+
+Second derivative describing spatial curvature of the wavefunction (Laplacian).
+
+Higher curvature corresponds to higher kinetic energy, reflecting the wave-like nature of quantum particles.
+
+## .potential
+
+External potential energy as a function of position.
+
+$V(x)$ represents forces acting on the particle, such as electromagnetic fields or gravitational wells.
+
+## .wavefunction
+
+Complex-valued quantum state describing the particle.
+
+The wavefunction $\psi$ contains all information about the quantum system's state. Its absolute square gives the probability density.

src/main.ts

@@ -80,7 +80,7 @@ function setupHoverEffects() {
 
     // Extract class name (e.g., "term-imaginary" -> "imaginary")
     const className = termClass.replace('term-', '');
-    const definition = parsedContent.definitions.get(className);
+    const definition = parsedContent?.definitions.get(className);
 
     if (!definition) return;
 

src/parser.ts

@@ -45,7 +45,7 @@ export function parseContent(markdown: string): ParsedContent {
     // Parse equation content
     if (inEquation) {
       // Convert \mark[class]{latex} to \htmlClass{term-class}{latex}
-      const converted = line.replace(/\\mark\[([^\]]+)\]\{/g, (match, className) => {
+      const converted = line.replace(/\\mark\[([^\]]+)\]\{/g, (_match, className) => {
         const termClass = `term-${className}`;
         if (!seenTerms.has(className)) {
           termOrder.push(className);
@@ -79,7 +79,7 @@ export function parseContent(markdown: string): ParsedContent {
     // Parse description content
     if (inDescription && line.trim() && !line.startsWith('#')) {
       // Convert [text]{.class} to <span class="term-class">text</span>
-      const converted = line.replace(/\[([^\]]+)\]\{\.([^\}]+)\}/g, (match, text, className) => {
+      const converted = line.replace(/\[([^\]]+)\]\{\.([^\}]+)\}/g, (_match, text, className) => {
         const termClass = `term-${className}`;
         if (!seenTerms.has(className)) {
           termOrder.push(className);

vite.config.ts

@@ -0,0 +1,5 @@
+import { defineConfig } from 'vite';
+
+export default defineConfig({
+  base: '/equations-explained-colorfully/',
+});