ql readonly

This commit is contained in:
SvyatoslavArtymovych 2023-05-15 14:42:59 +03:00
parent 2556838a77
commit 51ae3d042d
7 changed files with 143073 additions and 8 deletions

File diff suppressed because one or more lines are too long

View File

@ -46,7 +46,7 @@
<!-- prettier-ignore -->
<dt class="flex w-full mb-1 text-gray-500 md:text-lg dark:text-gray-400 flex-col">
<div class="ql-snow">
<div class="ql-editor">
<div class="ql-editor-readonly">
{{ section.about|safe }}
</div>
</div>
@ -174,7 +174,7 @@
</svg>
<span>{{ section.label }}</span>
</a>
<div class="dark:text-white h-30 ql-editor">
<div class="dark:text-white h-30 ql-editor-readonly">
<p>{{ interpretation.text|safe }}</p>
</div>
</div>

View File

@ -25,7 +25,7 @@
<h1 class="text-l font-extrabold dark:text-white ml-4 truncate">
{{ interpretation.label }}
</h1>
<div class="quill-editor text-lg dark:text-white p-3">{{interpretation.text|safe}}</div>
<div class="ql-editor-readonly text-lg dark:text-white p-3">{{interpretation.text|safe}}</div>
</div>
<div class="p-1">
<!-- prettier-ignore -->

View File

@ -72,7 +72,7 @@
{% include 'book/local_breadcrumbs_navigation.html'%}
<p>{{ interpretation.section.label }}</p>
</a>
<div class="dark:text-white h-30 ql-editor">
<div class="dark:text-white h-30 ql-editor-readonly">
<p>{{ interpretation.text|safe }}</p>
</div>
</div>

View File

@ -11,7 +11,7 @@
<!-- prettier-ignore -->
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-10 h-10"> <path stroke-linecap="round" stroke-linejoin="round" d="M17.982 18.725A7.488 7.488 0 0012 15.75a7.488 7.488 0 00-5.982 2.975m11.963 0a9 9 0 10-11.963 0m11.963 0A8.966 8.966 0 0112 21a8.966 8.966 0 01-5.982-2.275M15 9.75a3 3 0 11-6 0 3 3 0 016 0z" /> </svg>
{% endif %}
<!-- prettier-ignore -->
<h1 class="hidden md:inline font-extrabold text-lg dark:text-white ml-4">{{user.username}}</h1>
<!-- prettier-ignore -->
@ -113,7 +113,7 @@
{% include 'book/local_breadcrumbs_navigation.html'%}
<p>{{ interpretation.section.label }}</p>
</a>
<div class="dark:text-white h-30 ql-editor">
<div class="dark:text-white h-30 ql-editor-readonly">
<p>{{ interpretation.text|safe }}</p>
</div>
</div>

10
src/initQuillReadOnly.ts Normal file
View File

@ -0,0 +1,10 @@
export function initQuillReadOnly() {
const readonlyQls = document.querySelectorAll('.ql-editor-readonly');
readonlyQls.forEach(el => {
const ql = el.querySelector('.ql-editor');
if (ql) {
ql.removeAttribute('contenteditable');
}
});
}

View File

@ -8,6 +8,7 @@ import {initVote} from './vote';
import {initTheme} from './theme';
import {initApprove} from './approve';
import {initStar} from './star';
import {initQuillReadOnly} from './initQuillReadOnly';
initBooks();
initContributors();
@ -19,3 +20,4 @@ initVote();
initTheme();
initApprove();
initStar();
initQuillReadOnly();