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

refactoring

Browse Source
This commit is contained in:
Philipp Kühn
2021-12-16 14:06:35 +01:00
parent 2436e2c8fe
commit 38109831c6
15 changed files with 208 additions and 246 deletions
Download Patch File Download Diff File Expand all files Collapse all files

68
demos/src/Examples/Community/Vue/index.vue
View File

@@ -1,41 +1,39 @@
<template>
<div>
<editor-content :editor="editor" />
<editor-content :editor="editor" />
<div v-if="editor" :class="{'character-count': true, 'character-count--warning': editor.storage.characterCount.characters() === limit}">
<svg
height="20"
width="20"
viewBox="0 0 20 20"
class="character-count__graph"
>
<circle
r="10"
cx="10"
cy="10"
fill="#e9ecef"
/>
<circle
r="5"
cx="10"
cy="10"
fill="transparent"
stroke="currentColor"
stroke-width="10"
:stroke-dasharray="`calc(${percentage} * 31.4 / 100) 31.4`"
transform="rotate(-90) translate(-20)"
/>
<circle
r="6"
cx="10"
cy="10"
fill="white"
/>
</svg>
<div v-if="editor" :class="{'character-count': true, 'character-count--warning': editor.storage.characterCount.characters() === limit}">
<svg
height="20"
width="20"
viewBox="0 0 20 20"
class="character-count__graph"
>
<circle
r="10"
cx="10"
cy="10"
fill="#e9ecef"
/>
<circle
r="5"
cx="10"
cy="10"
fill="transparent"
stroke="currentColor"
stroke-width="10"
:stroke-dasharray="`calc(${percentage} * 31.4 / 100) 31.4`"
transform="rotate(-90) translate(-20)"
/>
<circle
r="6"
cx="10"
cy="10"
fill="white"
/>
</svg>
<div class="character-count__text">
{{ editor.storage.characterCount.characters() }}/{{ limit }} characters
</div>
<div class="character-count__text">
{{ editor.storage.characterCount.characters() }}/{{ limit }} characters
</div>
</div>
</template>