You appear to be using two different editors rather than just the Markdown editor. Your first screenshot possibly shows the Markdown editor set to "editor only" view which does not fully render the Markdown. (It shouldn't really render the markdown at all but people like making things fancy and complicated).
To explain...
Joplin has two editors that users can use for note-taking.
The icon shown by the arrow below is for the Rich-Text Editor. This is an all-in-one WYSIWYG editor for your notes.
The other button (in the red square below) is the Markdown Editor. The arrow points at the Toggle Editor Layout button which can be used with the Markdown Editor and changes the layout (or CTRL+L). Each time you press it it will cycle between editor only, split view and viewer only.
If you do not want to cycle between all three views when you press the Toggle Editor Layout button, the sequence can be controlled using View > Layout button sequence.
When you are using only the Markdown editor and you have toggled a view that includes the Markdown Viewer, you will see the heading text changed by the css. As the Markdown editor is not really a true plaintext markdown editor any more, if you use @bwat47's first suggestion and switch much of the fancy stuff off you will then see the actual markdown code (like in my screenshot below).
