docs: migrate to @sentry/starlight-theme (#996)

## Summary

Migrate the CLI docs site from a custom 1900-line dark theme to the
shared `@sentry/starlight-theme` package.

## Changes

### Added
- `@sentry/starlight-theme` — shared Starlight plugin with dark-only
theme, component overrides (Header, Footer, ThemeSelect, Pagination),
and monochrome code highlighting
- `docs/src/styles/cli.css` — slim (~250 lines) of CLI-specific styles
(splash page, feature sections, overscroll easter egg)

### Removed
- `docs/src/styles/custom.css` — 1869 lines of custom dark theme CSS
(now provided by the shared theme)
- `docs/src/components/ThemeProvider.astro` — dark-mode forcing (theme
handles this)
- `docs/src/components/ThemeSelect.astro` — empty theme select (theme
handles this)
- `docs/src/components/Header.astro` — custom header (theme provides its
own)
- `docs/src/components/CodeBlock.astro` — unused
- `docs/src/components/CommandBox.astro` — unused (imported but never
rendered)
- Custom `expressiveCode` config with `github-dark` theme

### Updated
- `astro.config.mjs` — uses `sentryStarlightTheme()` plugin and
`monochromeCodeTheme`
- `@astrojs/starlight` bumped to `^0.39.2` (theme peer dependency)
- `astro` bumped to `^6.3.5`
- `InstallSelector.astro` — uses monochrome theme instead of
`github-dark` for Shiki highlighting
- Component font references updated from hardcoded `'JetBrains Mono'` to
`var(--sl-font-mono)`
- `PageTitle.astro` — uses theme design tokens (`--ve-*`)

### Kept (CLI-specific)
- `InstallSelector`, `PackageManagerCode`, `Terminal`,
`FeatureTerminal`, `FeatureVisual`, `PageTitle` components
- Splash/landing page layout and feature section CSS
- Overscroll easter egg
- Google Fonts (Inter + JetBrains Mono)
- Plausible analytics, OG images
- `@sentry/astro` integration and sourcemap config

## Visual changes expected
- Syntax highlighting switches from `github-dark` to monochrome (shared
theme)
- Header follows shared theme design (GitHub link moves to footer social
links)
- Sidebar, code blocks, tabs, and content styling follow shared theme
defaults
- Overall color palette is very similar (same `#0a0a0f` background, same
`#8b5cf6` purple accent)

## Notes
- The lockfile (`bun.lock`) needs regeneration after merging — run `cd
docs && bun install`
- Visual review of the PR preview is recommended, especially the landing
page and command reference pages

---------

Co-authored-by: sentry-junior[bot] <264270552+sentry-junior[bot]@users.noreply.github.com>
Co-authored-by: Miguel Betegón <miguelbetegongarcia@gmail.com>

Author: sentry-junior[bot]

docs/astro.config.mjs

@@ -1,5 +1,8 @@
 import starlight from "@astrojs/starlight";
 import sentry from "@sentry/astro";
+import sentryStarlightTheme, {
+  monochromeCodeTheme,
+} from "@sentry/starlight-theme";
 import { defineConfig } from "astro/config";
 
 // Allow base path override via environment variable for PR previews
@@ -10,6 +13,9 @@ export default defineConfig({
   base,
   markdown: {
     smartypants: false,
+    shikiConfig: {
+      theme: monochromeCodeTheme,
+    },
   },
   // Generate sourcemaps for Sentry. "hidden" produces .map files without
   // adding //# sourceMappingURL comments to the output (the debug IDs
@@ -52,28 +58,9 @@ export default defineConfig({
           href: "https://github.com/getsentry/cli",
         },
       ],
-      expressiveCode: {
-        themes: ["github-dark"],
-        styleOverrides: {
-          frames: {
-            frameBoxShadowCssValue: "none",
-            editorActiveTabIndicatorTopColor: "transparent",
-            editorActiveTabIndicatorBottomColor: "transparent",
-            editorTabBarBorderBottomColor: "transparent",
-            editorTabBarBackground: "transparent",
-            terminalTitlebarBorderBottomColor: "transparent",
-            terminalTitlebarBackground: "rgba(255, 255, 255, 0.03)",
-            terminalBackground: "#0a0a0f",
-          },
-          borderRadius: "12px",
-          borderColor: "rgba(255, 255, 255, 0.1)",
-          codeBackground: "#0a0a0f",
-        },
-      },
+      plugins: [sentryStarlightTheme()],
       components: {
-        ThemeProvider: "./src/components/ThemeProvider.astro",
         Header: "./src/components/Header.astro",
-        ThemeSelect: "./src/components/ThemeSelect.astro",
         PageTitle: "./src/components/PageTitle.astro",
       },
       head: [
@@ -91,7 +78,7 @@ export default defineConfig({
                 const path = window.location.pathname;
                 // Works with both / (prod) and /pr-preview/pr-XX (preview)
                 return path === '/' || 
-                       /^\\/_preview\\/pr-(\\d+|main)\\/?$/.test(path);
+                       /^\\/\\_preview\\/pr-(\\d+|main)\\/?$/.test(path);
               }
               
               function checkAtBottom() {
@@ -235,7 +222,7 @@ export default defineConfig({
         },
         {
           label: "Commands",
-          autogenerate: { directory: "commands" },
+          items: [{ autogenerate: { directory: "commands" } }],
         },
         {
           label: "Resources",
@@ -245,7 +232,7 @@ export default defineConfig({
           ],
         },
       ],
-      customCss: ["./src/styles/custom.css"],
+      customCss: ["./src/styles/cli.css"],
     }),
   ],
 });

docs/package.json

@@ -8,9 +8,10 @@
     "preview": "astro preview"
   },
   "dependencies": {
-    "@astrojs/starlight": "^0.38.3",
+    "@astrojs/starlight": "^0.39.2",
     "@sentry/astro": "^10.38.0",
-    "astro": "^6.1.8",
+    "@sentry/starlight-theme": "^0.3.0",
+    "astro": "^6.3.5",
     "sharp": "^0.33.5",
     "shiki": "^3.21.0"
   }