diff --git a/public/style.css b/public/style.css
index cebccfb23..2866adc9e 100644
--- a/public/style.css
+++ b/public/style.css
@@ -1,27 +1,19 @@
:root {
--theme-background: rgb(255, 255, 255);
--theme-background-alt: rgb(255, 255, 255);
- --theme-foreground: #1C1C1C;
- --theme-foreground-highlight: #001B440D;
+ --theme-foreground: #1c1c1c;
+ --theme-foreground-highlight: rgb(242,244,246);
--theme-foreground-alt: color-mix(in srgb, var(--theme-foreground) 90%, var(--theme-background));
--theme-foreground-muted: color-mix(in srgb, var(--theme-foreground) 70%, var(--theme-background));
--theme-foreground-faint: color-mix(in srgb, var(--theme-foreground) 50%, var(--theme-background));
--theme-foreground-fainter: color-mix(in srgb, var(--theme-foreground) 30%, var(--theme-background));
- --theme-foreground-faintest: #E2E2E2;
- --theme-foreground-focus: #3B5FC0;
+ --theme-foreground-faintest: #e2e2e2;
+ --theme-foreground-focus: #3b5fc0;
--monospace: Menlo, Consolas, monospace;
--monospace-font: 14px/1.5 var(--monospace);
--serif: "Source Serif Pro", "Iowan Old Style", "Apple Garamond", "Palatino Linotype", "Times New Roman", "Droid Serif", Times, serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
--sans-serif: -apple-system, BlinkMacSystemFont, "avenir next", avenir, helvetica, "helvetica neue", ubuntu, roboto, noto, "segoe ui", arial, sans-serif;
color-scheme: light dark;
-
- --black-dark-gray: #454545;
- --black-light-gray: #E2E2E2;
- --black-mid-gray: #6E6E6E;
- --black-near-black: #1C1C1C;
- --black-white: #FFFFFF;
- --blue-blue: #3B5FC0;
-
--down-caret: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath d='M5 7L8.125 9.5L11.25 7' stroke='%23454545' stroke-width='1.5' stroke-linecap='round' fill='none'/%3E%3C/svg%3E");
--sidebar-toggle: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath d='m10.5,11 2.5-3-2.5-3 M6,8h7' fill='none' stroke='%23929292' stroke-width='2'/%3E%3Crect x='2' y='2' fill='%23929292' height='12' rx='.5' width='2'/%3E%3C/svg%3E");
--sidebar-toggle-close: translate(0,-5px) rotate(180deg);
@@ -251,7 +243,7 @@ body {
@media (max-width: calc(640px + 4rem + 272px + 2rem)) {
#observablehq-sidebar-toggle {
- transition: left 300ms ease;
+ transition: left 150ms ease;
}
#observablehq-sidebar-toggle:indeterminate {
top: 0;
@@ -344,7 +336,7 @@ a[href],
}
#observablehq-sidebar {
- transition: left 300ms ease;
+ transition: left 150ms ease;
}
#observablehq-sidebar-backdrop {
diff --git a/src/render.ts b/src/render.ts
index ef998bf6f..052c2e79e 100644
--- a/src/render.ts
+++ b/src/render.ts
@@ -95,7 +95,7 @@ ${renderFooter(path, options)}
}
async function renderSidebar(title = "Home", pages: (Page | Section)[], path: string): Promise {
- return html`
+ return html`