Fix conflicting CSS on syntax highlighted blocks (#6991)
Fixes https://github.com/vector-im/element-web/issues/19445
This commit is contained in:
parent
10ed592a55
commit
b16af66fe2
2 changed files with 5 additions and 6 deletions
|
@ -589,10 +589,6 @@ $hover-select-border: 4px;
|
||||||
padding: 0 10px;
|
padding: 0 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mx_EventTile_content .markdown-body .hljs {
|
|
||||||
display: inline !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*
|
/*
|
||||||
// actually, removing the Italic TTF provides
|
// actually, removing the Italic TTF provides
|
||||||
// better results seemingly
|
// better results seemingly
|
||||||
|
|
|
@ -232,7 +232,6 @@ export default class TextualBody extends React.Component<IBodyProps, IState> {
|
||||||
);
|
);
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
console.log('highlighting');
|
|
||||||
|
|
||||||
let advertisedLang;
|
let advertisedLang;
|
||||||
for (const cl of code.className.split(/\s+/)) {
|
for (const cl of code.className.split(/\s+/)) {
|
||||||
|
@ -258,7 +257,11 @@ export default class TextualBody extends React.Component<IBodyProps, IState> {
|
||||||
// User has language detection enabled and the code is within a pre
|
// User has language detection enabled and the code is within a pre
|
||||||
// we only auto-highlight if the code block is in a pre), so highlight
|
// we only auto-highlight if the code block is in a pre), so highlight
|
||||||
// the block with auto-highlighting enabled.
|
// the block with auto-highlighting enabled.
|
||||||
highlight.highlightElement(code);
|
// We pass highlightjs the text to highlight rather than letting it
|
||||||
|
// work on the DOM with highlightElement because that also adds CSS
|
||||||
|
// classes to the pre/code element that we don't want (the CSS
|
||||||
|
// conflicts with our own).
|
||||||
|
code.innerHTML = highlight.highlightAuto(code.textContent).value;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue