iliyaZelenko / tiptap-vuetify

Vuetify editor. Component simplifies integration tiptap editor with vuetify.
https://iliyazelenko.github.io/tiptap-vuetify-demo/
807 stars 126 forks source link

Toolbar renders as unreadable text #307

Open mcat56 opened 3 years ago

mcat56 commented 3 years ago

"tiptap-vuetify": "^2.24.0"

Screen Shot 2021-11-09 at 11 41 24 AM

In my component:

         <tiptap-vuetify
                                    id="editor1"
                                    placeholder="Preconditions"
                                    :extensions="extensions"
         </tiptap-vuetify>

In script:

import { TiptapVuetify, Heading, Bold, Italic, Strike, Underline, Code, Paragraph, BulletList, OrderedList, ListItem, Link, Blockquote, HardBreak, HorizontalRule, History } from 'tiptap-vuetify'
components: {  TiptapVuetify },

in data:

        extensions: [
            History,
            Blockquote,
            Link,
            Underline,
            Strike,
            Italic,
            ListItem,
            BulletList,
            OrderedList,
            [Heading, {
                options: {
                levels: [1, 2, 3]
                }
            }],
            Bold,
            Link,
            Code,
            HorizontalRule,
            Paragraph,
            HardBreak
        ],

in main.ts

import { TiptapVuetifyPlugin } from 'tiptap-vuetify'
import 'tiptap-vuetify/dist/main.css'
import 'vuetify/dist/vuetify.min.css'
import vuetify from './plugins/vuetify';
Vue.use(vuetify)
Vue.use(TiptapVuetifyPlugin, {
  vuetify, 
  iconsGroup: 'md'
})
szabomikierno commented 3 years ago

There is a typo in the docs for the icon group

@mcat56 In main.ts iconsGroup: 'mdi' instead of iconsGroup: 'md'

mcat56 commented 3 years ago

@szabomikierno thank you! that did it!