feat: Editor auf Quill 2.0.2 aktualisiert, Sticky Toolbar & Tabellen-Funktion hinzugefügt
All checks were successful
Docker Build & Push / build-and-push (push) Successful in 34s
All checks were successful
Docker Build & Push / build-and-push (push) Successful in 34s
This commit is contained in:
37
scratch.html
Normal file
37
scratch.html
Normal file
@@ -0,0 +1,37 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<link href="https://cdn.quilljs.com/1.3.6/quill.snow.css" rel="stylesheet">
|
||||
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css" rel="stylesheet">
|
||||
</head>
|
||||
<body>
|
||||
<div id="editor"></div>
|
||||
<script src="https://cdn.quilljs.com/1.3.6/quill.js"></script>
|
||||
<script>
|
||||
var quill = new Quill('#editor', {
|
||||
theme: 'snow',
|
||||
modules: {
|
||||
table: true,
|
||||
toolbar: {
|
||||
container: [
|
||||
['bold', 'italic'],
|
||||
['table', 'table-insert-row', 'table-insert-col', 'table-delete-row', 'table-delete-col']
|
||||
],
|
||||
handlers: {
|
||||
'table': function() { this.quill.getModule('table').insertTable(2, 2); },
|
||||
'table-insert-row': function() { this.quill.getModule('table').insertRowBelow(); },
|
||||
'table-insert-col': function() { this.quill.getModule('table').insertColumnRight(); },
|
||||
'table-delete-row': function() { this.quill.getModule('table').deleteRow(); },
|
||||
'table-delete-col': function() { this.quill.getModule('table').deleteColumn(); }
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
document.querySelector('.ql-table').innerHTML = '<i class="fas fa-table"></i>';
|
||||
document.querySelector('.ql-table-insert-row').innerHTML = '<i class="fas fa-grip-lines"></i>+';
|
||||
document.querySelector('.ql-table-insert-col').innerHTML = '<i class="fas fa-grip-lines-vertical"></i>+';
|
||||
document.querySelector('.ql-table-delete-row').innerHTML = '<i class="fas fa-grip-lines"></i>-';
|
||||
document.querySelector('.ql-table-delete-col').innerHTML = '<i class="fas fa-grip-lines-vertical"></i>-';
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user