Font changes when typing math equations in Live Preview

Hi. When I type inline math equations in the Live Preview mode, the font changes from monospace one to that of standard text every time I insert white space, like this:
ezgif-3-76ababde5e

I don’t think it’s a bug, but this distracts me a little bit.
So I wonder if there’s a workaround (maybe CSS snippets?) to avoid this phenomenon and keep the font consistent while typing equations.

I searched the doc, this forum, and other relevant websites but got nothing. So I appreciate it if you could give me some hints.

Thank you in advance.

The css-class is .cm-math but it seems many other code-like elements gets the formatting too. After typing white space the element is not recognized as .cm-math. I think that is the more remarkable problem here.

So if you want workaround you should match the style of .cm-math with other text. There are three things: disable italics, monospace and code-color. You can use developer tools (View->select Toggle Developer Tools) to locate all of these. I’m not 100% familiar with it.

Don’t add the closing $ until you have written the rest of the equation? In local tests that stops the font changing all the time.

Thank you very much for the reply!

After typing white space the element is not recognized as .cm-math.

I see, the problem seems to be more complex than I thought…

you should match the style of .cm-math with other text

Do you mean I have to give up the rich style of .cm-math that I’m currently enjoying, such as italics, monospace, and code color? Thank you for the proposal, but that seems to be too much…

Thank you very much for the replay.

Do you mean something like this? I tried in the sandbox vault, but it didn’t work.
ezgif-4-943c478705

Sorry if my description was not enough, but I want to keep the font to be colored monospace in italics, not the normal text.

1 Like

If you are just using MathJax to do assignments, then MarkText could be worth to try. Obviously if your use case is much broader (i.e. PKM) then I recommend following how this topic evolves. I personally think it’s a bug that could be addressed by the developers.

Thank you for letting me know about MarkText. It looks nice, but yeah, I’m using Obsidian for the PKM purpose. So I’m going to watch how things go.

I will also think about changing the category of this post to but reports.

Thank you anyway!

1 Like

Remember that you can use MarkText (or any other editor) on files in the vault. Other Obsidian functions will still work.

Used to be that the Obsidian editor would reflect any changes in the other editor in more-or-less real time, but I have a vague memory of reading that is no longer the case. But it will still read the files.

Thank you for your reply.

I know; all the notes in Obsdian are just plain text files, after all.

But to be honest, I’m not tempted to move from one editor (insert math) to another (use Obsidian functionality) while taking notes. So it would be great if we can solve this problem nicely within Obsidian.

1 Like

My misunderstanding. Apologies.

So you want to see the monospaced font all the time while typing. If the appearing and disappearing whitespace before the closing $ is causing the flickering (which seems like a bug given that it is so user-unfriendly), can you fool the editor by typing a random character next to the closing $ and then work on the rest of the formula, starting next to the opening $, or does that not display the appropriate formatting?

In a simple test, if I type $ 0$ and then move the cursor after the opening $ and before the (SPACE) $, I can type a simple formula without seeing any flickering, just the monospaced font and coloured text. The closing zero just needs to be deleted when the formula has been completed.

maths

I know this is a terrible workaround but is it actually useful at all? Or for proper maths does it just look awful and meaningless when editing?

1 Like

Thank you for your proposal, it indeed worked!

ezgif-3-951846a1c6

However, I use the Latex Suite plugin to show a popup preview while typing equations (as in the GIF above).
The 0 at the end of the equation disturbs this preview window, so this is a problem.

An alternative would be replacing 0 with something like \hspace{0em}, which displays a “white space of width 0”:

ezgif-3-3fead6cebe

\hspace{0em} doesn’t show up in the preview, and moreover, we don’t have to delete it after finishing typing the equation.

It might seem to be cumbersome to type \hspace{0em} every time you type an equation, but you can avoid it by adding the following line to the Latex Suite snippet:

{
  ...
  {trigger: "mk", replacement: " $$0 \\hspace{0em}$ $1", options: "tA"},
  ...
}

After that, you will see the following if you type mk:
ezgif-3-68a4502140

This is obviously not an elegant solution, but at least it works.

Thank you again for giving me the idea!

1 Like

Great to hear. Hopefully this behaviour will be changed in future Obsidian releases.

I decided to post a bug report about this issue:

I hope this will be fixed. Thank you for the discussion!

1 Like

Hi. @AdrianoCzelentano has suggested another workaround ${ ... }$, which looks much neater than mine! So let me share it here.

If you are a Latex Suite user, you can invoke it using the following snippet by typing mk:

{
  ...
  {trigger: "mk", replacement: " ${ $0 }$ $1", options: "tA"},
  ...
}
1 Like

A great community that shares—what the core of life should always be about, IMO.

1 Like

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.