🎉 Gitea Mirror: Added

src/pages/docs/[slug].astro

@@ -0,0 +1,63 @@
+---
+import { getCollection } from 'astro:content';
+import MainLayout from '../../layouts/main.astro';
+
+// Enable prerendering for this dynamic route
+export const prerender = true;
+
+// Generate static paths for all documentation pages
+export async function getStaticPaths() {
+  const docs = await getCollection('docs');
+  return docs.map(entry => ({
+    params: { slug: entry.slug },
+    props: { entry },
+  }));
+}
+
+// Get the documentation entry from props
+const { entry } = Astro.props;
+const { Content } = await entry.render();
+---
+
+<MainLayout title={entry.data.title}>
+  <main class="max-w-5xl mx-auto px-4 py-12">
+    <div class="sticky top-4 z-10 mb-6">
+      <a
+        href="/docs/"
+        class="inline-flex items-center gap-2 px-3 py-1.5 rounded-md bg-card text-foreground hover:bg-muted transition-colors border border-border focus:ring-2 focus:ring-ring outline-none"
+      >
+        <span aria-hidden="true">&larr;</span> Back to Documentation
+      </a>
+    </div>
+    <article class="bg-card rounded-2xl shadow-lg p-6 border border-border">
+      <div class="prose prose-neutral dark:prose-invert prose-code:bg-muted prose-code:text-foreground prose-pre:bg-muted prose-pre:text-foreground prose-pre:rounded-lg prose-pre:p-4 prose-table:rounded-lg prose-table:bg-muted prose-th:text-foreground prose-td:text-muted-foreground prose-blockquote:border-l-4 prose-blockquote:border-muted prose-blockquote:bg-muted/50 prose-blockquote:p-4">
+        <Content />
+      </div>
+    </article>
+    <script type="module">
+      // Mermaid diagram rendering for code blocks
+      import mermaid from 'https://cdn.jsdelivr.net/npm/mermaid@10/dist/mermaid.esm.min.mjs';
+      mermaid.initialize({ startOnLoad: false, theme: document.documentElement.classList.contains('dark') ? 'dark' : 'default' });
+      function renderMermaidDiagrams() {
+        document.querySelectorAll('pre code.language-mermaid').forEach((block, i) => {
+          const parent = block.parentElement;
+          if (!parent) return;
+          const code = block.textContent;
+          const id = `mermaid-diagram-${i}`;
+          const container = document.createElement('div');
+          container.className = 'my-6';
+          container.id = id;
+          parent.replaceWith(container);
+          mermaid.render(id, code, (svgCode) => {
+            container.innerHTML = svgCode;
+          });
+        });
+      }
+      if (document.readyState === 'loading') {
+        document.addEventListener('DOMContentLoaded', renderMermaidDiagrams);
+      } else {
+        renderMermaidDiagrams();
+      }
+    </script>
+  </main>
+</MainLayout>

src/pages/docs/index.astro

@@ -0,0 +1,44 @@
+---
+import { getCollection } from 'astro:content';
+import MainLayout from '../../layouts/main.astro';
+import { LuSettings, LuRocket, LuBookOpen } from 'react-icons/lu';
+
+// Helper to pick an icon based on doc.slug
+// We'll use inline conditional rendering instead of this function
+
+// Get all documentation entries, sorted by order
+const docs = await getCollection('docs');
+const sortedDocs = docs.sort((a, b) => {
+  const orderA = a.data.order || 999;
+  const orderB = b.data.order || 999;
+  return orderA - orderB;
+});
+---
+
+<MainLayout title="Documentation">
+  <main class="max-w-5xl mx-auto px-4 py-12">
+    <h1 class="text-3xl font-bold mb-2 text-center text-foreground">Gitea Mirror Documentation</h1>
+    <p class="mb-10 text-lg text-muted-foreground text-center">Browse guides and technical docs for Gitea Mirror.</p>
+
+    <div class="grid grid-cols-1 md:grid-cols-2 gap-8">
+      {sortedDocs.map(doc => (
+        <a
+          href={`/docs/${doc.slug}`}
+          class="group block p-7 border border-border rounded-2xl bg-card hover:bg-muted transition-colors shadow-lg focus:ring-2 focus:ring-ring outline-none"
+          tabindex="0"
+        >
+          <div class="flex items-center gap-3 mb-2">
+            <div class="w-10 h-10 bg-muted rounded-full flex items-center justify-center text-muted-foreground">
+              {doc.slug === 'architecture' && <LuBookOpen className="w-5 h-5" />}
+              {doc.slug === 'configuration' && <LuSettings className="w-5 h-5" />}
+              {doc.slug === 'quickstart' && <LuRocket className="w-5 h-5" />}
+              {!['architecture', 'configuration', 'quickstart'].includes(doc.slug) && <LuBookOpen className="w-5 h-5" />}
+            </div>
+            <h2 class="text-xl font-semibold group-hover:text-foreground transition">{doc.data.title}</h2>
+          </div>
+          <p class="text-muted-foreground">{doc.data.description}</p>
+        </a>
+      ))}
+    </div>
+  </main>
+</MainLayout>