diff --git a/index.html b/index.html
index c8a36f2..a0ff99b 100644
--- a/index.html
+++ b/index.html
@@ -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
">
diff --git a/index.js b/index.js
index 0028c0e..f8178f0 100644
--- a/index.js
+++ b/index.js
@@ -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 ``;
}
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();
diff --git a/style.css b/style.css
index ce248b7..d4f13cb 100644
--- a/style.css
+++ b/style.css
@@ -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;
+}