mirror of
				https://github.com/go-gitea/gitea.git
				synced 2025-11-03 08:02:36 +09:00 
			
		
		
		
	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>
		
			
				
	
	
		
			23 lines
		
	
	
		
			906 B
		
	
	
	
		
			TypeScript
		
	
	
	
	
	
			
		
		
	
	
			23 lines
		
	
	
		
			906 B
		
	
	
	
		
			TypeScript
		
	
	
	
	
	
import {svg} from '../svg.ts';
 | 
						|
import {queryElems} from '../utils/dom.ts';
 | 
						|
 | 
						|
export function makeCodeCopyButton(): HTMLButtonElement {
 | 
						|
  const button = document.createElement('button');
 | 
						|
  button.classList.add('code-copy', 'ui', 'button');
 | 
						|
  button.innerHTML = svg('octicon-copy');
 | 
						|
  return button;
 | 
						|
}
 | 
						|
 | 
						|
export function initMarkupCodeCopy(elMarkup: HTMLElement): void {
 | 
						|
  // .markup .code-block code
 | 
						|
  queryElems(elMarkup, '.code-block code', (el) => {
 | 
						|
    if (!el.textContent) return;
 | 
						|
    const btn = makeCodeCopyButton();
 | 
						|
    // remove final trailing newline introduced during HTML rendering
 | 
						|
    btn.setAttribute('data-clipboard-text', el.textContent.replace(/\r?\n$/, ''));
 | 
						|
    // we only want to use `.code-block-container` if it exists, no matter `.code-block` exists or not.
 | 
						|
    const btnContainer = el.closest('.code-block-container') ?? el.closest('.code-block');
 | 
						|
    btnContainer.append(btn);
 | 
						|
  });
 | 
						|
}
 |