JSFiddle - React, Tailwind, and code Playground
by zhangchi
HTML
<link href="https://cdn.quilljs.com/1.3.4/quill.core.css" rel="stylesheet" />
<link href="https://cdn.quilljs.com/1.3.4/quill.snow.css" rel="stylesheet" />
<link href="https://cdn.quilljs.com/1.3.4/quill.bubble.css" rel="stylesheet" />
<script src="https://cdn.tailwindcss.com"></script>
</head>
<body>
<script src="https://cdn.quilljs.com/1.3.4/quill.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/quill-menu-module.umd.js"></script>
<div class="quill-editor">
<div id="editor"></div>
</div>
CSS
.quill-editor,
.content {
background-color: white;
}
.quill-editor {
height: 500px;
}
JavaScript
Quill.register({
'modules/menu': quillMenuModule
},
true
)
window.quill = new Quill(document.getElementById('editor'), {
modules: {
toolbar: true,
menu: true
},
theme: 'snow',
placeholder: `Description or type " / " for commands`
})