Use external font

master
Boris Kubiak 2020-03-09 15:54:31 +01:00
parent 6c1448774c
commit ec5630a040
3 changed files with 42 additions and 10 deletions

View File

@ -12,18 +12,22 @@
npm/lzma@2.3.2/src/lzma.min.js,
npm/slim-select@1.25.0/dist/slimselect.min.js,
npm/clipboard@2/dist/clipboard.min.js,
npm/codemirror@5.51.0/lib/codemirror.min.js,
npm/codemirror@5.51.0/addon/mode/overlay.min.js,
npm/codemirror@5.51.0/addon/mode/loadmode.min.js,
npm/codemirror@5.51.0/mode/meta.min.js
npm/codemirror@5.52.0,
npm/codemirror@5.52.0/addon/mode/loadmode.min.js,
npm/codemirror@5.52.0/addon/mode/overlay.min.js,
npm/codemirror@5.52.0/addon/mode/multiplex.min.js,
npm/codemirror@5.52.0/addon/mode/simple.min.js,
npm/codemirror@5.52.0/addon/scroll/simplescrollbars.js,
npm/codemirror@5.52.0/mode/meta.min.js
"></script>
<link
rel="stylesheet"
type="text/css"
href="https://cdn.jsdelivr.net/combine/
npm/slim-select@1.25.0/dist/slimselect.min.css,
npm/codemirror@5.51.0/lib/codemirror.min.css,
npm/codemirror@5.51.0/theme/dracula.min.css
npm/codemirror@5.52.0/lib/codemirror.min.css,
npm/codemirror@5.52.0/addon/scroll/simplescrollbars.css,
npm/codemirror@5.52.0/theme/dracula.min.css
"
/>
<link rel="stylesheet" href="style.css" />

View File

@ -14,11 +14,12 @@ const init = () => {
const initCodeEditor = () => {
const readOnly = new URLSearchParams(window.location.search).has('readonly');
CodeMirror.modeURL = 'https://cdn.jsdelivr.net/npm/codemirror@5.51.0/mode/%N/%N.js';
CodeMirror.modeURL = 'https://cdn.jsdelivr.net/npm/codemirror@5.52.0/mode/%N/%N.js';
editor = new CodeMirror(document.getElementById('editor'), {
lineNumbers: true,
theme: 'dracula',
readOnly: readOnly
readOnly: readOnly,
scrollbarStyle: 'simple'
});
if (readOnly) {
document.body.classList.add('readonly');
@ -110,7 +111,7 @@ const buildUrl = (rawData, mode) => {
return `[paste](${url})`;
}
if (mode === 'iframe') {
const height = document.getElementsByClassName('CodeMirror-sizer')[0].scrollHeight;
const height = document.getElementsByClassName('CodeMirror-sizer')[0].clientHeight + 8;
return `<iframe width="100%" height="${height}" frameborder="0" src="${url}"></iframe>`;
}
return url;
@ -173,4 +174,14 @@ const slugify = str =>
.replace(/#/g, '-sharp')
.replace(/[^\w\-]+/g, '');
/* Only for tests purposes */
const testAllModes = () => {
for (const [index, language] of Object.entries(CodeMirror.modeInfo)) {
setTimeout(() => {
console.info(language.name);
select.set(slugify(language.name));
}, 1000 * index);
}
};
init();

View File

@ -19,7 +19,8 @@
.CodeMirror {
height: 100%;
font-size: 13px;
font-size: 14px;
font-family: JetBrainsMono, sans-serif;
}
#footer,
@ -47,6 +48,11 @@
z-index: 5;
width: 0;
}
#copy-link {
font-family: JetBrainsMono, sans-serif;
}
.grow {
flex-grow: 1;
}
@ -96,3 +102,14 @@ button:hover {
.ss-content .ss-disabled {
background-color: #3b3b47 !important;
}
/* Fonts */
@font-face {
font-family: 'JetBrainsMono';
src: url('https://cdn.jsdelivr.net/gh/JetBrains/JetBrainsMono/web/woff2/JetBrainsMono-Regular.woff2')
format('woff2'),
url('https://cdn.jsdelivr.net/gh/JetBrains/JetBrainsMono/web/woff/JetBrainsMono-Regular.woff') format('woff'),
url('https://cdn.jsdelivr.net/gh/JetBrains/JetBrainsMono/ttf/JetBrainsMono-Regular.ttf') format('truetype');
font-weight: 400;
font-style: normal;
}