fix: codeHieghtLimit frontmatter priority

YunYouJun · Feb 14, 2024 · 5e6b6c2 · 5e6b6c2 · github-actions · Feb 14, 2024
1 parent 47351d5
commit 5e6b6c2
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 6 deletions.
diff --git a/packages/valaxy/client/styles/common/code.scss b/packages/valaxy/client/styles/common/code.scss
@@ -38,10 +38,9 @@ html:not(.dark) .vp-code-dark {
   }
 
   div[class*="language-"] {
-    overflow-y: hidden;
+    overflow: auto hidden;
     position: relative;
     background-color: var(--va-code-block-bg);
-    overflow-x: auto;
   }
 
   [class*='language-'] pre,

diff --git a/packages/valaxy/node/plugins/markdown/plugins/markdown-it/preWrapper.ts b/packages/valaxy/node/plugins/markdown/plugins/markdown-it/preWrapper.ts
@@ -2,6 +2,7 @@
 import type MarkdownIt from 'markdown-it'
 import type { SiteConfig } from 'valaxy/types'
 import type { ThemeOptions } from '../../types'
+import type { MarkdownEnv } from '../../env'
 
 export interface Options {
   hasSingleTheme: boolean
@@ -32,8 +33,9 @@ export function extractTitle(info: string, html = false) {
   return info.match(/\[(.*)\]/)?.[1] || extractLang(info) || 'txt'
 }
 
-function getCodeHeightLimitStyle(options: Options) {
-  const codeHeightLimit = options?.siteConfig?.codeHeightLimit
+function getCodeHeightLimitStyle(options: Options, env: MarkdownEnv) {
+  // frontmatter has higher priority
+  const codeHeightLimit = env.frontmatter?.codeHeightLimit || options?.siteConfig?.codeHeightLimit
   if (codeHeightLimit === undefined || codeHeightLimit <= 0)
     return ''
 
@@ -51,7 +53,7 @@ function getCodeHeightLimitStyle(options: Options) {
 export function preWrapperPlugin(md: MarkdownIt, options: Options) {
   const fence = md.renderer.rules.fence!
   md.renderer.rules.fence = (...args) => {
-    const [tokens, idx] = args
+    const [tokens, idx, _, env] = args
     const token = tokens[idx]
     // remove title from info
     token.info = token.info.replace(/\[.*\]/, '')
@@ -60,7 +62,7 @@ export function preWrapperPlugin(md: MarkdownIt, options: Options) {
     const rawCode = fence(...args)
 
     return `
-    <div ${getCodeHeightLimitStyle(options)} class="language-${lang}${getAdaptiveThemeMarker(options)}${
+    <div ${getCodeHeightLimitStyle(options, env)} class="language-${lang}${getAdaptiveThemeMarker(options)}${
       / active( |$)/.test(token.info) ? ' active' : ''
     }">
       <button title="Copy Code" class="copy"></button><span class="lang">${lang}</span>${rawCode}<button class="collapse"></button>