site: copy-friendly code/bibtex blocks + add leaderboard /cite page

reproducibility/site/src/components/CitationCard.astro

@@ -0,0 +1,60 @@
+---
+interface Props {
+  title: string;
+  venue: string;
+  authors: string;
+  bibtex: string;
+  url?: string;
+}
+
+const { title, venue, authors, bibtex, url } = Astro.props;
+---
+
+<article class="qg-card">
+  <div class="qg-pill">{venue}</div>
+  <h3 class="mt-3 text-lg font-semibold">{title}</h3>
+  <p class="mt-1 text-sm text-qg-fg-muted">{authors}</p>
+  {
+    url && (
+      <a
+        class="mt-2 inline-block text-sm font-medium text-qg-accent hover:underline"
+        href={url}
+        target="_blank"
+        rel="noopener noreferrer"
+      >
+        {url} ↗
+      </a>
+    )
+  }
+
+  <div class="mt-4">
+    <div class="flex items-center justify-between rounded-t-md border border-qg-border bg-qg-bg-soft px-3 py-1.5 text-xs text-qg-fg-muted">
+      <span class="qg-mono">BibTeX</span>
+      <button
+        type="button"
+        class="qg-copy-btn rounded border border-qg-border bg-qg-bg px-2 py-0.5 text-xs hover:border-qg-accent"
+      >
+        copy
+      </button>
+    </div>
+    <pre class="whitespace-pre-wrap break-words rounded-b-md border border-t-0 border-qg-border bg-qg-bg p-3 text-xs"><code class="qg-mono">{bibtex}</code></pre>
+  </div>
+</article>
+
+<script>
+  // Reuse the qg-copy-btn convention from CodeBlock; one wiring per page.
+  document.querySelectorAll<HTMLButtonElement>(".qg-copy-btn").forEach((btn) => {
+    if (btn.dataset.qgWired === "1") return;
+    btn.dataset.qgWired = "1";
+    btn.addEventListener("click", () => {
+      const pre = btn.closest("div")?.nextElementSibling as HTMLElement | null;
+      const code = pre?.querySelector("code");
+      if (!code) return;
+      navigator.clipboard.writeText(code.textContent ?? "").then(() => {
+        const original = btn.textContent;
+        btn.textContent = "copied";
+        setTimeout(() => (btn.textContent = original ?? "copy"), 1200);
+      });
+    });
+  });
+</script>

reproducibility/site/src/components/CodeBlock.astro

@@ -0,0 +1,35 @@
+---
+interface Props {
+  language?: string;
+  filename?: string;
+}
+const { language = "bash", filename } = Astro.props;
+---
+
+<div class="overflow-hidden rounded-lg border border-qg-border bg-qg-bg-soft">
+  <div class="flex items-center justify-between border-b border-qg-border bg-qg-bg px-4 py-2 text-xs text-qg-fg-muted">
+    <span class="qg-mono">{filename ?? language}</span>
+    <button
+      type="button"
+      class="qg-copy-btn rounded border border-qg-border bg-qg-bg-soft px-2 py-0.5 text-xs hover:border-qg-accent"
+    >
+      copy
+    </button>
+  </div>
+  <pre class="whitespace-pre-wrap break-words px-4 py-4 text-sm"><code class="qg-mono"><slot /></code></pre>
+</div>
+
+<script>
+  document.querySelectorAll<HTMLButtonElement>(".qg-copy-btn").forEach((btn) => {
+    btn.addEventListener("click", () => {
+      const pre = btn.closest("div")?.nextElementSibling as HTMLElement | null;
+      const code = pre?.querySelector("code");
+      if (!code) return;
+      navigator.clipboard.writeText(code.textContent ?? "").then(() => {
+        const original = btn.textContent;
+        btn.textContent = "copied";
+        setTimeout(() => (btn.textContent = original ?? "copy"), 1200);
+      });
+    });
+  });
+</script>

reproducibility/site/src/layouts/Default.astro

@@ -17,6 +17,7 @@ const navLinks = [
   { label: "Datasets", href: "/datasets/" },
   { label: "Methods", href: "/methods/" },
   { label: "Models", href: "/models/" },
+  { label: "Cite", href: "/cite/" },
   { label: "About", href: "/about" },
   { label: "Toolkit", href: "https://querygym.com", external: true, newTab: true },
 ];

reproducibility/site/src/pages/about.astro

@@ -43,14 +43,8 @@ gh pr create</code></pre>
 
   <section class="mt-10">
     <h2 class="mb-3 text-xl font-semibold">Papers</h2>
-    <ul class="space-y-2 text-sm">
-      <li>
-        <strong>WWW 2026 Demos</strong> — QueryGym toolkit paper.
-        <a class="text-qg-accent hover:underline" href="https://arxiv.org/abs/2511.15996" target="_blank" rel="noopener noreferrer">arXiv 2511.15996 ↗</a>
-      </li>
-      <li>
-        <strong>SIGIR 2026 Reproducibility Track</strong> — multi-LLM baseline reproduction (link TBD).
-      </li>
-    </ul>
+    <p class="text-sm text-qg-fg-muted">
+      Two papers back QueryGym. See <a class="text-qg-accent hover:underline" href="/cite/">the Cite page</a> for BibTeX entries you can paste into your bibliography.
+    </p>
   </section>
 </Default>

reproducibility/site/src/pages/cite.astro

@@ -0,0 +1,53 @@
+---
+import Default from "../layouts/Default.astro";
+import CitationCard from "../components/CitationCard.astro";
+
+const wwwBibtex = `@misc{bigdeli2025querygymtoolkitreproduciblellmbased,
+  title={QueryGym: A Toolkit for Reproducible LLM-Based Query Reformulation},
+  author={Amin Bigdeli and Radin Hamidi Rad and Mert Incesu and Negar Arabzadeh and Charles L. A. Clarke and Ebrahim Bagheri},
+  year={2025},
+  eprint={2511.15996},
+  archivePrefix={arXiv},
+  primaryClass={cs.IR},
+  url={https://arxiv.org/abs/2511.15996},
+}`;
+
+const sigirBibtex = `@inproceedings{querygym2026reproducibility,
+  title={Reproducing LLM-Based Query Reformulation Across Backends with QueryGym},
+  author={Amin Bigdeli and Radin Hamidi Rad and Mert Incesu and Negar Arabzadeh and Charles L. A. Clarke and Ebrahim Bagheri},
+  booktitle={Proceedings of the 49th International ACM SIGIR Conference on Research and Development in Information Retrieval},
+  series={SIGIR '26},
+  year={2026},
+  note={Reproducibility Track},
+}`;
+---
+
+<Default
+  title="Cite"
+  description="How to cite QueryGym in research papers — BibTeX for the WWW 2026 Demos paper and the SIGIR 2026 Reproducibility Track paper."
+>
+  <section class="!py-4">
+    <h1 class="text-3xl font-bold md:text-4xl">Cite QueryGym</h1>
+    <p class="mt-3 max-w-2xl text-qg-fg-muted">
+      Two papers back QueryGym. Use the toolkit citation if you're using the
+      library; add the reproducibility citation if you're referring to the
+      SIGIR 2026 leaderboard numbers.
+    </p>
+
+    <div class="mt-8 grid gap-4 md:grid-cols-2">
+      <CitationCard
+        title="QueryGym: A Toolkit for Reproducible LLM-Based Query Reformulation"
+        venue="WWW 2026 — Demos"
+        authors="Bigdeli, Hamidi Rad, Incesu, Arabzadeh, Clarke, Bagheri"
+        bibtex={wwwBibtex}
+        url="https://arxiv.org/abs/2511.15996"
+      />
+      <CitationCard
+        title="Reproducing LLM-Based Query Reformulation Across Backends with QueryGym"
+        venue="SIGIR 2026 — Reproducibility Track"
+        authors="Bigdeli, Hamidi Rad, Incesu, Arabzadeh, Clarke, Bagheri"
+        bibtex={sigirBibtex}
+      />
+    </div>
+  </section>
+</Default>

reproducibility/site/src/styles/global.css

@@ -2,3 +2,12 @@
 @tailwind base;
 @tailwind components;
 @tailwind utilities;
+
+@layer components {
+  .qg-pill {
+    @apply inline-flex items-center gap-1 rounded-full border border-qg-border bg-qg-bg-soft px-3 py-1 text-xs font-medium text-qg-fg-muted;
+  }
+  .qg-card {
+    @apply rounded-xl border border-qg-border bg-qg-bg-soft p-6 transition hover:border-qg-accent;
+  }
+}

web/site/src/components/CitationCard.astro

@@ -28,11 +28,33 @@ const { title, venue, authors, bibtex, url } = Astro.props;
   }
 
   <div class="mt-4">
-    <details>
-      <summary class="cursor-pointer text-sm font-medium text-qg-fg-muted hover:text-qg-fg">
-        BibTeX
-      </summary>
-      <pre class="mt-2 overflow-x-auto rounded bg-qg-bg p-3 text-xs"><code>{bibtex}</code></pre>
-    </details>
+    <div class="flex items-center justify-between rounded-t-md border border-qg-border bg-qg-bg-soft px-3 py-1.5 text-xs text-qg-fg-muted">
+      <span class="qg-mono">BibTeX</span>
+      <button
+        type="button"
+        class="qg-copy-btn rounded border border-qg-border bg-qg-bg px-2 py-0.5 text-xs hover:border-qg-accent"
+      >
+        copy
+      </button>
+    </div>
+    <pre class="whitespace-pre-wrap break-words rounded-b-md border border-t-0 border-qg-border bg-qg-bg p-3 text-xs"><code class="qg-mono">{bibtex}</code></pre>
   </div>
 </article>
+
+<script>
+  // Reuse the qg-copy-btn convention from CodeBlock; one wiring per page.
+  document.querySelectorAll<HTMLButtonElement>(".qg-copy-btn").forEach((btn) => {
+    if (btn.dataset.qgWired === "1") return;
+    btn.dataset.qgWired = "1";
+    btn.addEventListener("click", () => {
+      const pre = btn.closest("div")?.nextElementSibling as HTMLElement | null;
+      const code = pre?.querySelector("code");
+      if (!code) return;
+      navigator.clipboard.writeText(code.textContent ?? "").then(() => {
+        const original = btn.textContent;
+        btn.textContent = "copied";
+        setTimeout(() => (btn.textContent = original ?? "copy"), 1200);
+      });
+    });
+  });
+</script>

web/site/src/components/CodeBlock.astro

@@ -16,7 +16,7 @@ const { language = "bash", filename } = Astro.props;
       copy
     </button>
   </div>
-  <pre class="overflow-x-auto px-4 py-4 text-sm"><code class="qg-mono"><slot /></code></pre>
+  <pre class="whitespace-pre-wrap break-words px-4 py-4 text-sm"><code class="qg-mono"><slot /></code></pre>
 </div>
 
 <script>