search

aminomancer / uc.css.js

A dark indigo CSS theme for Firefox and a large collection of privileged scripts to add new buttons, menus, behaviors and other opinionated features. The theme is similar to other userChrome stylesheets, but it's intended for use with an autoconfig loader like fx-autoconfig, since it uses JavaScript to implement its more functional features.
Other
337 stars 27 forks source link

Problem when hovering a tab containing a single image [tabThumbnailTooltip.uc.js] #32

Closed ericpa06 closed 2 years ago

ericpa06 commented 2 years ago

Hi, it's me again bothering you. I was wondering about this weird margin when hovering a tab containing a single image. Like this: 01

I was wondering if would be possible to at least center the thumbnail on these cases, such as it happens on Microsoft Edge:

02

Although, truth be told, even the way Microsoft Edge deals with tab thumbnail on these cases isn't perfect. Ideally, maybe the best alternative here, I think, would to try to adjust the image accordingly, more or less like it happens when your OS tries to automatically adjusts an image too big to fit your monitor resolution. Something like this: 03

Anyway, thanks for your time :)

aminomancer commented 2 years ago

Well, it's a preview of the tab, not a preview of the image. So, if there's space on the page, there will be space in the thumbnail. It may not appear centered, even if it appears centered on the page, if the aspect ratio of the thumbnail doesn't match the aspect ratio of the viewport. The script isn't aware of any of that, firefox just gives it a static raster buffer in a canvas, and the script uses a low-level API to link the canvas to a div through the background-image property. The component that generates the thumbnail just aligns everything to the top left, so parts may bleed off the right and bottom edges. You can see the same aspect ratio issue in the Ctrl+Tab overlay's thumbnails (which only shows if browser.ctrlTab.sortByRecentlyUsed is set to true and there are more than 2 tabs open).

So that's why the script has settings for thumbnail width and height. Maybe I should only allow setting thumbnail height, and dynamically set width so that it's equal to height times the aspect ratio of the viewport. That way the thumbnail will always have the same proportions as the page viewport itself. However, that would mean if you resize your window to odd dimensions, the thumbnail will have the same odd dimensions. I'll experiment with it a bit and see how that works.

ericpa06 commented 2 years ago

Thank you very much for your explanations and considerations.