jessa
/
inkyboo
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
index.html
View File

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

17
index.js
View File

@ -14,11 +14,12 @@ const init = () => {
const initCodeEditor = () => { const initCodeEditor = () => {
const readOnly = new URLSearchParams(window.location.search).has('readonly'); 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'), { editor = new CodeMirror(document.getElementById('editor'), {
lineNumbers: true, lineNumbers: true,
theme: 'dracula', theme: 'dracula',
readOnly: readOnly readOnly: readOnly,
scrollbarStyle: 'simple'
}); });
if (readOnly) { if (readOnly) {
document.body.classList.add('readonly'); document.body.classList.add('readonly');
@ -110,7 +111,7 @@ const buildUrl = (rawData, mode) => {
return `[paste](${url})`; return `[paste](${url})`;
} }
if (mode === 'iframe') { 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 `<iframe width="100%" height="${height}" frameborder="0" src="${url}"></iframe>`;
} }
return url; return url;
@ -173,4 +174,14 @@ const slugify = str =>
.replace(/#/g, '-sharp') .replace(/#/g, '-sharp')
.replace(/[^\w\-]+/g, ''); .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(); init();

19
style.css
View File

@ -19,7 +19,8 @@
.CodeMirror { .CodeMirror {
height: 100%; height: 100%;
font-size: 13px; font-size: 14px;
font-family: JetBrainsMono, sans-serif;
} }
#footer, #footer,
@ -47,6 +48,11 @@
z-index: 5; z-index: 5;
width: 0; width: 0;
} }
#copy-link {
font-family: JetBrainsMono, sans-serif;
}
.grow { .grow {
flex-grow: 1; flex-grow: 1;
} }
@ -96,3 +102,14 @@ button:hover {
.ss-content .ss-disabled { .ss-content .ss-disabled {
background-color: #3b3b47 !important; 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;
}