Add syntax highlight

pull/645/head
Tienson Qin 2020-02-10 16:10:07 +08:00
parent 1969ef0724
commit 050b46dabe
5 changed files with 115 additions and 75 deletions

View File

@ -16,7 +16,7 @@
"@material-ui/icons": "^4.5.1",
"browserfs": "^1.4.3",
"isomorphic-git": "^0.72.0",
"mldoc_org": "^0.0.6",
"mldoc_org": "^0.0.8",
"react": "^16.12.0",
"react-dom": "^16.12.0",
"showdown": "^1.9.1"

100
public/css/highlight.css Normal file
View File

@ -0,0 +1,100 @@
/*
Original highlight.js style (c) Ivan Sagalaev <maniac@softwaremaniacs.org>
*/
.hljs {
display: block;
overflow-x: auto;
padding: 0.5em;
background: #F0F0F0;
}
/* Base color: saturation 0; */
.hljs,
.hljs-subst {
color: #444;
}
.hljs-comment {
color: #888888;
}
.hljs-keyword,
.hljs-attribute,
.hljs-selector-tag,
.hljs-meta-keyword,
.hljs-doctag,
.hljs-name {
font-weight: bold;
}
/* User color: hue: 0 */
.hljs-type,
.hljs-string,
.hljs-number,
.hljs-selector-id,
.hljs-selector-class,
.hljs-quote,
.hljs-template-tag,
.hljs-deletion {
color: #880000;
}
.hljs-title,
.hljs-section {
color: #880000;
font-weight: bold;
}
.hljs-regexp,
.hljs-symbol,
.hljs-variable,
.hljs-template-variable,
.hljs-link,
.hljs-selector-attr,
.hljs-selector-pseudo {
color: #BC6060;
}
/* Language color: hue: 90; */
.hljs-literal {
color: #78A960;
}
.hljs-builtin-name,
.hljs-built_in,
.hljs-bullet,
.hljs-code,
.hljs-addition {
color: #397300;
}
/* Meta color: hue: 200 */
.hljs-meta {
color: #1f7199;
}
.hljs-meta-string {
color: #4d99bf;
}
/* Misc effects */
.hljs-emphasis {
font-style: italic;
}
.hljs-strong {
font-weight: bold;
}

View File

@ -22,70 +22,3 @@
.grow {
flex-grow: 1;
}
.priority {
color: #FFF;
padding: 0px 3px;
font-size: 12px;
border-radius: 2px;
}
.priority-a {
background: red;
}
.priority-b {
background: purple;
}
.priority-c {
background: green;
}
.marker-todo {
}
.marker-doing, .marker-in-progress {
}
.marker-waiting {
}
.marker-done {
color: green;
}
.marker-canceled, .marker-cancelled {
color: #ff4500;
text-decoration: line-through;
}
i {
border: solid black;
border-width: 0 3px 3px 0;
display: inline-block;
padding: 3px;
}
.right {
transform: rotate(-45deg);
-webkit-transform: rotate(-45deg);
}
.left {
transform: rotate(135deg);
-webkit-transform: rotate(135deg);
}
.up {
transform: rotate(-135deg);
-webkit-transform: rotate(-135deg);
}
.down {
transform: rotate(45deg);
-webkit-transform: rotate(45deg);
}

View File

@ -8,6 +8,7 @@
/>
<link rel="stylesheet" href="css/style.css" type="text/css">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap" />
<link rel="stylesheet" href="css/highlight.css">
<title>Gitnotes</title>
</head>
<body>
@ -15,10 +16,16 @@
<script src="https://unpkg.com/@isomorphic-git/lightning-fs"></script>
<script src="https://unpkg.com/isomorphic-git"></script>
<script>
window.fs = new LightningFS('gitnotes')
git.plugins.set('fs', window.fs)
window.pfs = window.fs.promises
window.fs = new LightningFS('gitnotes');
git.plugins.set('fs', window.fs);
window.pfs = window.fs.promises;
</script>
<script src="/js/main.js"></script>
<script src="/js/highlight.pack.js"></script>
<script>
document.querySelectorAll('pre code').forEach((block) => {
hljs.highlightBlock(block);
});
</script>
</body>
</html>

View File

@ -889,10 +889,10 @@ mkdirp@^0.5.1:
dependencies:
minimist "0.0.8"
mldoc_org@^0.0.6:
version "0.0.6"
resolved "https://registry.yarnpkg.com/mldoc_org/-/mldoc_org-0.0.6.tgz#4fe6aeb865a2cce658b44f5a32c353d3857c2d36"
integrity sha512-bWvUkHKEhsLMdl/ZabWCfvHqdXbP36tNYiswzi3UXZDuzJOe+u/yqaw7MeY89FQq2DJmx7P9rTgfY4gR+3kluQ==
mldoc_org@^0.0.8:
version "0.0.8"
resolved "https://registry.yarnpkg.com/mldoc_org/-/mldoc_org-0.0.8.tgz#ca9f85545fc49014c0f5b16f231686d5e3e3f9b1"
integrity sha512-sQtPisy4zC55ko0EWKMbLvA7rIaPZqx5rFq07QYUsRuD7O/Aiix7J3jYo21YfxxA/xq5PXbyS+rPJFSQhPJFFw==
dependencies:
yargs "^12.0.2"