CSS window border workaround - high DPI scaling issues

[binaryfunt]

Related to #11, the CSS border for the frameless Electron window becomes more than 1 physical pixel thick while maintaining a thickness of 1 device independent pixel on high scaling factors.

Could try something like this.

[binaryfunt]

I've just noticed on 125% scaling, when the border is still 1 physical px thick, the bottom & right borders sometimes don't show depending on the size of the window (electron/electron#10862, or see this GIF). This seems to happen most of the time unless the window's width/height are at specific arbitrary values. It seems to be a Chromium bug as opposed to Electron itself, as I can reproduce on Chrome 80.

Ideally frameless windows should support native Windows borders, but the corresponding issue electron/electron#7172 hasn't received much attention. Frustrating!

[Toby56]

Yes, I've been frustrated with this problem for a long time, I mentioned it a while ago. It happens on any scaling that isn't a multiple of 100. There isn't really any fix as far as I know though, the window border is kinda hard to get right especially since the native one is transparent. Google Chrome itself uses a custom window but native 1px border, which would be a nice option in electron.

IMHO, the border should be taken out entirely, because it has at least three problems and no other electron/nwjs app with a custom window (Discord, Teams, Slack, VS Code, GitHub Desktop) has as 1px border of any kind. And it still looks great without it!