caojiezi2003/Stackedit
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Added katex extension. Added fonts

Browse Source
This commit is contained in:
benweet 2017-07-26 00:34:01 +01:00
parent 3e94b1b16b
commit 886fa85b45
18 changed files with 177 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
index.html
View File

@ -3,7 +3,6 @@
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<title>my-project</title> <title>my-project</title>
<link href="https://fonts.googleapis.com/css?family=Cabin|Lato:400,400i,900,900i|Libre+Franklin:400,400i,700,700i|Merriweather:400,400i,700,700i|Open+Sans:400,400i,700,700i|Roboto+Mono:400,400i,700,700i|Source+Code+Pro|Source+Sans+Pro:400,400i,700,700i" rel="stylesheet">
</head> </head>
<body> <body>
<div id="app"></div> <div id="app"></div>

2
package.json
View File

@ -14,12 +14,12 @@
"bezier-easing": "^1.1.0", "bezier-easing": "^1.1.0",
"clunderscore": "^1.0.3", "clunderscore": "^1.0.3",
"diff-match-patch": "^1.0.0", "diff-match-patch": "^1.0.0",
"katex": "^0.7.1",
"markdown-it": "^8.3.1", "markdown-it": "^8.3.1",
"markdown-it-abbr": "^1.0.4", "markdown-it-abbr": "^1.0.4",
"markdown-it-deflist": "^2.0.2", "markdown-it-deflist": "^2.0.2",
"markdown-it-emoji": "^1.3.0", "markdown-it-emoji": "^1.3.0",
"markdown-it-footnote": "^3.0.1", "markdown-it-footnote": "^3.0.1",
"markdown-it-mathjax": "^2.0.0",
"markdown-it-pandoc-renderer": "1.1.3", "markdown-it-pandoc-renderer": "1.1.3",
"markdown-it-sub": "^1.0.0", "markdown-it-sub": "^1.0.0",
"markdown-it-sup": "^1.0.0", "markdown-it-sup": "^1.0.0",

BIN
src/assets/fonts/inconsolata-bold.woff Normal file
View File

Binary file not shown.

BIN
src/assets/fonts/inconsolata.woff Normal file
View File

Binary file not shown.

BIN
src/assets/fonts/lato-black-italic.woff Normal file
View File

Binary file not shown.

BIN
src/assets/fonts/lato-black.woff Normal file
View File

Binary file not shown.

BIN
src/assets/fonts/lato-normal-italic.woff Normal file
View File

Binary file not shown.

BIN
src/assets/fonts/lato-normal.woff Normal file
View File

Binary file not shown.

2
src/components/Editor.vue
View File

@ -36,7 +36,7 @@ export default {
word-wrap: break-word; word-wrap: break-word;
* { * {
line-height: 1.65; line-height: $line-height-base;
} }
.cledit-section { .cledit-section {

19
src/components/common/base.scss
View File

@ -1,4 +1,7 @@
@import '../../node_modules/normalize-scss/sass/normalize'; @import '../../node_modules/normalize-scss/sass/normalize';
@import '../../node_modules/katex/dist/katex.css';
@import './variables.scss';
@import './fonts.scss';
@include normalize(); @include normalize();
@ -7,7 +10,7 @@ body {
color: rgba(0, 0, 0, 0.75); color: rgba(0, 0, 0, 0.75);
font-family: $font-family-main; font-family: $font-family-main;
font-variant-ligatures: common-ligatures; font-variant-ligatures: common-ligatures;
line-height: 1.65; line-height: $line-height-base;
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale; -moz-osx-font-smoothing: grayscale;
} }
@ -34,6 +37,8 @@ h4,
h5, h5,
h6 { h6 {
margin: 1.8em 0 1.2em; margin: 1.8em 0 1.2em;
line-height: $line-height-title;
padding: 0.33em 0;
} }
h1, h1,
@ -41,6 +46,18 @@ h2 {
border-bottom: 1px solid $hr-color; border-bottom: 1px solid $hr-color;
} }
h1 {
font-size: 2.2em;
}
h2 {
font-size: 1.6em;
}
h3 {
font-size: 1.22em;
}
ol ul, ol ul,
ul ol, ul ol,
ul ul, ul ul,

41
src/components/common/fonts.scss Normal file
View File

@ -0,0 +1,41 @@
@font-face {
font-family: 'Lato';
font-style: normal;
font-weight: 400;
src: url('../assets/fonts/lato-normal.woff') format('woff');
}
@font-face {
font-family: 'Lato';
font-style: italic;
font-weight: 400;
src: url('../assets/fonts/lato-normal-italic.woff') format('woff');
}
@font-face {
font-family: 'Lato';
font-style: normal;
font-weight: 600;
src: url('../assets/fonts/lato-black.woff') format('woff');
}
@font-face {
font-family: 'Lato';
font-style: italic;
font-weight: 600;
src: url('../assets/fonts/lato-black-italic.woff') format('woff');
}
@font-face {
font-family: 'Inconsolata';
font-style: normal;
font-weight: 400;
src: url('../assets/fonts/inconsolata.woff') format('woff');
}
@font-face {
font-family: 'Inconsolata';
font-style: normal;
font-weight: 600;
src: url('../assets/fonts/inconsolata-bold.woff') format('woff');
}

6
src/components/common/markdownHighlighting.scss
View File

@ -118,12 +118,18 @@
} }
.h1, .h1,
.h11,
.h2, .h2,
.h22,
.h3, .h3,
.h4, .h4,
.h5, .h5,
.h6 { .h6 {
font-weight: $editor-font-weight-bold; font-weight: $editor-font-weight-bold;
* {
line-height: $line-height-title;
}
} }
.h1, .h1,

8
src/components/common/variables.scss
View File

@ -1,6 +1,8 @@
$font-family-main: 'Lato', sans-serif; $font-family-main: Lato, 'Helvetica Neue', Helvetica, sans-serif;
$font-family-monospace: "Lucida Sans Typewriter", "Lucida Console", monaco, Courrier, monospace; $font-family-monospace: Inconsolata, 'Lucida Sans Typewriter', 'Lucida Console', monaco, Courrier, monospace;
$font-size-monospace: 0.85em; $line-height-base: 1.67;
$line-height-title: 1.33;
$font-size-monospace: 0.95em;
$code-bg: rgba(0, 0, 0, 0.05); $code-bg: rgba(0, 0, 0, 0.05);
$code-border-radius: 2px; $code-border-radius: 2px;
$link-color: #4a80cf; $link-color: #4a80cf;

1
src/extensions/index.js
View File

@ -1 +1,2 @@
import './katexExt';
import './markdownExt'; import './markdownExt';

89
src/extensions/katexExt.js Normal file
View File

@ -0,0 +1,89 @@
import katex from 'katex';
import extensionSvc from '../services/extensionSvc';
function texMath(state, silent) {
let startMathPos = state.pos;
if (state.src.charCodeAt(startMathPos) !== 0x24 /* $ */) {
return false;
}
// Parse tex math according to http://pandoc.org/README.html#math
let endMarker = '$';
startMathPos += 1;
const afterStartMarker = state.src.charCodeAt(startMathPos);
if (afterStartMarker === 0x24 /* $ */) {
endMarker = '$$';
startMathPos += 1;
if (state.src.charCodeAt(startMathPos) === 0x24 /* $ */) {
// 3 markers are too much
return false;
}
} else if (
// Skip if opening $ is succeeded by a space character
afterStartMarker === 0x20 /* space */
|| afterStartMarker === 0x09 /* \t */
|| afterStartMarker === 0x0a /* \n */
) {
return false;
}
const endMarkerPos = state.src.indexOf(endMarker, startMathPos);
if (endMarkerPos === -1) {
return false;
}
if (state.src.charCodeAt(endMarkerPos - 1) === 0x5C /* \ */) {
return false;
}
const nextPos = endMarkerPos + endMarker.length;
if (endMarker.length === 1) {
// Skip if $ is preceded by a space character
const beforeEndMarker = state.src.charCodeAt(endMarkerPos - 1);
if (beforeEndMarker === 0x20 /* space */
|| beforeEndMarker === 0x09 /* \t */
|| beforeEndMarker === 0x0a /* \n */) {
return false;
}
// Skip if closing $ is succeeded by a digit (eg $5 $10 ...)
const suffix = state.src.charCodeAt(nextPos);
if (suffix >= 0x30 && suffix < 0x3A) {
return false;
}
}
if (!silent) {
const token = state.push(endMarker.length === 1 ? 'inline_math' : 'display_math', '', 0);
token.content = state.src.slice(startMathPos, endMarkerPos);
}
state.pos = nextPos;
return true;
}
extensionSvc.onGetOptions((options, properties) => {
options.math = properties['ext:katex'] !== 'false';
});
extensionSvc.onInitConverter(2, (markdown, options) => {
if (options.math) {
markdown.use((md) => {
md.inline.ruler.push('texMath', texMath);
});
markdown.renderer.rules.inline_math = (tokens, idx) =>
`<span class="katex--inline">${markdown.utils.escapeHtml(tokens[idx].content)}</span>`;
markdown.renderer.rules.display_math = (tokens, idx) =>
`<span class="katex--display">${markdown.utils.escapeHtml(tokens[idx].content)}</span>`;
}
});
extensionSvc.onSectionPreview((elt) => {
const highlighter = displayMode => (katexElt) => {
if (!katexElt.highlighted) {
try {
katex.render(katexElt.textContent, katexElt, { displayMode });
} catch (e) {
// Ignore
}
}
katexElt.highlighted = true;
};
elt.querySelectorAll('.katex--inline').cl_each(highlighter(false));
elt.querySelectorAll('.katex--display').cl_each(highlighter(true));
});

4
src/markdown/sample.md
View File

@ -151,6 +151,10 @@ GitHub's fenced code blocks are also supported with **Highlight.js** syntax high
var bar = 0; var bar = 0;
``` ```
```js
var foo = 'bar'; // baz
```
> **Tip:** To use **Prettify** instead of **Highlight.js**, just configure the **Markdown Extra** extension in the <i class="icon-cog"></i> **Settings** dialog. > **Tip:** To use **Prettify** instead of **Highlight.js**, just configure the **Markdown Extra** extension in the <i class="icon-cog"></i> **Settings** dialog.
> **Note:** You can find more information: > **Note:** You can find more information:

2
src/services/constants.js
View File

@ -1,3 +1,3 @@
export default { export default {
scrollOffset: 20, scrollOffset: 0,
}; };

10
yarn.lock
View File

@ -3343,6 +3343,12 @@ jsprim@^1.2.2:
json-schema "0.2.3" json-schema "0.2.3"
verror "1.3.6" verror "1.3.6"
katex@^0.7.1:
version "0.7.1"
resolved "https://registry.yarnpkg.com/katex/-/katex-0.7.1.tgz#06bb5298efad05e1e7228035ba8e1591f3061b8f"
dependencies:
match-at "^0.1.0"
kind-of@^2.0.1: kind-of@^2.0.1:
version "2.0.1" version "2.0.1"
resolved "https://registry.yarnpkg.com/kind-of/-/kind-of-2.0.1.tgz#018ec7a4ce7e3a86cb9141be519d24c8faa981b5" resolved "https://registry.yarnpkg.com/kind-of/-/kind-of-2.0.1.tgz#018ec7a4ce7e3a86cb9141be519d24c8faa981b5"
@ -3721,6 +3727,10 @@ markdown-it@^8.3.1:
mdurl "^1.0.1" mdurl "^1.0.1"
uc.micro "^1.0.3" uc.micro "^1.0.3"
match-at@^0.1.0:
version "0.1.0"
resolved "https://registry.yarnpkg.com/match-at/-/match-at-0.1.0.tgz#f561e7709ff9a105b85cc62c6b8ee7c15bf24f31"
math-expression-evaluator@^1.2.14: math-expression-evaluator@^1.2.14:
version "1.2.17" version "1.2.17"
resolved "https://registry.yarnpkg.com/math-expression-evaluator/-/math-expression-evaluator-1.2.17.tgz#de819fdbcd84dccd8fae59c6aeb79615b9d266ac" resolved "https://registry.yarnpkg.com/math-expression-evaluator/-/math-expression-evaluator-1.2.17.tgz#de819fdbcd84dccd8fae59c6aeb79615b9d266ac"