Skip to content

Fix formulas causing a scroll instead of breaking#145

Open
MoinJulian wants to merge 5 commits intoScriptRaccoon:mainfrom
MoinJulian:main
Open

Fix formulas causing a scroll instead of breaking#145
MoinJulian wants to merge 5 commits intoScriptRaccoon:mainfrom
MoinJulian:main

Conversation

@MoinJulian
Copy link
Copy Markdown

This pull request focuses on improving the display and styling of popup components and mathematical content in the application. The main changes are related to the structure and appearance of the popup's HTML content and better handling of line breaks in rendered math.

Popup component improvements:

  • Wrapped the popup's dynamic HTML content in a new <div class="html"> to provide a dedicated styling hook and improve structure.
  • Added a CSS rule for .html to enable vertical scrolling when the content overflows, ensuring better usability for long popups.

Math rendering enhancements:

  • Added a .katex-break CSS class to allow proper line breaks and inline display for math elements, improving the readability of mathematical content.

@MoinJulian
Copy link
Copy Markdown
Author

This is now basically the same functionality as the current deployed version
https://catdat.app/category/fld

@ScriptRaccoon ScriptRaccoon linked an issue May 1, 2026 that may be closed by this pull request
@ScriptRaccoon
Copy link
Copy Markdown
Owner

ScriptRaccoon commented May 1, 2026

The formulas still break. Also, there is a big redundant scrollbar now, also in the wrong direction (overflow-y: scroll should be overflow-x: auto, if at all).

But scrolling should be the exception; details here.

Screenshot from http://localhost:5173/category/walking_splitting:

screenshot with breaking formulas

The solution will not be straight forward, otherwise I would have already added the few lines of CSS. ;-)

@MoinJulian
Copy link
Copy Markdown
Author

I will have another look at it tomorrow. I tried only breaking it at the = but that doesn't work because it isn't a distinct element and just part of the bin operators.

Just for clarification it should only allow breaking on = but in the best case always stay together in one line?

@ScriptRaccoon
Copy link
Copy Markdown
Owner

ScriptRaccoon commented May 2, 2026

Let's address the XSS in a different PR, i.e. please remove 6ae3514 from this PR. (And please check out my comment at #146 before working on this.)

Just for clarification it should only allow breaking on = but in the best case always stay together in one line?

Yes. Maybe other relation symbols are also OK, like $\cong$. But tbh I have no idea if this is possible at all. I was only thinking out loud there.

@ScriptRaccoon
Copy link
Copy Markdown
Owner

Do you plan to continue working on this?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Fix word breaks in katex formulas

2 participants