KaTeX vectors have gray box (CSS collision)

Steps to reproduce

  1. Use ā€œDarkā€ Theme
  2. Create Vector in KaTeX, i.e.: $$ \vec y $$

Expected result

Background stays #181818, Text stays #eee

Actual result

A rgba(255, 255, 255, 0.3) rectangle appears over the vector

Environment

Which operating system are you using? Solus 4, Linux 5.3
Which browser are you using? Chrome 87
If youā€™re using a desktop or mobile app, whatā€™s the version number of Dynalist? ā€“
Are you using any third-party scripts for Dynalist, e.g. PowerPack? ā€“


Additional information

The overlay is created by KaTeX internally and has the class .overlay, which happens to be a common class name and is also used by dynalist itself (For me in theme_dark.css:65-67), where the color is applied.

I recommend renaming the .overlay class or adding an override rule for KaTeX environments.

Other issues suggest this is an issue with KaTeX itself, which i donā€™t think it is.


Additional comments

Love Dynalist, thanks for it!

Cheers :slight_smile:

Whoops, for some reason i couldnā€™t find the other reports about this before but now i see them. So itā€™s a duplicate and can be closed. ĀÆ\_(惄)_/ĀÆ

Similar: #4077, #4451

Thanks for hunting down the root cause! Weā€™ll think of something to have it fixed.

I think this is fixed now, it doesnā€™t appear anymore for me, the .overlay class in theme_dark.css has been renamed to .full-screen-overlay. Thanks, yā€™all are awesome!

Tagging #4077, #4451 to be closed as well

Thanks for the update!