KittyCAD / modeling-app

The KittyCAD modeling app.
https://kittycad.io/modeling-app/download
MIT License
287 stars 22 forks source link

[BUG]: No background in tooltips and menus #2713

Open dcl opened 2 weeks ago

dcl commented 2 weeks ago

Describe the bug

The background is missing in tooltips and and all other popovers, resulting in the content overlapping with whatever is underneath. The issue is appearing for me in both light and dark mode on the Windows client, but not in the browser.

Steps to Reproduce

  1. Install Windows client
  2. Start new project
  3. Open settings menu

Expected Behavior

The content in popovers is legible

Screenshots and Recordings

ss (2024-06-19 at 06 41 05) ss (2024-06-19 at 06 41 14) ss (2024-06-19 at 06 41 30)

Desktop OS

Windows 10

Browser

No response

Version

0.22.2

Additional Context

No response

franknoirot commented 2 weeks ago

This is fascinating. I suspect Windows 10 for some reason. I'll try my 11 machine and then see how I can boot up into 10.

@dcl would you happen to have any OS settings in effect, like setting everything to "high contrast mode", by any chance?

franknoirot commented 2 weeks ago

Oh you know what, I bet the background colors are failing because the platform OS for Windows 10, which would be used by Tauri, doesn't support OKLCH colors! I can try to replicate this on that route, turning off OKLCH color support and seeing if that does this. I think we need to provide fallback colors is all

dcl commented 2 weeks ago

This is fascinating. I suspect Windows 10 for some reason. I'll try my 11 machine and then see how I can boot up into 10.

@dcl would you happen to have any OS settings in effect, like setting everything to "high contrast mode", by any chance?

I don't have high contrast mode on, or afaict any other OS setting that should affect it. That said I suspect you're on to something with the color support, trying in dark mode introduces quite a lot more color issues than just the backgrounds: ss (2024-06-20 at 06 11 07)

franknoirot commented 2 weeks ago

That said I suspect you're on to something with the color support, trying in dark mode introduces quite a lot more color issues than just the backgrounds

Bingo, because in light mode the colors are falling back to black but that's not that different from our text color and whatnot, but in dark mode the OKLCH-defined text colors are falling back from off-white to black, looking way more jarring. We need some backup colors. I just need to figure out how far back up, like are we talking OKLCH isn't supported (relatively recent) or CSS variables (which have been around for a minute and we rely pretty heavily on). I'll try to make fallback behavior for both

franknoirot commented 2 weeks ago

Actually just one more question @dcl, could you provide me a version number of Edge that you're running? CSS Variables are supported all the way back to MS Edge v16 so I think I can get away with assuming a user has that, since WebRTC wasn't supported until v79 and it's a hard requirement for us. OKLCH wasn't supported until v111 so I think that's the culprit.

dcl commented 2 weeks ago

Actually just one more question @dcl, could you provide me a version number of Edge that you're running?

Great question! It seems to be v44? I have literally never run Edge before, it might still be old Edge?

franknoirot commented 2 weeks ago

I have literally never run Edge before

That would make sense then that you still have old Edge, and the thing about Tauri (how we build the desktop app) is it defers to the OS about what browser it should use, so it uses Edge on Microsoft of course, even if you as the user set Firefox or Chrome as your default browser.

If you don't mind, could you leave Edge in its old version for a bit? Once we get the PR I've made above in and release a new version, I'd love to see if you get solid backgrounds and better colors afterward.

Although I don't know if you'll be able to use the WebRTC stream we use to connect to the engine so after you verify that you might want to upgrade your Edge to a newer version sorry 😅

dcl commented 2 weeks ago

No worries, I'll hold off until we get this resolved.

Although I don't know if you'll be able to use the WebRTC stream we use to connect to the engine

Weirdly enough it seems to work fine. I wonder if Tauri has a fallback implementation?

franknoirot commented 1 week ago

Huh super weird I don't know! Neat that that part works though. We've just released v0.22.7 that includes a compatibility fallback color system to hsl that should work for you; do you mind updating to that version to see if it fixes your issue? You should see an updater popup if you open the app.

dcl commented 1 week ago

Alas, that doesn't seem to have fixed it. Same machine, 0.22.7: ss (2024-07-01 at 05 07 56)

franknoirot commented 1 week ago

Dang it! Sorry for the false hope. I've just gotta download an old version of Chrome so I can see it breaking and then being fixed with my own eyes. We'll get there, apologies for the delay.