dillchen
commented
2 months ago Decisions
- Heading selector
- Do not include block selector for now, include designs as is.
- Do not include H4-H6 with these designs.
- Resetting Heading Selector
- Per you suggestion, user should rehit the H1 again? (this is google docs behavior)
- Raw markdown mode
- Include on desktop as the right most button
- Conditional toolbar.
- Include for now. Behavior 1) if editing code block -- show code block language as Block selector 2) if user clicks out of code block, it should return to normal
- Drag / Drop Handling
- If possible include a loom, this may be okay for now -- if not for this and we will get a design ticket for this next week.
- Upload Indicators
With upload indicators (when uploading an image) I do the same thing as the drag indicators.
- Include a dummy progress indicator (use CWLoader, centered) and do not let the user edit text box (grey it out) until the upload is finished.
- if possible include a loom for this and we will get a design ticket for this next week
burtonator
Describe the bug
I just sent in a PR for v0 of the markdown editor which raised some issues regarding UI.
Heading selector?
What do we do about the block selector? The designs have H1, H2, H3 but we have headings up to H6.
In the design we don't have a way to reset the heading. So if you go from P to H1 there's no way to go back. Maybe hit the H1 again?
Also, there are up to 6 headings. H1... H6. We wouldn't support H4-H6 with these designs.
If we go with this design it will take me like 1-3 hours of work to use this style of buttons. I don't feel strongly about it unless something else comes up that I didn't forsee.
Here is the block type selector with MDXEditor
Raw markdown mode
Do we want the RAW markdown mode (probably on desktop only)? This will help with pasting raw markdown data.
I didn't realize that MDXEditor supported a 'raw' markdown mode.
You have to click this button:
Then the UI changes to work with the raw markdown text:
Conditional toolbar.
MDXEditor supports a conditional toolbar. So if you start editing 'code' it will change the toolbar since none of the options of the markdown formatting are possible with source code.
I think we should enable this feature. Otherwise, it will be confusing to the user if they try to use the toolbar.
Drag Indicators
When the user is dragging a file on top of the editor to upload their own markdown, I just grey out the editor until they drop the file.
We'll need a better UI for this. I just need the UI as I already implemented the drop handling.
Upload Indicators
With upload indicators (when uploading an image) I do the same thing as the drag indicators.
We might want to have a progress indicator here while this is happening.
Right now there's no UI for it so we need to agree on a UI.
Initial conditions
Environment:
Branch/Release version:
Browser:
Wallet:
Reproduction steps
Actual behavior
Expected behavior
Screenshots / Video
Reporter
Additional context