fix the content of pre tag overflow the wrap

vuejs · Sep 15, 2024 · 4778bc7 · 4778bc7
1 parent 6ba692a
commit 4778bc7
Showing 1 changed file with 10 additions and 11 deletions.
diff --git a/template/api-examples.md b/template/api-examples.md
@@ -36,23 +36,22 @@ const { site, theme, page, frontmatter } = useData()
 ## Results
 
 ### Theme Data
-<pre>{{ theme }}</pre>
+<div class="language-json">
+  <pre>{{ theme }}</pre>  
+</div>
+
 
 ### Page Data
-<pre>{{ page }}</pre>
+<div class="language-json">
+  <pre>{{ page }}</pre>  
+</div>
 
 ### Page Frontmatter
-<pre>{{ frontmatter }}</pre>
+<div class="language-json">
+  <pre>{{ frontmatter }}</pre>  
+</div>
 
 ## More
 
 Check out the documentation for the [full list of runtime APIs](https://vitepress.dev/reference/runtime-api#usedata).
 
-<style scoped>
-pre {
-  width: 100%;
-  overflow: auto;
-  background-color: var(--vp-code-block-bg);
-  padding: 1em;
-}
-</style>