ianhitchman/tiptap
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

add renderless FloatingMenu

Browse Source
This commit is contained in:
Philipp Kühn
2018-11-04 19:46:09 +01:00
parent 41f38e1041
commit d4f6708daa
3 changed files with 57 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
examples/Components/Routes/FloatingMenu/index.vue
View File

@@ -1,7 +1,12 @@
<template>
<div class="editor">
<floating-menu class="editor__floating-menu" :editor="editor">
<template slot-scope="{ commands, isActive }">
<floating-menu :editor="editor">
<div
slot-scope="{ commands, isActive, menu }"
class="editor__floating-menu"
:class="{ 'is-active': menu.isActive }"
:style="`top: ${menu.top}px`"
>
<button
class="menubar__button"
@@ -59,7 +64,7 @@
<icon name="code" />
</button>
</template>
</div>
</floating-menu>
<editor-content class="editor__content" :editor="editor" />
@@ -138,6 +143,11 @@ export default {
visibility: hidden;
opacity: 0;
transition: opacity 0.2s, visibility 0.2s;
&.is-active {
opacity: 1;
visibility: visible;
}
}
}