diff --git a/docs/public/ok-wordmark.svg b/docs/public/ok-wordmark.svg
index d26cb393..57916f42 100644
--- a/docs/public/ok-wordmark.svg
+++ b/docs/public/ok-wordmark.svg
@@ -6,7 +6,7 @@
-
+
diff --git a/docs/src/app/docs/layout.tsx b/docs/src/app/docs/layout.tsx
index 8e9ec722..9e6f15e9 100644
--- a/docs/src/app/docs/layout.tsx
+++ b/docs/src/app/docs/layout.tsx
@@ -4,7 +4,10 @@ import { source } from '@/lib/source';
export default function Layout({ children }: LayoutProps<'/docs'>) {
return (
-
+
{children}
);
diff --git a/docs/src/app/global.css b/docs/src/app/global.css
index 98d17585..95e73a45 100644
--- a/docs/src/app/global.css
+++ b/docs/src/app/global.css
@@ -2,13 +2,64 @@
@import "fumadocs-ui/css/neutral.css";
@import "fumadocs-ui/css/preset.css";
+/* Light docs grays: slightly lighter than Fumadocs default + a very faint
+ warm cast (oklch chroma 0.003 at hue ~80). Cards/secondary get the most
+ visible warmth so the sidebar reads softer. */
+@layer base {
+ :root {
+ --color-fd-background: oklch(0.99 0.002 80);
+ --color-fd-muted: oklch(0.99 0.002 80);
+ --color-fd-popover: oklch(0.995 0.002 80);
+ --color-fd-card: oklch(0.98 0.003 80);
+ --color-fd-secondary: oklch(0.975 0.003 80);
+ }
+}
+
+/* Home-route nav polish: match the page background, give the bar
+ more vertical room than Fumadocs' default h-14, and render the
+ theme-toggle icons as stroke-only Lucide (Fumadocs hardcodes
+ fill="currentColor" so the bundled Sun/Moon read as solid shapes).
+ Scoped to #nd-home-layout so the docs layout keeps Fumadocs defaults. */
+#nd-home-layout {
+ /* Match the taller nav so fixed-position header doesn't overlap content. */
+ padding-top: 5rem;
+}
+#nd-home-layout #nd-nav {
+ background-color: var(--slide-bg);
+ border-bottom-color: transparent;
+}
+/* Soft fade just below the fixed nav so scrolled content doesn't hit a
+ hard edge. Lives outside the nav box so it never sits behind nav text. */
+#nd-home-layout #nd-nav::after {
+ content: "";
+ position: absolute;
+ top: 100%;
+ left: 0;
+ right: 0;
+ height: 2rem;
+ background: linear-gradient(to bottom, var(--slide-bg), transparent);
+ pointer-events: none;
+}
+#nd-home-layout #nd-nav > div > nav {
+ height: 5rem;
+}
+#nd-home-layout #nd-nav [data-theme-toggle] {
+ border-color: var(--slide-border);
+}
+/* Stroke-only Lucide for the theme toggle in both home nav AND docs sidebar.
+ Fumadocs hardcodes fill="currentColor" so the bundled Sun/Moon read solid;
+ resetting fill: none restores the standard Lucide outline look. */
+[data-theme-toggle] svg {
+ fill: none;
+}
+
@layer base {
:root {
--slide-bg: #fbf9f4;
--slide-bg-elevated: #ffffff;
--slide-text: #1a1a1a;
--slide-muted: #71717a;
- --slide-accent: #3685ff;
+ --slide-accent: #3784ff;
/* AA-compliant variant for text on --slide-bg and bg for white text.
--slide-accent fails WCAG 4.5:1 in both contexts (3.35:1 / 3.52:1).
--slide-accent-strong (#1d4ed8) achieves ~6.6:1 on cream and ~6.5:1 on white. */
@@ -21,7 +72,7 @@
--slide-bg-elevated: #171717;
--slide-text: #f0f0ee;
--slide-muted: #a1a1aa;
- --slide-accent: #6b8afa;
+ --slide-accent: #69a3ff;
--slide-accent-strong: #93c5fd;
--slide-border: #27272a;
}
@@ -35,14 +86,15 @@
* driven by Fumadocs `fd-*` tokens in the components themselves.
* ------------------------------------------------------------------ */
.ok-overview {
- --ok-accent: oklch(0.58 0.18 268);
- --ok-accent-ink: oklch(0.45 0.18 268);
- --ok-accent-soft: oklch(0.95 0.035 268);
+ /* Canonical azure — same hex used in packages/app/src/globals.css. */
+ --ok-accent: #3784ff;
+ --ok-accent-ink: #00245d;
+ --ok-accent-soft: #e6efff;
}
.dark .ok-overview {
- --ok-accent: oklch(0.72 0.16 268);
- --ok-accent-ink: oklch(0.8 0.14 268);
- --ok-accent-soft: oklch(0.3 0.07 268);
+ --ok-accent: #69a3ff;
+ --ok-accent-ink: lab(75.6609% 6.56351 -50.5176);
+ --ok-accent-soft: lab(18.1437% 4.66092 -25.0407);
}
/* Vertical spine joining the three layers; the icon chips carry a 5px
diff --git a/docs/src/components/ok-wordmark.tsx b/docs/src/components/ok-wordmark.tsx
new file mode 100644
index 00000000..153c198b
--- /dev/null
+++ b/docs/src/components/ok-wordmark.tsx
@@ -0,0 +1,69 @@
+import type { SVGProps } from 'react';
+
+export function OkWordmark(props: SVGProps) {
+ return (
+
+ );
+}
diff --git a/docs/src/lib/layout.shared.tsx b/docs/src/lib/layout.shared.tsx
index 670e450a..4bcebf6c 100644
--- a/docs/src/lib/layout.shared.tsx
+++ b/docs/src/lib/layout.shared.tsx
@@ -1,15 +1,14 @@
import type { BaseLayoutProps } from 'fumadocs-ui/layouts/shared';
-import Image from 'next/image';
+import { OkWordmark } from '@/components/ok-wordmark';
-export function baseOptions(): BaseLayoutProps {
+export function baseOptions({
+ wordmarkClassName = 'h-8 w-auto text-(--slide-text)',
+}: {
+ wordmarkClassName?: string;
+} = {}): BaseLayoutProps {
return {
nav: {
- title: (
- <>
-
- Open Knowledge
-
- ),
+ title: ,
},
githubUrl: 'https://github.com/inkeep/open-knowledge',
};