So, I’m not certain this is actually a bug, but it was something I noticed. The screenshots will help the most.
TLDR: It appears that, certain markdown items do not work with HTML, specifically when trying to use the highlight function.
ie:
==<center>test</center>==
or
<center>==test==</center>
I have also noticed that if you use HTML, you HAVE to put a line break in or the below markdown won’t work:
ie:
<center>test</center>
- [ ] 1
HAS to be
<center>test</center>
- [ ] 2
Yep, this is mostly just a limitation of how Markdown interacts with HTML, specifically the different between inline elements and block elements.
Effectively, you are trying to insert block-level HTML tags (<p>, <div>, <center>, etc.) with inline markdown feature (==), which is not supported (mostly because it doesn’t make sense).
This is slightly confusing because you can write those HTML elements on a single line. However those elements are still rendered in the DOM as blocks. You can use inline HTML elements within inline markdown features, for example using the <span> tag, like so:
==<span>highlight</span>==
This is also the reason you need an extra linebreak between a HTML block and any further markdown – the parser needs to include that extra linebreak to ensure the subsequent text is not more HTML. Like before, inline HTML tags will not have this issue, and the text below will render as you expect:
<span>some text here</span>
- [ ] my todo item
However, I realize this doesn’t do anything for your use-case (trying to center text). Our recommendation in that case is just not to worry about things like that. Generally, one goal of Supernotes is to almost force you not to spend time thinking about things like formatting, and instead help you focus on the content itself. If you really need this level of formatting flexibility, you should probably be using a proper word processor for the final version of your content/document. Up until that point, we think excessive formatting options are a pre-mature optimization / distraction that should ideally be avoided.
Is there a particular reason you wanted to center text specifically, beyond personal preference? I’d imagine the combination of highlight + centered could be just as well served by a third-level title (### some text), which is generally clearer / easier to write / etc.
Oook gotcha. I was wondering if it was some sort of limitation, but I’m terrible at coding so my html knowledge is not that great.
As for your question:
Honestly, was an in the moment thing. I’m writing a small rubric for a paper I need to write and several of the areas have multiple sections and I think I just wanted to toss some color on the main heading for my eyes more than anything.
Centered Heading ((Highlighted for a quick reference when I'm going back over these items))
Secondary heading 1
- task
- task
- task
Secondary heading 2
- task
- task
- task
EDIT:
I feel like I should add, my solution was to leave out the highlight and use the heading instead.
# <center>heading</center>
Yep, sticking block-level HTML inside block-level markdown (# title, > quote, etc) should work just fine.
You can also color text by wrapping it in a span with some CSS, like so
# <span style="background:rgba(0,255,0,0.5)">title</span>
If you want to go really overboard, do something like this:
# <p style="background:hsla(349,100%,70%,30%);padding:8px;border-radius:8px;text-align:center">title</p>
But again, overall we’d recommend avoiding excessive formatting. Usually just a single feature is enough and trying to stack multiple elements (especially HTML!) adds complexity for little benefit.
Yeah, those are way more than I want to do lol.
I am trying to stick with what you guys are saying and keep things minimal. Just quick items like center and what not.
I appreciate it!