Editor: Consistent styles between editor and rendered html

[xiaoniuniu89]

Context

This is a story of master feature #197
The editor is in components/editor

Expected Behavior

Styles between the editor and the rendered content should match and be consistent.

Current Behavior

Elements, such as code, codeblock , link etc look different.

Steps to reproduce

1. go to /alpha/create/new
2. add some text and add some formatting to the text such as code, link and any others in the toolbar.
3. Click preview button
4. styles will not match 100%

Additional info

https://tiptap.dev/guide/styling

[DarrachBarneveld]

Would a readonly editor mode a solution or will it affect posted articles/old articles?

[xiaoniuniu89]

This could be a potential solution, if you check the documentation of tip tap to see what are the trade offs for this approach. In particular if there are any accessibility issues with displaying posts as a read only editor instance

Thanks

[DarrachBarneveld]

It doesn't mention anything specifically but could be resource intensive. I used this approach to add styling to code blocks in #507. I can fix the conflicts now and I would appreciate your insight.

#525 uses the renderhtml method on individual nodes. So basically the generate html method as used before.

Thanks