replace handbook with vitepress

3 files changed, 569 insertions, 0 deletions

diff --git a/174bg/handbook/.vitepress/config.mts b/174bg/handbook/.vitepress/config.mts
new file mode 100644
index 0000000..55e85df
--- /dev/null
+++ b/174bg/handbook/.vitepress/config.mts
@@ -0,0 +1,281 @@
+import { defineConfig } from "vitepress";
+
+export default defineConfig({
+  title: "174th Battle Group Handbook",
+  description: "A guide for members of the 174th Battle Group community.",
+  srcDir: "docs",
+  // The sibling Manager site (174bg/manager) has no light mode at all, so
+  // match it by forcing dark mode here too instead of offering a toggle.
+  appearance: "force-dark",
+
+  head: [
+    ["link", { rel: "preconnect", href: "https://fonts.googleapis.com" }],
+    [
+      "link",
+      {
+        rel: "preconnect",
+        href: "https://fonts.gstatic.com",
+        crossorigin: "",
+      },
+    ],
+    [
+      "link",
+      {
+        rel: "stylesheet",
+        href: "https://fonts.googleapis.com/css2?family=Bai+Jamjuree:wght@400;500;600;700&family=Sora:wght@400;500;600;700&display=swap",
+      },
+    ],
+  ],
+
+  themeConfig: {
+    outline: {
+      level: [2, 3],
+      label: "On this page",
+    },
+
+    search: {
+      provider: "local",
+    },
+
+    nav: [
+      { text: "Organization", link: "/organization/departments" },
+      { text: "Membership", link: "/membership/joining-process" },
+      { text: "Conduct", link: "/conduct/rules-of-engagement" },
+      { text: "Fleet", link: "/fleet/fleet-composition" },
+    ],
+
+    sidebar: [
+      {
+        text: "Introduction",
+        link: "/",
+        items: [
+          { text: "Using This Handbook", link: "/#using-this-handbook" },
+        ],
+      },
+      {
+        text: "Organization",
+        collapsed: false,
+        items: [
+          { text: "Departments", link: "/organization/departments" },
+          {
+            text: "Divisions",
+            link: "/organization/divisions",
+            collapsed: true,
+            items: [
+              {
+                text: "Naval",
+                link: "/organization/divisions#naval-division",
+              },
+              {
+                text: "Marine",
+                link: "/organization/divisions#marine-division",
+              },
+              {
+                text: "Auxiliary",
+                link: "/organization/divisions#auxiliary-division",
+              },
+            ],
+          },
+          {
+            text: "Roles",
+            link: "/organization/roles",
+            collapsed: true,
+            items: [
+              { text: "Naval", link: "/organization/roles#naval-roles" },
+              { text: "Marine", link: "/organization/roles#marine-roles" },
+              {
+                text: "Auxiliary",
+                link: "/organization/roles#auxiliary-roles",
+              },
+            ],
+          },
+          { text: "Ranks", link: "/organization/ranks" },
+          {
+            text: "Command Structure",
+            link: "/organization/command-structure",
+            collapsed: true,
+            items: [
+              {
+                text: "Chain of Command",
+                link: "/organization/command-structure#chain-of-command",
+              },
+              {
+                text: "Operational Authority",
+                link: "/organization/command-structure#operational-authority",
+              },
+              {
+                text: "Decision-Making",
+                link: "/organization/command-structure#decision-making",
+              },
+            ],
+          },
+        ],
+      },
+      {
+        text: "Membership",
+        collapsed: false,
+        items: [
+          {
+            text: "Joining Process",
+            link: "/membership/joining-process",
+            collapsed: true,
+            items: [
+              {
+                text: "Prerequisites",
+                link: "/membership/joining-process#prerequisites",
+              },
+              {
+                text: "Application",
+                link: "/membership/joining-process#application",
+              },
+              {
+                text: "Onboarding",
+                link: "/membership/joining-process#onboarding",
+              },
+              {
+                text: "Probation Period",
+                link: "/membership/joining-process#probation-period",
+              },
+              {
+                text: "Advancing to Rank 1",
+                link: "/membership/joining-process#advancing-to-rank-1",
+              },
+            ],
+          },
+          {
+            text: "Leave of Absence",
+            link: "/membership/leave-of-absence",
+            collapsed: true,
+            items: [
+              {
+                text: "Requesting Leave",
+                link: "/membership/leave-of-absence#requesting-leave",
+              },
+              {
+                text: "Duration",
+                link: "/membership/leave-of-absence#duration",
+              },
+              {
+                text: "Rank During Leave",
+                link: "/membership/leave-of-absence#rank-during-leave",
+              },
+              {
+                text: "Returning from Leave",
+                link: "/membership/leave-of-absence#returning-from-leave",
+              },
+              {
+                text: "Unannounced Absence",
+                link: "/membership/leave-of-absence#unannounced-absence",
+              },
+            ],
+          },
+        ],
+      },
+      {
+        text: "Conduct",
+        collapsed: false,
+        items: [
+          {
+            text: "Rules of Engagement",
+            link: "/conduct/rules-of-engagement",
+            collapsed: true,
+            items: [
+              {
+                text: "Authorised Use of Force",
+                link: "/conduct/rules-of-engagement#authorised-use-of-force",
+              },
+              {
+                text: "Escalation and Warning",
+                link: "/conduct/rules-of-engagement#escalation-and-warning",
+              },
+              {
+                text: "Civilians and Neutrals",
+                link: "/conduct/rules-of-engagement#civilians-and-neutrals",
+              },
+              {
+                text: "Surrendered and Fleeing Enemies",
+                link: "/conduct/rules-of-engagement#surrendered-and-fleeing-enemies",
+              },
+              {
+                text: "Prohibited Actions",
+                link: "/conduct/rules-of-engagement#prohibited-actions",
+              },
+              {
+                text: "Friendly Fire",
+                link: "/conduct/rules-of-engagement#friendly-fire",
+              },
+              {
+                text: "Target Verification",
+                link: "/conduct/rules-of-engagement#target-verification",
+              },
+            ],
+          },
+          {
+            text: "Code of Conduct",
+            link: "/conduct/code-of-conduct",
+            collapsed: true,
+            items: [
+              {
+                text: "Expected Behaviour",
+                link: "/conduct/code-of-conduct#expected-behaviour",
+              },
+              {
+                text: "Disciplinary Process",
+                link: "/conduct/code-of-conduct#disciplinary-process",
+              },
+              {
+                text: "Grounds for Immediate Removal",
+                link: "/conduct/code-of-conduct#grounds-for-immediate-removal",
+              },
+              { text: "Appeals", link: "/conduct/code-of-conduct#appeals" },
+            ],
+          },
+        ],
+      },
+      {
+        text: "Fleet",
+        collapsed: false,
+        items: [
+          {
+            text: "Fleet Composition",
+            link: "/fleet/fleet-composition",
+            collapsed: true,
+            items: [
+              {
+                text: "Design Principles",
+                link: "/fleet/fleet-composition#fleet-design-principles",
+              },
+              {
+                text: "Standard Issue Ships",
+                link: "/fleet/fleet-composition#standard-issue-ships",
+              },
+              {
+                text: "Ship Loadouts",
+                link: "/fleet/fleet-composition#ship-loadouts",
+              },
+            ],
+          },
+          {
+            text: "Gear Loadouts",
+            link: "/fleet/gear-loadouts",
+            collapsed: true,
+            items: [
+              {
+                text: "Marine Loadouts",
+                link: "/fleet/gear-loadouts#marine-loadouts",
+              },
+              {
+                text: "Navy Loadouts",
+                link: "/fleet/gear-loadouts#navy-loadouts",
+              },
+              {
+                text: "Auxiliary Loadouts",
+                link: "/fleet/gear-loadouts#auxiliary-loadouts",
+              },
+            ],
+          },
+        ],
+      },
+    ],
+  },
+});
diff --git a/174bg/handbook/.vitepress/theme/index.ts b/174bg/handbook/.vitepress/theme/index.ts
new file mode 100644
index 0000000..617deeb
--- /dev/null
+++ b/174bg/handbook/.vitepress/theme/index.ts
@@ -0,0 +1,4 @@
+import DefaultTheme from "vitepress/theme";
+import "./style.css";
+
+export default DefaultTheme;
diff --git a/174bg/handbook/.vitepress/theme/style.css b/174bg/handbook/.vitepress/theme/style.css
new file mode 100644
index 0000000..7f01aff
--- /dev/null
+++ b/174bg/handbook/.vitepress/theme/style.css
@@ -0,0 +1,284 @@
+/* Match the source handbook's justified body text, sized to match
+   robertsspaceindustries.com's own paragraph tokens (see style-guide JSON
+   referenced below). RSI's own token says weight 600, but that reads as
+   uncomfortably heavy/bold across a full page of long-form justified text
+   (unlike RSI's own short UI copy) - use normal weight instead. */
+.vp-doc p,
+.vp-doc li {
+  text-align: justify;
+  font-size: 14px;
+  line-height: 21px;
+  letter-spacing: 0.14px;
+  font-weight: 400;
+}
+
+/**
+ * ============================================================================
+ * "HUD" theme - ported from 174bg/manager/public/theme.css so the two
+ * 174bg sites (manager.174bg.net and handbook.174bg.net) share a look: a
+ * near-black backdrop with a faint accent grid + radial glow, Sora
+ * headings/body text, Bai Jamjuree nav/button chrome, and glassy
+ * accent-bordered panels. Manager has no light mode at all, so this is
+ * applied unconditionally (see `appearance: "force-dark"` in config.mts)
+ * rather than scoped to `.dark`.
+ *
+ * 2026-07-13: retinted + refonted to align with robertsspaceindustries.com's
+ * own design tokens (see .gitignored/context.dev/style-guides/
+ * robertspaceindustries.com.json, exported from a CSS Stats scan of the live
+ * site) - a single blue accent (#54adf7) on true black in place of the
+ * earlier arbitrary navy/cyan pairing, Sora/Bai Jamjuree in place of
+ * Orbitron/Rajdhani, flat slate-bordered "card" panels in place of
+ * glass-blur ones, and heading sizes/weights/link treatment matched to
+ * RSI's own type scale.
+ * ============================================================================
+ */
+
+:root {
+  /* Palette retinted to robertsspaceindustries.com's own design tokens - a
+     single blue accent on true black instead of the earlier navy/cyan pair.
+     See .gitignored/context.dev/style-guides/robertspaceindustries.com.json
+     (exported via a CSS Stats scan of the live site) for the source values:
+     accent #54adf7, background #000000, text #ffffff, card border #374151. */
+  --hud-bg: #000000;
+  --hud-bg-grid: rgba(84, 173, 247, 0.05);
+  --hud-panel: rgba(17, 17, 20, 0.75);
+  --hud-panel-solid: #0a0a0c;
+  --hud-panel-border: rgba(55, 65, 81, 0.6);
+  --hud-panel-border-strong: rgba(84, 173, 247, 0.55);
+  --hud-text: #ffffff;
+  --hud-text-dim: #9ca3af;
+  --hud-accent: #54adf7;
+  --hud-accent-2: color-mix(in srgb, var(--hud-accent) 65%, white);
+  --hud-row-alt: rgba(84, 173, 247, 0.04);
+  --hud-shadow-sm: rgba(0, 0, 0, 0.4) 0px 0px 8px 0px;
+
+  /* Map onto VitePress's own theme variables. */
+  --vp-font-family-base: "Sora", system-ui, sans-serif;
+
+  --vp-c-bg: var(--hud-bg);
+  --vp-c-bg-alt: var(--hud-panel-solid);
+  --vp-c-bg-elv: var(--hud-panel-solid);
+  --vp-c-bg-soft: var(--hud-panel-solid);
+
+  --vp-c-border: var(--hud-panel-border);
+  --vp-c-divider: var(--hud-panel-border);
+  --vp-c-gutter: var(--hud-panel-border);
+
+  --vp-c-text-1: var(--hud-text);
+  --vp-c-text-2: var(--hud-text-dim);
+  --vp-c-text-3: var(--hud-text-dim);
+
+  --vp-c-brand-1: var(--hud-accent);
+  --vp-c-brand-2: var(--hud-accent-2);
+  --vp-c-brand-3: var(--hud-accent);
+  --vp-c-brand-soft: rgba(84, 173, 247, 0.16);
+
+  /* VitePress applies these to several nav/sidebar-internal elements (e.g.
+     `.content-body`, the sidebar curtain) directly, not just the outer
+     `.VPNavBar`/`.VPSidebar`. Setting them here (rather than force-overriding
+     just the outer elements with `!important`) keeps every part of the nav
+     bar - including bits VitePress itself makes transparent around the
+     title on wide/sidebar layouts - the same glass color instead of a
+     patchwork of the wrong shade. */
+  --vp-nav-bg-color: var(--hud-panel);
+  --vp-sidebar-bg-color: var(--hud-panel);
+}
+
+/* Faint accent-blue grid + top glow behind the whole site, like the Manager page. */
+html,
+body {
+  background-color: var(--hud-bg);
+  background-image:
+    radial-gradient(
+      ellipse 80% 60% at 50% -10%,
+      rgba(84, 173, 247, 0.18),
+      transparent 60%
+    ),
+    linear-gradient(var(--hud-bg-grid) 1px, transparent 1px),
+    linear-gradient(90deg, var(--hud-bg-grid) 1px, transparent 1px);
+  background-size:
+    100% 100%,
+    44px 44px,
+    44px 44px;
+  background-attachment: fixed;
+}
+
+/* Nav bar and sidebar become frosted glass panels over that grid. Only blur
+   on the outer elements - `.content-body` sits *inside* `.VPNavBar`, so
+   giving it its own `backdrop-filter` too double-blurs the (already blurred)
+   layer beneath it, which compounds into a flat near-black block instead of
+   a translucent panel. */
+.VPNavBar,
+.VPSidebar {
+  backdrop-filter: blur(10px);
+}
+
+.VPNavBar {
+  border-bottom: 1px solid var(--hud-panel-border);
+  box-shadow: var(--hud-shadow-sm);
+}
+
+.VPSidebar {
+  border-right: 1px solid var(--hud-panel-border);
+}
+
+/* Bai Jamjuree for nav/sidebar/table chrome, matching the font
+   robertsspaceindustries.com uses for its own buttons/UI labels. Headings
+   intentionally do NOT get a separate font here - RSI's style guide uses the
+   same family for both headings and paragraphs, so they just inherit
+   --vp-font-family-base (Sora) like the rest of the body copy. */
+.VPNavBarTitle .title,
+.VPNavBarMenuLink,
+.VPSidebarItem.level-0 > .item .text {
+  font-family: "Bai Jamjuree", sans-serif;
+}
+
+.VPNavBarTitle .title {
+  color: var(--hud-accent);
+  /* Bai Jamjuree (like the Orbitron it replaced) is noticeably wider than
+     the default font. VitePress gives the title a fixed-width column
+     matching the sidebar, so shrink the text (and drop the extra
+     letter-spacing) to fit - otherwise it overflows past its column and
+     visually overlaps the search box/nav links next to it on wide
+     (sidebar-visible) layouts. `text-overflow: ellipsis` is a safety net in
+     case it's ever still too wide (e.g. a longer title in the future). */
+  font-size: 0.75rem;
+  letter-spacing: 0.01em;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.VPNavBarMenuLink,
+.VPSidebarItem.level-0 > .item .text {
+  text-transform: uppercase;
+  letter-spacing: 0.04em;
+  font-size: 0.8em;
+}
+
+/* Heading sizes/weights matched to robertsspaceindustries.com's own type
+   scale (h1 64px/72px line-height, h2 24px/29px, h3 20px/24px, h4 18px/22px,
+   all weight 600 - see the style-guide JSON referenced above). The h1
+   gradient-text treatment is kept as a small branding accent (both stops now
+   share RSI's single accent hue instead of the old unrelated navy/cyan
+   pairing); the large colored text-shadow glow was dropped since RSI's own
+   shadow scale has nothing that dramatic - its only real shadow token is a
+   small, black, 8px-blur one (see --hud-shadow-sm above). h2/h3/h4 also drop
+   the uppercase-accent-color treatment in favor of RSI's plain white
+   headings. */
+.vp-doc h1 {
+  font-weight: 600;
+  letter-spacing: 0.01em;
+  line-height: 1.2;
+  font-size: 2.25rem;
+  background: linear-gradient(120deg, var(--hud-accent), var(--hud-accent-2));
+  -webkit-background-clip: text;
+  background-clip: text;
+  color: transparent;
+}
+
+@media (min-width: 768px) {
+  .vp-doc h1 {
+    font-size: 64px;
+    line-height: 72px;
+  }
+}
+
+.vp-doc h2 {
+  font-size: 24px;
+  line-height: 29px;
+  letter-spacing: 0;
+  font-weight: 600;
+}
+
+.vp-doc h3 {
+  font-size: 20px;
+  line-height: 24px;
+  letter-spacing: 0;
+  font-weight: 600;
+}
+
+.vp-doc h4 {
+  font-size: 18px;
+  line-height: 22px;
+  letter-spacing: 0;
+  font-weight: 600;
+}
+
+/* robertsspaceindustries.com's own "link" component is just white text with
+   a permanent underline (not a distinct accent color) - VitePress's default
+   theme already gives .vp-doc a a permanent underline, so this only needs to
+   recolor it (white at rest, accent on hover) rather than reimplementing the
+   underline-on-hover-only treatment this used to have. */
+.vp-doc a:not(.header-anchor) {
+  color: var(--hud-text);
+}
+
+.vp-doc a:not(.header-anchor):hover {
+  color: var(--hud-accent);
+}
+
+/* Ranks table styled like Manager's data tables. */
+.vp-doc table {
+  border-collapse: collapse;
+}
+
+.vp-doc thead th {
+  font-family: "Bai Jamjuree", sans-serif;
+  font-size: 0.68rem;
+  text-transform: uppercase;
+  letter-spacing: 0.08em;
+  color: var(--hud-accent);
+  border-bottom: 2px solid var(--hud-panel-border-strong);
+}
+
+.vp-doc tbody tr:nth-child(even) {
+  background: var(--hud-row-alt);
+}
+
+.vp-doc tbody tr:hover {
+  background: rgba(84, 173, 247, 0.1);
+}
+
+/**
+ * Role "Prerequisites" lists use a `::: info` container. robertsspaceindustries.com's
+ * own "card" component is a flat solid-black panel with a plain slate border
+ * and no blur/shadow (unlike the glass-panel treatment used elsewhere in
+ * this theme) - match that here instead of VitePress's default boxed
+ * callout. VitePress's own `.custom-block` already sets an 8px border-radius,
+ * which happens to match RSI's card radius exactly, so it's left alone.
+ */
+.custom-block.info {
+  background: var(--hud-bg);
+  border: 1px solid var(--hud-panel-border);
+  color: var(--hud-text);
+}
+
+.custom-block.info .custom-block-title {
+  font-family: "Bai Jamjuree", sans-serif;
+  font-size: 0.75rem;
+  text-transform: uppercase;
+  letter-spacing: 0.06em;
+  color: var(--hud-accent);
+}
+
+/**
+ * The local search modal's input row (`.search-bar`) has a border but no
+ * background of its own by default, so it blends into the modal shell
+ * behind it and barely reads as a distinct field. Give it its own panel
+ * shade to match the rest of the HUD chrome.
+ */
+.VPLocalSearchBox .search-bar {
+  background-color: var(--hud-panel-solid);
+}
+
+/**
+ * Same problem for the collapsed search button that sits in the top bar:
+ * VitePress gives it `background-color: var(--vp-c-bg-alt)` (the same solid
+ * navy as the button in the modal) but only adds a visible border on hover,
+ * so at rest it barely stands out against the nav bar's translucent glass
+ * behind it. Add a persistent border to match the rest of the HUD chrome.
+ */
+.DocSearch-Button {
+  border-color: var(--hud-panel-border);
+}