Corners CSS overlay - Githubissues

zen-browser / desktop

🌀 Experience tranquillity while browsing the web without people tracking you!

https://zen-browser.app

Mozilla Public License 2.0

18.51k stars 452 forks source link

Corners CSS overlay #497

Open nwrenger opened 2 months ago

nwrenger commented 2 months ago

What happened?

When visiting websites using this css class mix-blend-mode: difference; on a fixed element with full height and width will break/overlay over the rounded corners of the web view. Example visiting this website and looking at the navbar: nwrenger.dev.

Reproducible?

[X] I have checked that this issue cannot be reproduced on Mozilla Firefox.

Version

1.0.0-a.28

Severity impact

Low

What platform are you seeing the problem on?

macOS - aarch64

Relevant log output

No response

anatasiajp commented 2 months ago

Try to install this theme to see if it is fixed ?

https://www.zen-browser.app/themes/c6813222-6571-4ba6-8faf-58f3343324f6

nwrenger commented 2 months ago

Yeah, that'll fix it, but it's just a workaround that doesn't fully resolve the issue, as it completely removes the rounded corners.

anatasiajp commented 2 months ago

From some comments it looks like they will rewrite the rounded corners in the future, but it'll be much harder and safer, faster. For now you can use that theme.

markox92 commented 2 months ago

Yeah that's what I don't like Screenshot 2024-08-23 234952

I have found just one chrome style for Firefox which does not have this problem and rounded corners is working good, all others have same problem.

anatasiajp commented 2 months ago

Yeah that's what I don't like

I have found just one chrome style for Firefox which does not have this problem and rounded corners is working good, all others have same problem.

Can you give the link of the working style ?

markox92 commented 2 months ago

Sure https://github.com/amnweb/firefox-plus