Skip to content

Commit 698f722

Browse files
committed
fix: address feedback
Signed-off-by: Will Killian <wkillian@nvidia.com>
1 parent 3be1f2c commit 698f722

5 files changed

Lines changed: 214 additions & 1704 deletions

File tree

fern/components/MermaidStyles.tsx

Lines changed: 201 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,201 @@
1+
/**
2+
* SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.
3+
* SPDX-License-Identifier: Apache-2.0
4+
*/
5+
6+
const mermaidCss = `
7+
:where(.mermaid-container, .mermaid-container-expanded, .mermaid) {
8+
--surface: #ffffff;
9+
--border: #e0e0e0;
10+
--line: #757575;
11+
--text: #000000;
12+
--edge-label-background: #ffffff;
13+
background-color: var(--surface);
14+
border: 1px solid var(--border);
15+
border-radius: 8px;
16+
margin: 1.25rem 0;
17+
overflow: auto;
18+
padding: 1rem;
19+
}
20+
21+
:where(.mermaid-container, .mermaid-container-expanded, .mermaid) svg {
22+
background-color: var(--surface) !important;
23+
color: var(--text);
24+
display: block;
25+
height: auto;
26+
margin: 0 auto;
27+
max-width: 100%;
28+
}
29+
30+
:where(.mermaid-container, .mermaid-container-expanded, .mermaid) svg .node :is(rect, polygon, circle, ellipse, path),
31+
:where(.mermaid-container, .mermaid-container-expanded, .mermaid) svg .cluster rect {
32+
stroke-width: 2px !important;
33+
}
34+
35+
:where(.mermaid-container, .mermaid-container-expanded, .mermaid) svg .edgePath .path,
36+
:where(.mermaid-container, .mermaid-container-expanded, .mermaid) svg .flowchart-link {
37+
stroke: var(--line) !important;
38+
}
39+
40+
:where(.mermaid-container, .mermaid-container-expanded, .mermaid) svg .marker,
41+
:where(.mermaid-container, .mermaid-container-expanded, .mermaid) svg .marker.cross,
42+
:where(.mermaid-container, .mermaid-container-expanded, .mermaid) svg .arrowheadPath {
43+
fill: var(--line) !important;
44+
stroke: var(--line) !important;
45+
}
46+
47+
:where(.mermaid-container, .mermaid-container-expanded, .mermaid) svg .edgeLabel rect,
48+
:where(.mermaid-container, .mermaid-container-expanded, .mermaid) svg .labelBkg {
49+
background-color: var(--edge-label-background) !important;
50+
fill: var(--edge-label-background) !important;
51+
}
52+
53+
:where(.mermaid-container, .mermaid-container-expanded, .mermaid) svg .edgeLabel p {
54+
background-color: var(--edge-label-background) !important;
55+
color: var(--text) !important;
56+
}
57+
58+
.mermaid-container svg .edgeLabel p,
59+
.mermaid-container svg .edgeLabel span.edgeLabel,
60+
.mermaid-container svg .edgeLabel .labelBkg,
61+
.mermaid-container-expanded svg .edgeLabel p,
62+
.mermaid-container-expanded svg .edgeLabel span.edgeLabel,
63+
.mermaid-container-expanded svg .edgeLabel .labelBkg,
64+
.mermaid svg .edgeLabel p {
65+
background-color: var(--edge-label-background) !important;
66+
color: var(--text) !important;
67+
}
68+
69+
.mermaid svg .edgeLabel span.edgeLabel,
70+
.mermaid svg .edgeLabel .labelBkg {
71+
background-color: var(--edge-label-background) !important;
72+
color: var(--text) !important;
73+
}
74+
75+
:where(.mermaid-container, .mermaid-container-expanded, .mermaid) svg .label text,
76+
:where(.mermaid-container, .mermaid-container-expanded, .mermaid) svg .label span,
77+
:where(.mermaid-container, .mermaid-container-expanded, .mermaid) svg .label tspan,
78+
:where(.mermaid-container, .mermaid-container-expanded, .mermaid) svg .nodeLabel,
79+
:where(.mermaid-container, .mermaid-container-expanded, .mermaid) svg .nodeLabel p,
80+
:where(.mermaid-container, .mermaid-container-expanded, .mermaid) svg .cluster-label text,
81+
:where(.mermaid-container, .mermaid-container-expanded, .mermaid) svg .cluster-label span,
82+
:where(.mermaid-container, .mermaid-container-expanded, .mermaid) svg .cluster-label tspan,
83+
:where(.mermaid-container, .mermaid-container-expanded, .mermaid) svg .edgeLabel text,
84+
:where(.mermaid-container, .mermaid-container-expanded, .mermaid) svg .edgeLabel span,
85+
:where(.mermaid-container, .mermaid-container-expanded, .mermaid) svg .edgeLabel tspan,
86+
:where(.mermaid-container, .mermaid-container-expanded, .mermaid) svg .edgeLabel p {
87+
color: var(--text) !important;
88+
fill: var(--text) !important;
89+
}
90+
91+
.mermaid-container svg .edgeLabel :is(text, span, tspan, p),
92+
.mermaid-container-expanded svg .edgeLabel :is(text, span, tspan, p),
93+
.mermaid svg .edgeLabel :is(text, span, tspan, p) {
94+
color: var(--text) !important;
95+
fill: var(--text) !important;
96+
}
97+
98+
:where(.mermaid-container, .mermaid-container-expanded, .mermaid) svg .grey-lightest,
99+
:where(.mermaid-container, .mermaid-container-expanded, .mermaid) svg .grey-hint {
100+
--mermaid-fill: #e0e0e0;
101+
--mermaid-stroke: #a7a7a7;
102+
--mermaid-text: #000000;
103+
}
104+
105+
:where(.mermaid-container, .mermaid-container-expanded, .mermaid) svg .green-lightest {
106+
--mermaid-fill: #cfff40;
107+
--mermaid-stroke: #76b900;
108+
--mermaid-text: #000000;
109+
}
110+
111+
:where(.mermaid-container, .mermaid-container-expanded, .mermaid) svg .yellow-lightest {
112+
--mermaid-fill: #feeeb2;
113+
--mermaid-stroke: #fcde7b;
114+
--mermaid-text: #000000;
115+
}
116+
117+
:where(.mermaid-container, .mermaid-container-expanded, .mermaid) svg .red-lightest {
118+
--mermaid-fill: #ffd7d7;
119+
--mermaid-stroke: #ff8181;
120+
--mermaid-text: #000000;
121+
}
122+
123+
:where(.mermaid-container, .mermaid-container-expanded, .mermaid) svg .magenta-lightest {
124+
--mermaid-fill: #ffd3f2;
125+
--mermaid-stroke: #fc79ca;
126+
--mermaid-text: #000000;
127+
}
128+
129+
:where(.mermaid-container, .mermaid-container-expanded, .mermaid) svg .teal-lightest {
130+
--mermaid-fill: #adfcf8;
131+
--mermaid-stroke: #9aefe5;
132+
--mermaid-text: #000000;
133+
}
134+
135+
:where(.mermaid-container, .mermaid-container-expanded, .mermaid) svg :is(
136+
.grey-lightest, .grey-hint, .green-lightest, .yellow-lightest,
137+
.red-lightest, .magenta-lightest, .teal-lightest
138+
) > * {
139+
color: var(--mermaid-text) !important;
140+
fill: var(--mermaid-fill) !important;
141+
stroke: var(--mermaid-stroke) !important;
142+
}
143+
144+
:where(.mermaid-container, .mermaid-container-expanded, .mermaid) svg :is(
145+
.grey-lightest, .grey-hint, .green-lightest, .yellow-lightest,
146+
.red-lightest, .magenta-lightest, .teal-lightest
147+
) :is(text, tspan, span, p, div, foreignObject) {
148+
color: var(--mermaid-text) !important;
149+
fill: var(--mermaid-text) !important;
150+
}
151+
152+
:where(.dark, html[data-theme="dark"], html[data-mode="dark"]) :where(.mermaid-container, .mermaid-container-expanded, .mermaid) {
153+
--surface: #000000;
154+
--border: #5f5f5f;
155+
--line: #a7a7a7;
156+
--text: #f7f7f7;
157+
--edge-label-background: #000000;
158+
background-color: var(--surface) !important;
159+
}
160+
161+
:where(.dark, html[data-theme="dark"], html[data-mode="dark"]) :where(.mermaid-container, .mermaid-container-expanded, .mermaid) svg .grey-lightest,
162+
:where(.dark, html[data-theme="dark"], html[data-mode="dark"]) :where(.mermaid-container, .mermaid-container-expanded, .mermaid) svg .grey-hint {
163+
--mermaid-fill: #1f1f1f;
164+
--mermaid-stroke: #5f5f5f;
165+
--mermaid-text: #f7f7f7;
166+
}
167+
168+
:where(.dark, html[data-theme="dark"], html[data-mode="dark"]) :where(.mermaid-container, .mermaid-container-expanded, .mermaid) svg .green-lightest {
169+
--mermaid-fill: #265600;
170+
--mermaid-stroke: #76b900;
171+
--mermaid-text: #ffffff;
172+
}
173+
174+
:where(.dark, html[data-theme="dark"], html[data-mode="dark"]) :where(.mermaid-container, .mermaid-container-expanded, .mermaid) svg .yellow-lightest {
175+
--mermaid-fill: #4b2d00;
176+
--mermaid-stroke: #ef9100;
177+
--mermaid-text: #ffffff;
178+
}
179+
180+
:where(.dark, html[data-theme="dark"], html[data-mode="dark"]) :where(.mermaid-container, .mermaid-container-expanded, .mermaid) svg .red-lightest {
181+
--mermaid-fill: #650b0b;
182+
--mermaid-stroke: #ff8181;
183+
--mermaid-text: #ffffff;
184+
}
185+
186+
:where(.dark, html[data-theme="dark"], html[data-mode="dark"]) :where(.mermaid-container, .mermaid-container-expanded, .mermaid) svg .magenta-lightest {
187+
--mermaid-fill: #5d1337;
188+
--mermaid-stroke: #fc79ca;
189+
--mermaid-text: #ffffff;
190+
}
191+
192+
:where(.dark, html[data-theme="dark"], html[data-mode="dark"]) :where(.mermaid-container, .mermaid-container-expanded, .mermaid) svg .teal-lightest {
193+
--mermaid-fill: #04554b;
194+
--mermaid-stroke: #1dbba4;
195+
--mermaid-text: #ffffff;
196+
}
197+
`;
198+
199+
export function MermaidStyles() {
200+
return <style dangerouslySetInnerHTML={{ __html: mermaidCss }} />;
201+
}

fern/docs.yml

Lines changed: 8 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -2,44 +2,18 @@
22
# SPDX-License-Identifier: Apache-2.0
33

44
instances:
5-
- url: nvidia-nemo-relay.docs.buildwithfern.com/nemo-relay
5+
- url: nvidia-nemo-relay.docs.buildwithfern.com/nemo/relay
6+
custom-domain: docs.nvidia.com/nemo/relay
7+
multi-source: true
8+
69
title: NVIDIA NeMo Relay
7-
footer: ./components/CustomFooter.tsx
8-
layout:
9-
searchbar-placement: header
10-
page-width: 1376px
11-
sidebar-width: 248px
12-
content-width: 812px
13-
tabs-placement: header
14-
hide-feedback: true
15-
colors:
16-
accentPrimary:
17-
dark: '#76B900'
18-
light: '#76B900'
19-
background:
20-
light: '#FFFFFF'
21-
dark: '#000000'
22-
theme:
23-
page-actions: toolbar
24-
footer-nav: minimal
25-
logo:
26-
dark: ./assets/NVIDIA_dark.svg
27-
light: ./assets/NVIDIA_light.svg
28-
height: 20
29-
href: /dev
30-
right-text: Documentation
31-
favicon: ./assets/NVIDIA_symbol.svg
32-
js:
33-
- url: https://assets.adobedtm.com/5d4962a43b79/c1061d2c5e7b/launch-191c2462b890.min.js
34-
strategy: beforeInteractive
35-
css:
36-
- ./main.css
37-
navbar-links:
38-
- type: github
39-
value: https://github.com/NVIDIA/NeMo-Relay
10+
11+
global-theme: nvidia
12+
4013
experimental:
4114
mdx-components:
4215
- ./components
16+
4317
products:
4418
- display-name: NeMo Relay
4519
slug: /

fern/fern.config.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
11
{
22
"organization": "nvidia",
3-
"version": "5.37.0"
3+
"version": "5.37.10"
44
}

0 commit comments

Comments
 (0)