search

sanity-io / sanity-plugin-markdown

Markdown support in the Sanity Studio
MIT License
51 stars 8 forks source link

Broken UI of the markdown field #104

Open nmonastyrskyi opened 3 weeks ago

nmonastyrskyi commented 3 weeks ago

Describe the bug

UI looks broken

To Reproduce

Steps to reproduce the behavior:

  1. In sanity.config.ts

    • import {markdownSchema} from 'sanity-plugin-markdown';
    • Add to plugins: 
      plugins: [
markdownSchema(),
       //...
    ]

  2. In sanity/schema/documents/posts.ts add a field to the document like this:

        defineField({
            type: 'markdown',
            name: 'content',
        }),
  1. Run npm run dev
  2. Open localhost:3000/studio/presentation
  3. Edit the corresponding document

Expected behavior

content field looks nice and you can easily edit a mardown there.

Actual behavior content field look bad. O Screenshots

Screenshot 2024-10-21 at 16 37 58

Which versions of Sanity are you using? @sanity/cli (global) 3.60.0 (latest: 3.61.0) @sanity/assist 3.0.8 (up to date) @sanity/code-input 4.1.4 (up to date) @sanity/document-internationalization 3.1.0 (up to date) @sanity/icons 3.4.0 (up to date) @sanity/image-url 1.0.2 (up to date) @sanity/preview-url-secret 1.6.21 (up to date) @sanity/vision 3.60.0 (latest: 3.61.0) sanity 3.60.0 (latest: 3.61.0)

What operating system are you using? MacOS Sonoma 14.5

Which versions of Node.js / npm are you running?

npm v10.8.3 Node v22.9.0

svey-xyz commented 2 weeks ago

This looks like a duplicate of #102, which can be solved by adding import 'easymde/dist/easymde.min.css' to your studio route. It seems like the documentation might just need to be updated to include that this is necessary for the app router?