zen-browser / desktop

🌀 Experience tranquillity while browsing the web without people tracking you!
https://zen-browser.app
Mozilla Public License 2.0
19.36k stars 467 forks source link

Tab name weird padding #2636

Open wiraki opened 3 weeks ago

wiraki commented 3 weeks ago

Captchas

What happened?

The text and icons of tab is not properly aligned. See in the screenshot how the text is almost touching the bottom border of the active tab surrounding box:

image

Using the flatpak on linux.

I tried disabling all the zen mods, closing and re-opening the browser etc., but I couldn't figure out what is causing it.

Thanks for your efforts!!

Reproducible?

Version

1.0.1-a.17

What platform are you seeing the problem on?

Linux

Relevant log output

No response

dosubot[bot] commented 3 weeks ago

Hey @wiraki! 👋 I'm here to help you with any bugs, questions, or contributions. Let's tackle this issue together! Dosu

I found a couple of similar closed issues that might be relevant to the tab alignment problem you're experiencing:

  1. Poor visibility of active tabs in 1.0.1-a: This issue was resolved in version 1.0.1-a.2, which might suggest that updating to a newer version could help if you're not already on the latest one.

  2. Tab bar: misaligned icons and hover background: This was fixed with a specific commit that adjusted CSS styles, particularly removing certain position and display properties and changing border styles [1][2].

For your specific issue with the flatpak version on Linux, there might be differences in how CSS or UI rendering is handled compared to other installation methods, but I couldn't find specific documentation on this. It might be worth checking if there are any updates or patches available for the flatpak version that address this issue.

To continue talking to Dosu, mention @dosu.

Richard-Woessner commented 3 weeks ago

Hey @wiraki Im having trouble replicating this bug, can you send a screenshot of the entire browser?

wiraki commented 3 weeks ago

Hey, thanks for the quick reaction. Here's a screenshot, took the opportunity to show the zen mods in case it's helpful. Although as mentioned, turning them all off did not solve the issue.

image

Now I just tried loading another profile with default settings, and the issue is gone there. So it must be some setting/customization in my profile that is causing it. Do you have any idea where I should look?

Edit: now with the screenshot

Richard-Woessner commented 3 weeks ago

Okay I was trying to see why your tabs are so different from mine and I can see now you have a addon installed

https://zen-browser.app/mods/d8b79d4a-6cba-4495-9ff6-d6d30b0e94fe

Are you sure its turned off?

wiraki commented 3 weeks ago

Yes, here is the same with mods off.

image

Richard-Woessner commented 3 weeks ago

Okay so with the mod turned off it looks fine is that what you were asking?

wiraki commented 3 weeks ago

Okay so with the mod turned off it looks fine is that what you were asking?

No, it doesn't. In my last screenshot, you can see that the icon and tab name is not centered vertically in the box that highlights which tab is selected.

However, I found what is causing it:

  1. Right click in empty UI space
  2. Select "Customize Toolbar"
  3. At the bottom, set density to "Compact"

It does say that it is not supported. I don't remember doing this, maybe it was a miss-click while customizing other things. Switching back to other densities fixes it :+1:

Richard-Woessner commented 3 weeks ago

Ahh thank you and great job finding the issue. Definitely something we should consider. Thanks

Richard-Woessner commented 3 weeks ago

Moving this to Todo so we can remove Firefox compact mode, as we do not support it.

Thanks @wiraki