forked from forgejo/forgejo
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: 
This commit is contained in:
parent
91c8261e2c
commit
704f3aa91c
4 changed files with 33 additions and 31 deletions
|
@ -4,7 +4,8 @@
|
|||
|
||||
.combo-markdown-editor markdown-toolbar {
|
||||
cursor: default;
|
||||
display: block;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
|
||||
|
@ -12,9 +13,21 @@
|
|||
display: flex;
|
||||
}
|
||||
|
||||
.combo-markdown-editor .markdown-toolbar-group:last-child {
|
||||
flex: 1;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.combo-markdown-editor .markdown-toolbar-button {
|
||||
border: none;
|
||||
background: none;
|
||||
user-select: none;
|
||||
padding: 5px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.combo-markdown-editor .markdown-toolbar-button:hover {
|
||||
color: var(--color-primary);
|
||||
}
|
||||
|
||||
.ui.form .combo-markdown-editor textarea.markdown-text-editor,
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue