PrivateCoffee/element-web
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 3

Fix conflicting CSS on syntax highlighted blocks (#6991)

Browse source 
Fixes https://github.com/vector-im/element-web/issues/19445
This commit is contained in:
David Baker 2021-10-19 18:43:29 +01:00 committed by GitHub
parent 0d29626163
commit 01c4d3eede
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 5 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
res/css/views/rooms/_EventTile.scss
View file

@ -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

7
src/components/views/messages/TextualBody.tsx
View file

@ -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;
} }
} }