mirror of
https://github.com/thomiceli/opengist.git
synced 2025-01-09 10:02:39 +00:00
Syntax highlighting + fix escaping in Markdown code (#29)
This commit is contained in:
parent
1f74affde4
commit
089d321898
2 changed files with 20 additions and 5 deletions
|
@ -1,7 +1,7 @@
|
||||||
|
import 'highlight.js/styles/tokyo-night-dark.css';
|
||||||
import './style.css';
|
import './style.css';
|
||||||
import './markdown.css';
|
import './markdown.css';
|
||||||
import './favicon.svg';
|
import './favicon.svg';
|
||||||
import 'highlight.js/styles/tokyo-night-dark.css';
|
|
||||||
import moment from 'moment';
|
import moment from 'moment';
|
||||||
import md from 'markdown-it';
|
import md from 'markdown-it';
|
||||||
import hljs from 'highlight.js';
|
import hljs from 'highlight.js';
|
||||||
|
@ -31,7 +31,22 @@ document.addEventListener('DOMContentLoaded', () => {
|
||||||
}
|
}
|
||||||
|
|
||||||
document.querySelectorAll('.markdown').forEach((e: HTMLElement) => {
|
document.querySelectorAll('.markdown').forEach((e: HTMLElement) => {
|
||||||
e.innerHTML = md().render(e.innerHTML);
|
e.innerHTML = md({
|
||||||
|
html: true,
|
||||||
|
highlight: function (str, lang) {
|
||||||
|
if (lang && hljs.getLanguage(lang)) {
|
||||||
|
try {
|
||||||
|
console.log(str)
|
||||||
|
console.log(hljs.highlight(str, {language: lang, ignoreIllegals: false}, false));
|
||||||
|
return '<pre class="hljs"><code>' +
|
||||||
|
hljs.highlight(str, { language: lang, ignoreIllegals: true }).value +
|
||||||
|
'</code></pre>';
|
||||||
|
} catch (__) {}
|
||||||
|
}
|
||||||
|
|
||||||
|
return '<pre class="hljs"><code>' + md().utils.escapeHtml(str) + '</code></pre>';
|
||||||
|
}
|
||||||
|
}).render(e.textContent);
|
||||||
});
|
});
|
||||||
|
|
||||||
document.querySelectorAll<HTMLElement>('.table-code').forEach((el) => {
|
document.querySelectorAll<HTMLElement>('.table-code').forEach((el) => {
|
||||||
|
|
4
public/style.css
vendored
4
public/style.css
vendored
|
@ -99,8 +99,8 @@ pre {
|
||||||
max-height: 337px;
|
max-height: 337px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.hljs {
|
.hljs{
|
||||||
background: none !important;
|
color: #c9d1d9;
|
||||||
}
|
}
|
||||||
|
|
||||||
.line-code.selected {
|
.line-code.selected {
|
||||||
|
|
Loading…
Reference in a new issue