tiptap-extension-section
v1.0.0
Published
Make tiptap support section tags, which provide predefined styles for content.
Downloads
75
Maintainers
Readme
tiptap-extension-section
Install
npm install tiptap-extension-section -S
Usage
import Section from "tiptap-extension-section";
const editor = new Editor({
element: document.querySelector(".editor"),
extensions: [StarterKit, Section],
});
const html = `
<section style="display: flex;flex-direction: column;align-items: center;text-align: center;">
<section style="color: #fff;border-radius: 4px;font-weight: bold;min-width: 30px;padding: 0 4px;line-height: 30px;background-color: grey;">
<p>01</p>
</section>
<section style="color: grey">
<p><strong>公司宣传手册</strong></p>
</section>
<section style="color: grey">
<p>
<span style="font-size: 12px">COMPANY BROCHURE</span>
</p>
</section>
</section>`;
editor
.chain()
.focus()
.insertContent(html, {
parseOptions: {
preserveWhitespace: false,
},
})
.run();
Relations
tiptap-appmsg-editor: https://github.com/KID-1912/tiptap-appmsg-editor