add highlight.js CSS auto-loading to embed modal and code highlighting demos to styleguide

This commit is contained in:
russell@unturf.com 2026-02-24 16:39:18 -05:00
parent 97eb0454ca
commit a70c94e837
2 changed files with 30 additions and 3 deletions

View file

@ -247,6 +247,15 @@ async function openUncloseaiEmbeddedModalNew() {
document.head.appendChild(link);
}
// Load highlight.js CSS for code block syntax highlighting
if (!document.querySelector('link[href*="highlight"]')) {
const hljsLink = document.createElement("link");
hljsLink.rel = "stylesheet";
hljsLink.href =
"https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.10.0/styles/a11y-dark.min.css";
document.head.appendChild(hljsLink);
}
// Ensure ChunkFive font is loaded and text colors are enforced
initializeChunkFiveFont();

View file

@ -553,9 +553,27 @@
<p>Heading scale factor: <code>1.125</code> (major second). h1 through h6 computed via <code>calc(1rem * var(--heading-scale)^n)</code>.</p>
<h3 id="type-code">Code</h3>
<pre><code class="language-javascript">// Example: one-line installation
&lt;script src="https://uncloseai.com/uncloseai.js" type="module"&gt;&lt;/script&gt;</code></pre>
<p>Code blocks use <code>highlight.js</code> with the <code>a11y-dark</code> theme. Inline code uses the default PicoCSS monospace styling.</p>
<p>Code blocks use <code>highlight.js</code> v11.10.0 with the <code>a11y-dark</code> theme. The modal auto-loads this stylesheet on any host page. Inline code uses PicoCSS monospace styling.</p>
<pre><code class="language-javascript">// JavaScript: one-line installation
const script = document.createElement("script");
script.src = "https://uncloseai.com/uncloseai.js";
script.type = "module";
document.head.appendChild(script);</code></pre>
<pre><code class="language-python"># Python: streaming chat with uncloseai
class UncloseAI:
def __init__(self):
self.endpoints = []
def chat_stream(self, model, messages):
for chunk in self._sse_stream(model, messages):
yield chunk["choices"][0]["delta"]["content"]</code></pre>
<pre><code class="language-bash"># Bash: test the TTS endpoint
curl -X POST https://speech.ai.unturf.com/v1/audio/speech \
-H "Content-Type: application/json" \
-d '{"model":"tts-1","voice":"alloy","input":"Hello world"}'</code></pre>
<!-- ============================================ -->
<!-- VAULT GATE -->