Note Preview Look & Aesthetics (Markdown Rendering Issues)

Issues
1

Hello!

At first, I’ll show, not tell.

Here’s the plain text:

inkdrop-popup-window-1-current-plaintext
inkdrop-popup-window-1-current-plaintext1624×1624 569 KB

And here’s the preview I get:

inkdrop-popup-window-2-current-preview
inkdrop-popup-window-2-current-preview1624×1624 374 KB

Now, I’m not sure if the result I get is intentional or not — in any case, I would like for preview to look different:

  • Horizontal break after the TOC
  • No horizontal breaks followint H1 and H2
  • The list subjects aren’t rendered as though there’s a line between the previous line

(My second point isn’t as important as the other two are.)

So, here’s what I’d like to see instead:

inkdrop-popup-window-3-expected-preview
inkdrop-popup-window-3-expected-preview1624×1624 532 KB

Can someone please help me get to that?

I have a feeling that I’d have to tinker with the config files, but I don’t have a faintest idea as to how and I’m not a programmer at all…

Info

  • Platform: macOS
  • Platform version: Catalina 10.15.7
  • App Version: 5.1.2
2

Hi Name_Space,

Thank you for the question.
So, it looks like you are using toc plugin.
And in the documentation, it says:

  • Removes all following contents until an equal or higher heading is found

So, you basically can’t insert anything between the table of contents and the next section. This is by design.

The list subjects aren’t rendered as though there’s a line between the previous line

That is a CSS issue. You have to tweak stylesheets for your preference:

Hope that helps!

3

Thanks fo the reply, Takuya!

So, you basically can’t insert anything between the table of contents and the next section. This is by design.

Would you, please, consider tweaking that?

That is a CSS issue. You have to tweak stylesheets for your preference:

I can’t find the styles.less file, but even if I could, I wouldn’t know what to do with it… Do you consider the spacing thing to be a problem? If yes, could you consider maybe tweaking the default Less file to work properly, then?

Also, would editing these affect the mobile version? I’d like the app to be consistent across my devices…

4

I’m afraid to say no because, as I said, it is your personal preference.
The preview theme is built based on GitHub’s stylesheets, which many people are used to seeing.

You can create styles.less file in your data directory.
If you don’t understand the documentation on tweaking styles, you have to learn CSS.
Editing the file doesn’t affect the mobile version. It is basically for the desktop version and on your local environment.

1 Like