summaryrefslogtreecommitdiffstats
path: root/web_src/js
diff options
context:
space:
mode:
authorwxiaoguang <wxiaoguang@gmail.com>2023-04-11 16:36:18 +0800
committerGitHub <noreply@github.com>2023-04-11 16:36:18 +0800
commit704f3aa91c05aeab7ba18bda62f768ab9233cf6f (patch)
tree4549babe888daf066836f8fe9ae26b3309480a85 /web_src/js
parent91c8261e2cc479af127fb7b1e0803cd0f57d65f7 (diff)
downloadgitea-704f3aa91c05aeab7ba18bda62f768ab9233cf6f.tar.gz
gitea-704f3aa91c05aeab7ba18bda62f768ab9233cf6f.zip
Fine tune markdown editor toolbar (#24046)
1. Remove unnecessary `btn-link` `muted` classes * Link is link, button is button, I can't see a real requirement to make a button like a link. * If anyone insists, please help to show me real example from modern frameworks / websites, how and why they do so. * No need to duplicate a lot of class names on similar elements * Declare styles clearly, for example, `markdown-toolbar` itself should have `display: flex`, but not use `gt-df` to overwrite the `display: block`. 2. Remove unnecessary `role` attribute * https://github.com/github/markdown-toolbar-element/issues/70 * The `markdown-toolbar-element` does want to add `role=button`, but there is a bug. * So we do the similar thing as upstream does (add the role by JS), until they fix their bugs. 3. Indent `markdown-switch-easymde` (before it doesn't have a proper indent) Screenshot: ![image](https://user-images.githubusercontent.com/2114189/231090912-f6ba01cb-d0eb-40ad-bf8c-ffc597d9a778.png)
Diffstat (limited to 'web_src/js')
-rw-r--r--web_src/js/features/comp/ComboMarkdownEditor.js5
1 files changed, 4 insertions, 1 deletions
diff --git a/web_src/js/features/comp/ComboMarkdownEditor.js b/web_src/js/features/comp/ComboMarkdownEditor.js
index 13b28da828..7283dab35c 100644
--- a/web_src/js/features/comp/ComboMarkdownEditor.js
+++ b/web_src/js/features/comp/ComboMarkdownEditor.js
@@ -70,7 +70,10 @@ class ComboMarkdownEditor {
this.textareaMarkdownToolbar = this.container.querySelector('markdown-toolbar');
this.textareaMarkdownToolbar.setAttribute('for', this.textarea.id);
-
+ for (const el of this.textareaMarkdownToolbar.querySelectorAll('.markdown-toolbar-button')) {
+ // upstream bug: The role code is never executed in base MarkdownButtonElement https://github.com/github/markdown-toolbar-element/issues/70
+ el.setAttribute('role', 'button');
+ }
this.switchToEasyMDEButton = this.container.querySelector('.markdown-switch-easymde');
this.switchToEasyMDEButton?.addEventListener('click', async (e) => {
e.preventDefault();