Editor Changes #507
Editor Changes #507
Conversation
DarrachBarneveld
requested review from
pkspyder007 and
NiallJoeMaher
as code owners
|
@DarrachBarneveld is attempting to deploy a commit to the Codú Team on Vercel. A member of the Team first needs to authorize it. |
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
| ))} | ||
| </select> | ||
|
|
||
| <pre className="bg-black border "> |
There was a problem hiding this comment.
@NiallJoeMaher are there styles for code blocks at the moment? may be easier to add here.
There was a problem hiding this comment.
Happy to deal with the smaller style issues at the end. Its not super important for alpha page
There was a problem hiding this comment.
The styles we currently have are great; I wonder if we can mimic or what people think 🤔
There was a problem hiding this comment.
We should be able to - We can add this and figure it out - if it doesnt work we can revert the changes and save syntax highlighting for v2 of the editor
| import { ChangeEvent, FunctionComponent } from "react"; | ||
|
|
||
| // Change this for code styling | ||
| import "highlight.js/styles/monokai-sublime.css"; |
There was a problem hiding this comment.
changes look good, check with @NiallJoeMaher re styling of the code blocks. Good job.
There was a problem hiding this comment.
I had quite a lot of difficulty getting the syntax highlighter to work in preview/render mode. Will take another look now
There was a problem hiding this comment.
https://tiptap.dev/guide/node-views#render-html
you can extend the configuration for the node in tiptap extensions - . eg Codeblock.configure{renderHTML({ HTMLAttributes }) {
return ['my-custom-node', mergeAttributes(HTMLAttributes)]
},}
Its not essential now, we can fix in another pr
There was a problem hiding this comment.
I will try this, I went another way thats probably not ideal
There was a problem hiding this comment.
The problem is its parses as a different node. The StarterKit.Codeblock one, not the customised one, 🤔
There was a problem hiding this comment.
you should be able to configure all of that. But If what you have works, then we can add it. I don't mind to fix styles up at the end.
There was a problem hiding this comment.
technically everything can be target in global.css with .ProseMirror code, .ProseMirror p etc to make the styles sync - we can figure it out later if you wish, one source of truth should be feasable in the editors case
There was a problem hiding this comment.
I have two solutions. Maybe I should PR the alternate also, each have pros and cons I think?
There was a problem hiding this comment.
It might be worth chatting about it in the Discord too just so we can discuss too!
There was a problem hiding this comment.
Ok, will log on this evening 👍
|
Let me know if you are going to fix the conflicts and we can add it in case we need backward compatibility. |
|
If you can would you fix the conflicts and I'll get this merged! I also need to send you the Codú Hacktoberfest badge 🦡 |
|
OMG! A collectible badge, my weakness. Will fix conflicts now 😃 |
✨ Codu Pull Request 💻
👉 Please remove the below and replace with your own values, leaving the headers where they are. 👈
Pull Request details:
Added target blank and code highlight styling changes. Having issues rendering styled code to preview post. Install lowlight/highlight packages
Any Breaking changes:
None
Assosiation with issue #498 and #497