10000 Unnecessary horizontal scroll bar for katex blocks · Issue #1935 · jackyzha0/quartz · GitHub
[go: up one dir, main page]
More Web Proxy on the site http://driver.im/
Skip to content

Unnecessary horizontal scroll bar for katex blocks #1935

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom
Closed
flyingnobita opened this issue Apr 23, 2025 · 12 comments
Closed

Unnecessary horizontal scroll bar for katex blocks #1935

flyingnobita opened this issue Apr 23, 2025 · 12 comments
Assignees
@saberzero1
Labels
bug Something isn't working

Comments

@flyingnobita
Copy link

Description
For all Katex blocks, an unnecessary horizontal scroll bar is always displayed, even if the Katex formula fits properly without scrolling.

To Reproduce
Steps to reproduce the behaviour:

  1. Create a katex code block with $$...$$

Expected behaviour
A scrollbar should only be visible when the formula does not fit the view.

Screenshots and Source
Image

Desktop (please complete the following information):

  • Quartz Version: 4.5.0
  • node Version: 20.19.0
  • npm version: 10.8.2
  • OS: Macos
  • Browser: Arc (Chrome)
@flyingnobita flyingnobita added the bug Something isn't working label Apr 23, 2025
@saberzero1
Copy link
Collaborator

Hey, which renderEngine do you have configured?

@flyingnobita
Copy link
Author

Using the default settings, katex

@saberzero1
Copy link
Collaborator

Using the default settings, katex

Thanks. Seems fixed by small CSS rule change. I'll post a fix later today.

@saberzero1 saberzero1 self-assigned this Apr 26, 2025
@flyingnobita
Copy link
Author

Hi, I just did an update on my site, and I don't see the fix. Is it still being implemented, or do I need to do something to see the fix?

@saberzero1
Copy link
Collaborator

Hi, I just did an update on my site, and I don't see the fix. Is it still being implemented, or do I need to do something to see the fix?

Can you link the page on your site having issues?

@flyingnobita
Copy link
Author

Sure, here are two examples. Other pages in the same website that use $$...$$, which shouldn't need a horizontal scrollbar all have the same issue.

https://flyingnobita.com/Notes/Math/Elliptic-Curves---Overview
https://flyingnobita.com/Notes/Math/Boolean-Hypercube

@saberzero1
Copy link
Collaborator

Can you check if this fixes the issue: #1989

@flyingnobita
Copy link
Author

Unfortunately not.

FYI, I added the line to the file in my local repo, ran npx quartz build --serve, and not seeing any changes.

@saberzero1
Copy link
Collaborator

Unfortunately not.

FYI, I added the line to the file in my local repo, ran npx quartz build --serve, and not seeing any changes.

Hmm. I'll check. It's probably getting overwritten by katex's cdn styling.

Can you replace the line with: display: initial !important; to ensure it is applied?

If that works, I'll investigate a more solid implementation for the PR.

@flyingnobita
Copy link
Author

This works, thank you!

I noticed that for LaTeX blocks that are actually longer than the width, the horizontal scroll bar doesn't show up unless the user explicitly tries scrolling. Is it possible to always show the horizontal scroll bar in this case? This helps make it obvious to the user that there's more to the LaTeX block if the user scrolls.

@flyingnobita
Copy link
Author

Not sure which commit was put in to fix this but the scrollbar is showing for wide content now, thanks!

@saberzero1
Copy link
Collaborator

Not sure which commit was put in to fix this but the scrollbar is showing for wide content now, thanks!

Yeah, sorry. Forgot to tag this issue in the PR.

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

@saberzero1 saberzero1

Labels
bug Something isn't working
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@saberzero1 @flyingnobita
0