microsoft/vscode
1
0
Fork 0
mirror of https://github.com/microsoft/vscode.git synced 2026-04-28 01:49:55 -05:00
Code Issues Packages Projects Releases 177 Wiki Activity

Use templates for markdown styles

Browse Source 
These styles shouldn't be added into the notebook itself, only into the shadow dom of the markdown cells
This commit is contained in:
Matt Bierner
2021-06-09 15:15:48 -07:00
parent 52ea1fd44e
commit bc14fe9e8d
2 changed files with 17 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
extensions/markdown-language-features/notebook/index.ts
View File

@@ -11,7 +11,6 @@ export function activate() {
});
const style = document.createElement('style');
style.classList.add('markdown-style');
style.textContent = `
.emptyMarkdownCell::before {
content: "${document.documentElement.style.getPropertyValue('--notebook-cell-markup-empty-content')}";
@@ -134,7 +133,10 @@ export function activate() {
white-space: pre-wrap;
}
`;
document.head.append(style);
const template = document.createElement('template');
template.classList.add('markdown-style');
template.content.appendChild(style);
document.head.appendChild(template);
return {
renderOutputItem: (outputInfo: { text(): string }, element: HTMLElement) => {
@@ -148,8 +150,12 @@ export function activate() {
previewRoot.appendChild(defaultStyles.cloneNode(true));
// And then contributed styles
for (const markdownStyleNode of document.getElementsByClassName('markdown-style')) {
previewRoot.appendChild(markdownStyleNode.cloneNode(true));
for (const element of document.getElementsByClassName('markdown-style')) {
if (element instanceof HTMLTemplateElement) {
previewRoot.appendChild(element.content.cloneNode(true));
} else {
previewRoot.appendChild(element.cloneNode(true));
}
}
previewNode = document.createElement('div');

10
extensions/markdown-math/notebook/katex.ts
View File

@@ -18,16 +18,20 @@ export async function activate(ctx: {
link.rel = 'stylesheet';
link.classList.add('markdown-style');
link.href = styleHref;
document.head.append(link);
const style = document.createElement('style');
style.classList.add('markdown-style');
style.textContent = `
.katex-error {
color: var(--vscode-editorError-foreground);
}
`;
document.head.append(style);
// Put Everything into a template
const styleTemplate = document.createElement('template');
styleTemplate.classList.add('markdown-style');
styleTemplate.content.appendChild(style);
styleTemplate.content.appendChild(link);
document.head.appendChild(styleTemplate);
const katex = require('@iktakahiro/markdown-it-katex');
markdownItRenderer.extendMarkdownIt((md: markdownIt.MarkdownIt) => {