Skip to content

Commit ce8fa39

Browse files
amuraruclaude
andcommitted
feat: migrate Hugo theme from Docsy to Hextra
Replaces the google/docsy Hugo module with github.com/imfing/hextra for a modern, batteries-included docs theme with built-in dark mode, FlexSearch full-text search, and native LaTeX/KaTeX support. - config/_default/config.toml rewritten for Hextra's params schema (navbar/theme/footer/editURL/search/highlight), keeping the CI-parsed `version`/`latest_version` fields byte-for-byte compatible with the release-bump and CRD-regen workflows. - Homepage rebuilt with Hextra's hero/feature-card shortcodes in place of Docsy's blocks/cover. - CRD reference page styling (property tree, metadata table, toolbar) ported from Bootstrap SCSS to plain CSS with dark-mode variants via Hextra's assets/css/custom.css hook; the crd-schema.js collapsible/searchable tree is now wired in through Hextra's custom/head-end.html partial hook. - Dropped Docsy-only assets no longer needed (Prism JS/CSS, tocbot, and the page-meta-links/scripts partial overrides that targeted Docsy's template hooks). - Of the 4 site-local shortcodes, xref/warning/include-headless are theme-agnostic and needed no changes; include-code rendered its fallback case as an empty <pre data-src="..."> that relied on Prism's removed File Highlight AJAX plugin to fetch and inject content client-side. It now renders through Hextra's own components/codeblock partial and hextra-code-block wrapper (same as native fenced code blocks), giving server-side Chroma syntax colors, correct spacing, and a copy button instead of an empty box. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
1 parent 45ece91 commit ce8fa39

17 files changed

Lines changed: 459 additions & 647 deletions

File tree

‎assets/css/custom.css‎

Lines changed: 227 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,227 @@
1+
/* Site-specific overrides layered on top of the Hextra theme (see
2+
assets/css/custom.css hook in github.com/imfing/hextra layouts/_partials/head.html). */
3+
4+
.warning-block {
5+
border-left: 6px solid red;
6+
background: #ffffff;
7+
padding: 16px;
8+
}
9+
10+
html.dark .warning-block {
11+
background: #171717;
12+
}
13+
14+
/* CRD reference pages (front matter `layout: crd`, e.g. configurations/crd/*)
15+
render deeply-nested schemas as flat <div class="property depth-N"> blocks
16+
with no styling of their own - give them an indented, card-like tree
17+
instead of an unstyled wall of stacked divs. Collapse/search behavior is
18+
added by static/js/crd-schema.js, hooked in via layouts/partials/custom/head-end.html. */
19+
.property {
20+
border-left: 3px solid #dee2e6;
21+
padding-left: 1rem;
22+
margin: 0.9rem 0;
23+
}
24+
25+
html.dark .property {
26+
border-left-color: #404040;
27+
}
28+
29+
.property.depth-1 { margin-left: 1.1rem; }
30+
.property.depth-2 { margin-left: 2.2rem; }
31+
.property.depth-3 { margin-left: 3.3rem; }
32+
.property.depth-4 { margin-left: 4.4rem; }
33+
.property.depth-5 { margin-left: 5.5rem; }
34+
.property.depth-6 { margin-left: 6.6rem; }
35+
/* Cap indentation beyond depth 6 so deeply-nested fields (this schema goes to
36+
depth 13) don't push content off-screen on narrower viewports. */
37+
.property.depth-7, .property.depth-8, .property.depth-9,
38+
.property.depth-10, .property.depth-11, .property.depth-12, .property.depth-13 {
39+
margin-left: 6.6rem;
40+
}
41+
42+
.property-header h3 {
43+
font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
44+
font-size: 0.95rem;
45+
overflow-wrap: break-word;
46+
margin-bottom: 0.35rem;
47+
}
48+
49+
.property-meta {
50+
display: flex;
51+
flex-wrap: wrap;
52+
align-items: center;
53+
gap: 0.4rem;
54+
margin-bottom: 0.4rem;
55+
}
56+
57+
.property-type {
58+
display: inline-block;
59+
background-color: #e9ecef;
60+
color: #495057;
61+
border-radius: 0.25rem;
62+
padding: 0.1rem 0.5rem;
63+
font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
64+
font-size: 0.8rem;
65+
}
66+
67+
html.dark .property-type {
68+
background-color: #262626;
69+
color: #d4d4d4;
70+
}
71+
72+
.property-required, .property-optional {
73+
display: inline-block;
74+
border-radius: 0.25rem;
75+
padding: 0.1rem 0.5rem;
76+
font-size: 0.72rem;
77+
font-weight: 600;
78+
text-transform: uppercase;
79+
letter-spacing: 0.03em;
80+
}
81+
.property-required {
82+
background-color: #2263bf;
83+
color: white;
84+
}
85+
.property-optional {
86+
background-color: #e9ecef;
87+
color: #495057;
88+
}
89+
90+
html.dark .property-optional {
91+
background-color: #262626;
92+
color: #d4d4d4;
93+
}
94+
95+
.property-description {
96+
color: #495057;
97+
}
98+
99+
html.dark .property-description {
100+
color: #a3a3a3;
101+
}
102+
103+
.property-description p:last-child {
104+
margin-bottom: 0;
105+
}
106+
107+
/* The Full name / Group / Scope / Versions summary at the top of a CRD page. */
108+
.crd-meta {
109+
display: grid;
110+
grid-template-columns: max-content 1fr;
111+
column-gap: 1rem;
112+
row-gap: 0.4rem;
113+
background-color: #f8f9fa;
114+
border: 1px solid #dee2e6;
115+
border-radius: 0.5rem;
116+
padding: 1rem 1.25rem;
117+
margin: 1rem 0 2rem;
118+
}
119+
.crd-meta dt, .crd-meta dd {
120+
margin: 0;
121+
}
122+
.crd-meta dt {
123+
font-weight: 600;
124+
}
125+
126+
html.dark .crd-meta {
127+
background-color: #171717;
128+
border-color: #404040;
129+
}
130+
131+
.crd-toolbar {
132+
display: flex;
133+
flex-wrap: wrap;
134+
align-items: center;
135+
gap: 0.5rem;
136+
margin: 1rem 0 1.5rem;
137+
position: sticky;
138+
top: 0.5rem;
139+
z-index: 1;
140+
background-color: #ffffff;
141+
padding: 0.5rem 0;
142+
}
143+
144+
html.dark .crd-toolbar {
145+
background-color: #111111;
146+
}
147+
148+
.crd-toolbar .crd-search {
149+
flex: 1 1 260px;
150+
padding: 0.4rem 0.6rem;
151+
border: 1px solid #ced4da;
152+
border-radius: 0.25rem;
153+
}
154+
155+
.crd-toolbar button {
156+
padding: 0.4rem 0.8rem;
157+
border: 1px solid #ced4da;
158+
border-radius: 0.25rem;
159+
background-color: #f8f9fa;
160+
cursor: pointer;
161+
}
162+
.crd-toolbar button:hover {
163+
background-color: #e9ecef;
164+
}
165+
166+
html.dark .crd-toolbar .crd-search,
167+
html.dark .crd-toolbar button {
168+
border-color: #404040;
169+
background-color: #171717;
170+
color: inherit;
171+
}
172+
html.dark .crd-toolbar button:hover {
173+
background-color: #262626;
174+
}
175+
176+
.crd-toolbar .crd-search-count {
177+
color: #6c757d;
178+
font-size: 0.85rem;
179+
white-space: nowrap;
180+
}
181+
182+
.property-header.has-children {
183+
cursor: pointer;
184+
user-select: none;
185+
display: flex;
186+
align-items: center;
187+
gap: 0.5rem;
188+
}
189+
190+
.property-header.has-children::before {
191+
content: "\2212";
192+
display: inline-flex;
193+
align-items: center;
194+
justify-content: center;
195+
flex: 0 0 auto;
196+
width: 1.5rem;
197+
height: 1.5rem;
198+
border: 1px solid #ced4da;
199+
border-radius: 50%;
200+
background-color: #f8f9fa;
201+
color: #2263bf;
202+
font-size: 1.1rem;
203+
font-weight: 700;
204+
line-height: 1;
205+
}
206+
.property-header.has-children:hover::before {
207+
background-color: #e9ecef;
208+
}
209+
html.dark .property-header.has-children::before {
210+
border-color: #404040;
211+
background-color: #171717;
212+
}
213+
html.dark .property-header.has-children:hover::before {
214+
background-color: #262626;
215+
}
216+
217+
.property.collapsed > .property-header.has-children::before {
218+
content: "+";
219+
}
220+
221+
.property.js-hidden {
222+
display: none;
223+
}
224+
225+
.main-lead {
226+
line-height: 1.5;
227+
}

0 commit comments

Comments
 (0)