1
1
mirror of https://github.com/go-gitea/gitea synced 2025-07-05 01:57:20 +00:00

markup: improve code block readability and isolate copy button (#34009)

Fix #33197

Improve the rendering of code blocks in markdown content 
for better readability and UI stability across screen sizes.

Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
This commit is contained in:
D
2025-04-19 14:53:39 +09:00
committed by GitHub
parent f0544dbfca
commit eda6d65818
5 changed files with 95 additions and 25 deletions

View File

@ -86,20 +86,15 @@ func (r *GlodmarkRender) highlightingRenderer(w util.BufWriter, c highlighting.C
preClasses += " is-loading"
}
err := r.ctx.RenderInternal.FormatWithSafeAttrs(w, `<pre class="%s">`, preClasses)
if err != nil {
return
}
// include language-x class as part of commonmark spec, "chroma" class is used to highlight the code
// the "display" class is used by "js/markup/math.ts" to render the code element as a block
// the "math.ts" strictly depends on the structure: <pre class="code-block is-loading"><code class="language-math display">...</code></pre>
err = r.ctx.RenderInternal.FormatWithSafeAttrs(w, `<code class="chroma language-%s display">`, languageStr)
err := r.ctx.RenderInternal.FormatWithSafeAttrs(w, `<div class="code-block-container code-overflow-scroll"><pre class="%s"><code class="chroma language-%s display">`, preClasses, languageStr)
if err != nil {
return
}
} else {
_, err := w.WriteString("</code></pre>")
_, err := w.WriteString("</code></pre></div>")
if err != nil {
return
}