Blurring of share window & spacing comments

[mattgodbolt]

https://twitter.com/olafurw/status/1053737941380616192?s=19 some comments here

[RubenRBS]

@olafurw what browser do you use?

[olafurw]

Chrome Version 69.0.3497.100 on Windows 7, this appears at zoom levels 110%, 125%, 150% and anything below 100%

Also happens in Opera 56.0.3051.52, same zoom levels.

[mattgodbolt]

I see this on my phone, but not on my laptop. Laptop has high res display but even zoomed to 200% :

I'm on Chrome 69.0.3497.100 too, but on Linux. I wonder if it's a DPI thing?

[mattgodbolt]

Maybe a bit blurry at 125%:

[RubenRBS]

Can confirm that I can repro on a 1080p screen, but not on a 4k one. This seems like a Bootstrap issue to me

[mattgodbolt]

Just re-checking. 125% still looks a bit blurry. I feel bad in saying I don't have a 1080p screen around any more to test with (!!)

[olafurw]

Still blurry at 110% when other stuff around it isn't. Tested on both a 1080p screen and a 1440p screen.

[apmorton]

can confirm this is an issue with bootstrap, but is ultimately a bug in the browser according to them - twbs/bootstrap#22610

110% on my machine

disable the CSS transform that bootstrap uses to position the popover:

Seems like the only workaround is to disable GPU acceleration - some people mention being able to do that specifically for the popover, but I don't know how to accomplish that.

[mattgodbolt]

Thanks @apmorton ... this is starting to sound like more work than it "ought" to be :D

[RubenRBS]

I can no longer repro this. Can you check if it still happens for you? There have been some changes that might have inadvertedly worked around this issue

[olafurw]

110% zoom on chrome on fedora 30.

90% zoom on chrome on fedora 30.

Sorry, yeah this isn't the biggest issue around but thanks for keeping a focused eye on it :P

[olafurw]

Quick comment, why isn't the share dropdown made the same way the other drop downs are made? No blur there.

110% zoom on chrome fedora 30.

[apmorton]

The TLDR of why they are different is "because bootstrap".

Basically the other menus are "Dropdowns" in bootstrap, which are really only allowed to contain lists of links or buttons.

Because the share drop-down contains some more custom layout it uses a "Modal" in bootstrap. The modal is where the bug is that causes the blurring when zoomed.

[olafurw]

If you wanna close this sucker, put your fingers in your ears and say "I don't care right now lalala" then I don't mind haha :D

[olafurw]

Does not happen any more and the design of the site doesn't look like this anymore.
Can close.