From 757d5eb729eb52b54d0f374d543dc0f3f62271e6 Mon Sep 17 00:00:00 2001 From: Jonathan Date: Wed, 18 May 2022 00:54:20 +0200 Subject: [PATCH 01/14] Add keyboard shortcuts for headings --- src/js/easymde.js | 3 +++ 1 file changed, 3 insertions(+) diff --git a/src/js/easymde.js b/src/js/easymde.js index d5dfd21..096b00a 100644 --- a/src/js/easymde.js +++ b/src/js/easymde.js @@ -51,6 +51,9 @@ var shortcuts = { 'drawLink': 'Cmd-K', 'toggleHeadingSmaller': 'Cmd-H', 'toggleHeadingBigger': 'Shift-Cmd-H', + 'toggleHeading1': 'Shift+Alt+1', + 'toggleHeading2': 'Shift+Alt+2', + 'toggleHeading3': 'Shift+Alt+3', 'cleanBlock': 'Cmd-E', 'drawImage': 'Cmd-Alt-I', 'toggleBlockquote': 'Cmd-\'', From 1706b4b0cfbc12d678ae6c0b33abb4d26ef7ceaa Mon Sep 17 00:00:00 2001 From: Jonathan Date: Wed, 18 May 2022 18:35:45 +0200 Subject: [PATCH 02/14] Use Responsive Font Sizes --- src/css/easymde.css | 30 ++++++++++++++++++++++-------- 1 file changed, 22 insertions(+), 8 deletions(-) diff --git a/src/css/easymde.css b/src/css/easymde.css index d7a3249..1412285 100644 --- a/src/css/easymde.css +++ b/src/css/easymde.css @@ -300,23 +300,37 @@ } .cm-s-easymde .cm-header-1 { - font-size: 200%; - line-height: 200%; + font-size: calc(1.375rem + 1.5vw); } .cm-s-easymde .cm-header-2 { - font-size: 160%; - line-height: 160%; + font-size: calc(1.325rem + .9vw); } .cm-s-easymde .cm-header-3 { - font-size: 125%; - line-height: 125%; + font-size: calc(1.3rem + .6vw); } .cm-s-easymde .cm-header-4 { - font-size: 110%; - line-height: 110%; + font-size: calc(1.275rem + .3vw); +} + +.cm-s-easymde .cm-header-5 { + font-size: 1.25rem; +} + +.cm-s-easymde .cm-header-6 { + font-size: 1rem; +} + +.cm-s-easymde .cm-header-1, +.cm-s-easymde .cm-header-2, +.cm-s-easymde .cm-header-3, +.cm-s-easymde .cm-header-4, +.cm-s-easymde .cm-header-5, +.cm-s-easymde .cm-header-6 { + margin-bottom: .5rem; + line-height: 1.2; } .cm-s-easymde .cm-comment { From bed6b493c86bddbb1ba2cab572380e47bfb59f6b Mon Sep 17 00:00:00 2001 From: Jonathan Date: Thu, 19 May 2022 10:14:11 +0200 Subject: [PATCH 03/14] Update easymde.js --- src/js/easymde.js | 3 +++ 1 file changed, 3 insertions(+) diff --git a/src/js/easymde.js b/src/js/easymde.js index 096b00a..9b61484 100644 --- a/src/js/easymde.js +++ b/src/js/easymde.js @@ -54,6 +54,9 @@ var shortcuts = { 'toggleHeading1': 'Shift+Alt+1', 'toggleHeading2': 'Shift+Alt+2', 'toggleHeading3': 'Shift+Alt+3', + 'toggleHeading4': 'Shift+Alt+4', + 'toggleHeading5': 'Shift+Alt+5', + 'toggleHeading6': 'Shift+Alt+6', 'cleanBlock': 'Cmd-E', 'drawImage': 'Cmd-Alt-I', 'toggleBlockquote': 'Cmd-\'', From 38717daffeb1bd3c2f15a8f88c11fb530a4dbe5c Mon Sep 17 00:00:00 2001 From: Jonathan Date: Thu, 19 May 2022 22:49:29 +0200 Subject: [PATCH 04/14] Add support for text buttons --- src/js/easymde.js | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/src/js/easymde.js b/src/js/easymde.js index 639d27c..31273ed 100644 --- a/src/js/easymde.js +++ b/src/js/easymde.js @@ -236,7 +236,11 @@ function createToolbarButton(options, enableActions, enableTooltips, shortcuts, el.setAttribute('type', markup); enableTooltips = (enableTooltips == undefined) ? true : enableTooltips; - // Properly hande custom shortcuts + if (options.text) { + el.innerText = options.text; + } + + // Properly handle custom shortcuts if (options.name && options.name in shortcuts) { bindings[options.name] = options.action; } From 855a5d72f57b81093afa3319e454930cf8c284e7 Mon Sep 17 00:00:00 2001 From: Jonathan Date: Thu, 19 May 2022 22:57:16 +0200 Subject: [PATCH 05/14] Update README.md --- README.md | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/README.md b/README.md index e50c377..d0af330 100644 --- a/README.md +++ b/README.md @@ -355,7 +355,7 @@ const easyMDE = new EasyMDE({ }); ``` -All information and/or add your own icons +All information and/or add your own icons or text ```js const easyMDE = new EasyMDE({ @@ -373,6 +373,7 @@ const easyMDE = new EasyMDE({ // Add your own code }, className: "fa fa-star", + text: "Starred", title: "Custom Button", attributes: { // for custom attributes id: "custom-id", From 5a4af7e38a0cd68851dc8e28c2b42c808e24818a Mon Sep 17 00:00:00 2001 From: Jonathan Date: Sun, 22 May 2022 00:02:10 +0200 Subject: [PATCH 06/14] Update easymde.css --- src/css/easymde.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/css/easymde.css b/src/css/easymde.css index d7a3249..1878b5d 100644 --- a/src/css/easymde.css +++ b/src/css/easymde.css @@ -140,7 +140,7 @@ } .editor-toolbar button { - width: 30px; + min-width: 30px; } .editor-toolbar button.active, From 4714577c36b880aba219bd333f533eb11fa97d73 Mon Sep 17 00:00:00 2001 From: Jonathan Date: Sun, 22 May 2022 11:34:31 +0200 Subject: [PATCH 07/14] Update easymde.js --- src/js/easymde.js | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/src/js/easymde.js b/src/js/easymde.js index 9b61484..52d6d6d 100644 --- a/src/js/easymde.js +++ b/src/js/easymde.js @@ -51,12 +51,12 @@ var shortcuts = { 'drawLink': 'Cmd-K', 'toggleHeadingSmaller': 'Cmd-H', 'toggleHeadingBigger': 'Shift-Cmd-H', - 'toggleHeading1': 'Shift+Alt+1', - 'toggleHeading2': 'Shift+Alt+2', - 'toggleHeading3': 'Shift+Alt+3', - 'toggleHeading4': 'Shift+Alt+4', - 'toggleHeading5': 'Shift+Alt+5', - 'toggleHeading6': 'Shift+Alt+6', + 'toggleHeading1': 'Ctrl+Alt+1', + 'toggleHeading2': 'Ctrl+Alt+2', + 'toggleHeading3': 'Ctrl+Alt+3', + 'toggleHeading4': 'Ctrl+Alt+4', + 'toggleHeading5': 'Ctrl+Alt+5', + 'toggleHeading6': 'Ctrl+Alt+6', 'cleanBlock': 'Cmd-E', 'drawImage': 'Cmd-Alt-I', 'toggleBlockquote': 'Cmd-\'', From f4a02e39a96fdca4e14ee586a53b3e392b0ca14e Mon Sep 17 00:00:00 2001 From: Jonathan Date: Sun, 22 May 2022 11:38:09 +0200 Subject: [PATCH 08/14] Update README.md --- README.md | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/README.md b/README.md index e50c377..479161e 100644 --- a/README.md +++ b/README.md @@ -446,6 +446,12 @@ Shortcut (Windows / Linux) | Shortcut (macOS) | Action Shift-Ctrl-H | Shift-Cmd-H | "toggleHeadingBigger" F9 | F9 | "toggleSideBySide" F11 | F11 | "toggleFullScreen" +Ctrl-Alt-1 | Cmd-Alt-1 | "toggleHeading1" +Ctrl-Alt-2 | Cmd-Alt-2 | "toggleHeading2" +Ctrl-Alt-3 | Cmd-Alt-3 | "toggleHeading3" +Ctrl-Alt-4 | Cmd-Alt-4 | "toggleHeading4" +Ctrl-Alt-5 | Cmd-Alt-5 | "toggleHeading5" +Ctrl-Alt-6 | Cmd-Alt-6 | "toggleHeading6" Here is how you can change a few, while leaving others untouched: From 3cc99e47ae3bfa24d96dbc70b7bdb26981c3a290 Mon Sep 17 00:00:00 2001 From: Jonathan Date: Sun, 22 May 2022 12:04:03 +0200 Subject: [PATCH 09/14] Add ARIA role=application --- src/js/easymde.js | 1 + 1 file changed, 1 insertion(+) diff --git a/src/js/easymde.js b/src/js/easymde.js index 71fda79..1a62474 100644 --- a/src/js/easymde.js +++ b/src/js/easymde.js @@ -2168,6 +2168,7 @@ EasyMDE.prototype.render = function (el) { // to use with sideBySideFullscreen option. var easyMDEContainer = document.createElement('div'); easyMDEContainer.classList.add('EasyMDEContainer'); + easyMDEContainer.setAttribute('role', 'application'); var cmWrapper = this.codemirror.getWrapperElement(); cmWrapper.parentNode.insertBefore(easyMDEContainer, cmWrapper); easyMDEContainer.appendChild(cmWrapper); From b675e611a426c0feeb9122c24089d7e92b17deb3 Mon Sep 17 00:00:00 2001 From: Jonathan Date: Sun, 22 May 2022 12:22:39 +0200 Subject: [PATCH 10/14] Update easymde.css --- src/css/easymde.css | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/src/css/easymde.css b/src/css/easymde.css index 1878b5d..b645f9c 100644 --- a/src/css/easymde.css +++ b/src/css/easymde.css @@ -141,6 +141,7 @@ .editor-toolbar button { min-width: 30px; + white-space: nowrap; } .editor-toolbar button.active, @@ -365,6 +366,10 @@ visibility: visible; } +.easymde-dropdown-content button { + display: block; +} + span[data-img-src]::after { content: ''; /*noinspection CssUnresolvedCustomProperty, added through JS*/ From 7f9ba6abc82ea4635101f780e66282394a414cc8 Mon Sep 17 00:00:00 2001 From: Jonathan Date: Sun, 22 May 2022 17:57:58 +0200 Subject: [PATCH 11/14] Fix inconsistent border color --- src/css/easymde.css | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/src/css/easymde.css b/src/css/easymde.css index d7a3249..c1bbe4b 100644 --- a/src/css/easymde.css +++ b/src/css/easymde.css @@ -15,7 +15,7 @@ .EasyMDEContainer .CodeMirror { box-sizing: border-box; height: auto; - border: 1px solid #ddd; + border: 1px solid #ced4da; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; padding: 10px; @@ -68,9 +68,9 @@ -o-user-select: none; user-select: none; padding: 9px 10px; - border-top: 1px solid #bbb; - border-left: 1px solid #bbb; - border-right: 1px solid #bbb; + border-top: 1px solid #ced4da; + border-left: 1px solid #ced4da; + border-right: 1px solid #ced4da; border-top-left-radius: 4px; border-top-right-radius: 4px; } From eee701ef8638e86956eaade39bd7f1059a25ac1d Mon Sep 17 00:00:00 2001 From: Jonathan Date: Sun, 22 May 2022 18:15:02 +0200 Subject: [PATCH 12/14] Update easymde.js --- src/js/easymde.js | 14 ++++++++------ 1 file changed, 8 insertions(+), 6 deletions(-) diff --git a/src/js/easymde.js b/src/js/easymde.js index 31273ed..5ba1ea0 100644 --- a/src/js/easymde.js +++ b/src/js/easymde.js @@ -283,13 +283,15 @@ function createToolbarButton(options, enableActions, enableTooltips, shortcuts, el.tabIndex = -1; - // Create icon element and append as a child to the button - var icon = document.createElement('i'); - for (var iconClassIndex = 0; iconClassIndex < iconClasses.length; iconClassIndex++) { - var iconClass = iconClasses[iconClassIndex]; - icon.classList.add(iconClass); + if (iconClasses.length > 0) { + // Create icon element and append as a child to the button + var icon = document.createElement('i'); + for (var iconClassIndex = 0; iconClassIndex < iconClasses.length; iconClassIndex++) { + var iconClass = iconClasses[iconClassIndex]; + icon.classList.add(iconClass); + } + el.appendChild(icon); } - el.appendChild(icon); // If there is a custom icon markup set, use that if (typeof options.icon !== 'undefined') { From 2972b280a50d59a2578bca18c6918d6928de673a Mon Sep 17 00:00:00 2001 From: Jonathan Date: Sun, 22 May 2022 18:19:21 +0200 Subject: [PATCH 13/14] Update easymde.css --- src/css/easymde.css | 1 + 1 file changed, 1 insertion(+) diff --git a/src/css/easymde.css b/src/css/easymde.css index b645f9c..760f19d 100644 --- a/src/css/easymde.css +++ b/src/css/easymde.css @@ -140,6 +140,7 @@ } .editor-toolbar button { + font-weight: bold; min-width: 30px; white-space: nowrap; } From 554112b05f5940a452bf11e2d900104c9b1bf4ee Mon Sep 17 00:00:00 2001 From: Jonathan Date: Sun, 22 May 2022 18:25:49 +0200 Subject: [PATCH 14/14] Update easymde.css --- src/css/easymde.css | 1 + 1 file changed, 1 insertion(+) diff --git a/src/css/easymde.css b/src/css/easymde.css index 760f19d..1ec4a0b 100644 --- a/src/css/easymde.css +++ b/src/css/easymde.css @@ -142,6 +142,7 @@ .editor-toolbar button { font-weight: bold; min-width: 30px; + padding: 0 6px; white-space: nowrap; }