HTML in Markdown is not allowed (especially the style attribute on elements)

[ErtugrulSener]

Describe the bug
HTML inside of Markdown Files needs to be rewritten in a way, that the JSX parser (as all html tags are in MDX) accepts it.
But if we do that, Obsidian is not able to display the html accordingly.

To Reproduce
Steps to reproduce the behavior:

1. Create a file named "test.md"
2. Add the following text to the file

<span style="font-size: 11pt">test test</span>

3. Try compiling it by doing "npm run export" inside of the ".flowershow" folder
4. You will get an error, that this html code inside of the markdown file is not valid

Expected behavior
Flowershow should be able to parse html as is, so that we can use it (as Obsidian also allows it)

Desktop (please complete the following information):

• OS: Windows 10
• Browser Brave
• Version 113.0.5672.126

Additional context
@olayway told me to create this issue, ask her for any more information if needed

[rufuspollock]

@ErtugrulSener this is a mdx issue. We are processing markdown files as mdx so you have to do:

style={{fontColor: "11pt"}}

See https://www.w3schools.com/react/react_css.asp for more.

This is annoying - but no way round it if we want MDX type support for rich JSX components. (Note to us: we should flag this in docs somewhere better!)

[ErtugrulSener]

@rufuspollock Why do you need the MDX type support?
Because this makes it harder for developers to use flowershow, since there are some limitations (We need to escape "<" as well as ">", different html syntax etc.)

And I heard you are working on an obsidian extension for flowershow, how will you handle this type of things there?
Is there maybe an html to MDX converter you could use, so that the user doesn't have to deal with it?

[rufuspollock]

@ErtugrulSener we support MDX so we can add charts and other rich components to markdown. However, i take your point about the complexity.

We'll think more about this - one option is to use different extensions for explicit mdx files vs markdown.