ami/tl-vikunja
1
0
Fork 0
Code

fix(editor): add icons for clearing marks and nodes

Browse Source
This commit is contained in:
kolaente 2023-06-20 12:09:01 +02:00
parent faf93a6088
commit 8b60e5b2c8
No known key found for this signature in database
GPG Key ID: F40E70337AB24C9B
2 changed files with 14 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
src/components/base/EditorToolbar.vue
View File

@ -150,18 +150,26 @@
</BaseButton> </BaseButton>
</div> </div>
<div class="editor-toolbar__segment">
<BaseButton class="editor-toolbar__button" @click="addImage" title="Add image from URL">
<span class="icon">
<icon icon="fa-image" />
</span>
</BaseButton>
</div>
<div class="editor-toolbar__segment"> <div class="editor-toolbar__segment">
<BaseButton <BaseButton
class="editor-toolbar__button" class="editor-toolbar__button"
@click="editor.chain().focus().unsetAllMarks().run()" @click="editor.chain().focus().unsetAllMarks().run()"
> >
clear marks <icon icon="xmark"/>
</BaseButton> </BaseButton>
<BaseButton <BaseButton
class="editor-toolbar__button" class="editor-toolbar__button"
@click="editor.chain().focus().clearNodes().run()" @click="editor.chain().focus().clearNodes().run()"
> >
clear nodes <icon icon="xmarks-lines"/>
</BaseButton> </BaseButton>
</div> </div>
@ -361,14 +369,6 @@
</BaseButton> </BaseButton>
</div> </div>
</div> </div>
<div class="editor-toolbar__segment">
<BaseButton class="editor-toolbar__button" @click="addImage" title="Add image from URL">
<span class="icon">
<icon icon="fa-image" />
</span>
</BaseButton>
</div>
</div> </div>
</template> </template>
@ -457,7 +457,7 @@ function setLink() {
.editor-toolbar__button { .editor-toolbar__button {
color: var(--grey-700); color: var(--grey-700);
// width: 30px; min-width: 30px;
height: 30px; height: 30px;
border-radius: 3px; border-radius: 3px;
border: 1px solid transparent; border: 1px solid transparent;

4
src/components/misc/Icon.ts
View File

@ -73,7 +73,7 @@ import {
faUnlink, faUnlink,
faParagraph, faParagraph,
faTable, faTable,
faX, faArrowTurnDown, faListCheck, faX, faArrowTurnDown, faListCheck, faXmark, faXmarksLines,
} from '@fortawesome/free-solid-svg-icons' } from '@fortawesome/free-solid-svg-icons'
import { import {
faBellSlash, faBellSlash,
@ -181,6 +181,8 @@ library.add(faAnglesUp)
library.add(faBolt) library.add(faBolt)
library.add(faArrowTurnDown) library.add(faArrowTurnDown)
library.add(faListCheck) library.add(faListCheck)
library.add(faXmark)
library.add(faXmarksLines)
// overwriting the wrong types // overwriting the wrong types
export default FontAwesomeIcon as unknown as FontAwesomeIconFixedTypes export default FontAwesomeIcon as unknown as FontAwesomeIconFixedTypes