diff --git a/docs/src/components/ComponentApi.svelte b/docs/src/components/ComponentApi.svelte
index 835d8576..20d85c4f 100644
--- a/docs/src/components/ComponentApi.svelte
+++ b/docs/src/components/ComponentApi.svelte
@@ -31,8 +31,6 @@
.default;
});
- $: console.log(AsyncPreviewTypeScript);
-
const mdn_api = "https://developer.mozilla.org/en-US/docs/Web/API/";
const typeMap = {
string: "string",
@@ -314,7 +312,9 @@
}}
>
{#if full_code_prop}
- Default value for {full_code_prop}.
+
+ Default value for {full_code_prop}.
+
{/if}
{#if full_code}
+
{@html highlightedCode}
{/if}
diff --git a/docs/src/global.css b/docs/src/global.css
index b46622d5..889d6229 100644
--- a/docs/src/global.css
+++ b/docs/src/global.css
@@ -45,6 +45,17 @@ html[theme="g90"] .code-override {
color: #6ea6ff;
}
+/* Override syntax highlighting for light theme inline code .*/
+[theme="white"] .code-override-inline .token,
+[theme="g10"] .code-override-inline .token {
+ color: var(--cds-text-01, #161616);
+}
+
+/** Gray 80 is the "lighted" dark theme. Ensure the background is dark. */
+[theme="g80"] .code-override-inline {
+ background-color: #262626;
+}
+
.token.builtin,
.token.attr-name {
color: #3ddbd9; /* teal 30 */