Odoc plugins for jon.recoil.org
Site redesign, new content, blog gen, E2E tests, and build improvements
New blog posts (monopam-madness, open-source-and-ai, weeknotes-2026-10),
notebook showcase with card layout and screenshots, Atom feed generator,
foundations notebook fixes, ONNX test improvements, widget interaction
tests, deploy script updates for oxcaml switch, and .gitignore for
build artifacts.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
+99
-1
+14
src/odoc_jons_plugins.ml
+14
src/odoc_jons_plugins.ml
···
197
197
Html.header
198
198
~a:[ Html.a_class [ "jon-shell-header" ] ]
199
199
[
200
+
Html.button
201
+
~a:
202
+
[
203
+
Html.a_class [ "jon-shell-sidebar-toggle" ];
204
+
Html.a_title "Toggle sidebar";
205
+
]
206
+
[ Html.txt "\xe2\x98\xb0" ];
200
207
Html.a ~a:[ Html.a_href "/" ] [ Html.txt "jon.recoil.org" ];
201
208
Html.nav
202
209
[
···
307
314
Html.header
308
315
~a:[ Html.a_class [ "jon-shell-header" ] ]
309
316
[
317
+
Html.button
318
+
~a:
319
+
[
320
+
Html.a_class [ "jon-shell-sidebar-toggle" ];
321
+
Html.a_title "Toggle sidebar";
322
+
]
323
+
[ Html.txt "\xe2\x98\xb0" ];
310
324
Html.a ~a:[ Html.a_href "/" ] [ Html.txt "jon.recoil.org" ];
311
325
Html.nav
312
326
[
+85
-1
src/odoc_jons_plugins_css.ml
+85
-1
src/odoc_jons_plugins_css.ml
···
89
89
.jon-shell-header {
90
90
display: flex;
91
91
align-items: center;
92
-
justify-content: space-between;
92
+
gap: 12px;
93
93
max-width: calc(var(--max-width) + 300px);
94
94
margin: 0 auto;
95
95
padding: 16px 20px;
···
110
110
.jon-shell-header nav {
111
111
display: flex;
112
112
gap: 20px;
113
+
margin-left: auto;
113
114
}
114
115
115
116
.jon-shell-header nav a {
···
686
687
687
688
.jon-shell-main h1 {
688
689
font-size: 1.6rem;
690
+
}
691
+
}
692
+
/* Sidebar toggle button */
693
+
.jon-shell-sidebar-toggle {
694
+
background: none;
695
+
border: 1px solid var(--border-color);
696
+
border-radius: 4px;
697
+
color: var(--text-muted);
698
+
font-size: 14px;
699
+
cursor: pointer;
700
+
padding: 2px 6px;
701
+
line-height: 1;
702
+
transition: color 0.15s, border-color 0.15s;
703
+
}
704
+
.jon-shell-sidebar-toggle:hover {
705
+
color: var(--link-color);
706
+
border-color: var(--link-color);
707
+
}
708
+
709
+
/* Hidden sidebar state */
710
+
body.sidebar-hidden .jon-shell-sidebar { display: none; }
711
+
712
+
/* ================================================================
713
+
Scrollycode theming
714
+
Maps jon-shell variables to --sc-* custom properties.
715
+
The extension's structural CSS uses these properties for styling.
716
+
================================================================ */
717
+
718
+
/* Theme custom properties — map shell vars to scrollycode contract */
719
+
.sc-container {
720
+
--sc-font-display: var(--font-body);
721
+
--sc-font-body: var(--font-body);
722
+
--sc-font-code: var(--font-mono);
723
+
--sc-bg: var(--bg-color);
724
+
--sc-text: var(--text-color);
725
+
--sc-text-dim: var(--text-muted);
726
+
--sc-accent: var(--link-color);
727
+
--sc-accent-soft: var(--highlight-bg);
728
+
--sc-code-bg: #1a1a2e;
729
+
--sc-code-text: #d4d0c8;
730
+
--sc-code-gutter: #3a3a52;
731
+
--sc-border: var(--border-color);
732
+
--sc-focus-bg: var(--highlight-bg);
733
+
--sc-panel-radius: 12px;
734
+
--sc-mobile-step-bg: rgba(255,255,255,0.5);
735
+
736
+
/* Syntax highlighting */
737
+
--sc-hl-keyword: #f0a6a0;
738
+
--sc-hl-type: #8ec8e8;
739
+
--sc-hl-string: #b8d89a;
740
+
--sc-hl-comment: #6a6a82;
741
+
--sc-hl-number: #ddb97a;
742
+
--sc-hl-module: #e8c87a;
743
+
--sc-hl-operator: #c8a8d8;
744
+
--sc-hl-punct: #7a7a92;
745
+
}
746
+
747
+
/* Hero: centered for jon-shell */
748
+
.sc-container .sc-hero {
749
+
border-bottom: 1px solid var(--sc-border);
750
+
text-align: center;
751
+
}
752
+
.sc-container .sc-hero p {
753
+
margin: 0 auto;
754
+
}
755
+
756
+
/* Dark mode overrides */
757
+
@media (prefers-color-scheme: dark) {
758
+
.sc-container {
759
+
--sc-code-bg: #0f0f18;
760
+
--sc-code-text: #c8c5d8;
761
+
--sc-code-gutter: #2a2a3e;
762
+
--sc-mobile-step-bg: rgba(255,255,255,0.04);
763
+
764
+
/* Dark syntax colors */
765
+
--sc-hl-keyword: #ff7eb3;
766
+
--sc-hl-type: #7dd3fc;
767
+
--sc-hl-string: #4ade80;
768
+
--sc-hl-comment: #4a4a62;
769
+
--sc-hl-number: #fbbf24;
770
+
--sc-hl-module: #c4b5fd;
771
+
--sc-hl-operator: #67e8f9;
772
+
--sc-hl-punct: #4a4a62;
689
773
}
690
774
}
691
775
|}