search

Treverix / custom-electron-titlebar

Custom electon title bar inpire on VS Code title bar
MIT License
35 stars 6 forks source link

Issue with scrolling #6

Open Treverix opened 4 years ago

Treverix commented 4 years ago

Issue from parent project: https://github.com/AlexTorresSk/custom-electron-titlebar/issues/90

I just integrated this package into my project and I am having an issue with scrolling.

When I open an HTML that is scrollable (because it doesn't fit the window size), the titlebar produces double scrollbars. I suppose the titlebar is "pushing the content down", which leads to the actual content window below the titlebar being scrollable as well -- but just a little bit. It is only scrollable for like ~32px, which perfectly fits the titlebar.

Is this issue known? Should this be fixed in the titlebar package (here) or locally using any CSS adjustment? It would be lovely if this would work out of the box.

Treverix commented 4 years ago

Not reproduceable by me so far. I opened a couple of websites with the example app and none showed the duplicate scrollbar issue. I keep the issue open.

If anyone knows a public URL where two scrollbars are rendered, please comment on this issue.

ecmani02 commented 4 years ago

i used this for my Electron + vue.js project. By setting 'overflow : "hidden"' removed the scroll. But extra space added above footer which make the footer is partially hidden

Treverix commented 4 years ago

@ecmani02 Is that project on github or any other public repository so that I can investigate? I need something to reproduce the issue. I gave it a few tries with browser windows that render public URLs but none had issues with scrollbars.

Styling can be tricky in some cases, because the titlebar injects itself as the first child of <body> and moves the original content of body into a body child element. Some CSS selectors may not work as expected and may need to adjusted after adding the titlebar. Like if we set up a scroll for body, we now want to define it for the child element instead.

ericblade commented 3 years ago

i'm trying out the original project right now, and the very first thing i noticed upon adding it, is that i have scrollbars in both directions on my window until I resize it.

ericblade commented 3 years ago

FWIW, fixed this in my application by setting CSS .container-after-titlebar { overflow: visible; }

ericblade commented 3 years ago

oops, that doesn't actually fix it, it only fixes it when i set that property in inspector directly, thanks to the style apparently being set on the element directly, so it overrides the CSS. I might have to fork just to get that

ericblade commented 3 years ago

.... and one last comment, lol, when i cloned the original source, is when i discovered there's an "overflow" attribute that can be passed into the Titlebar constructor.