sparksuite / simplemde-markdown-editor

A simple, beautiful, and embeddable JavaScript Markdown editor. Delightful editing for beginners and experts alike. Features built-in autosaving and spell checking.
https://simplemde.com
MIT License
9.88k stars 1.12k forks source link

Feature request: editor as viewer, preview mode #847

Open Be1zebub opened 8 months ago

Be1zebub commented 8 months ago

Markdown editor can be used as markdown viewer. I use this hack todo this:

const mde = new SimpleMDE({
    element: document.querySelector("#profile-bio > .markdown-preview > textarea"),
    toolbar: ["preview"],
    initialValue: "Lorem **ipsum**."
});

// actiate preview mode
mde.togglePreview();
/* hide all editor related ui, for preview only mde */
.markdown-preview > .CodeMirror,
.markdown-preview > .CodeMirror > .editor-preview {
    background-color: transparent;
    padding: 0;
}

.markdown-preview > .CodeMirror > .editor-preview {
    display: contents;
}

.markdown-preview > .CodeMirror > .CodeMirror-scroll {
    display: none;
}

.markdown-preview > .editor-toolbar {
    display: none !important;
}
.markdown-preview > .editor-statusbar {
    display: none !important;
}

I would like to request the addition of this feature, with activation via option - like:

const mde = new SimpleMDE({
    element: document.querySelector("#profile-bio > textarea"),
    initialValue: "Lorem **ipsum**.",
    previewMode: true
});