Bug #5405
webui: dvr fanart overlap bottom toolbar when description text is too long
100%
Description
When the text overlap the bottom toolbar is not possible to use the buttons, you must enlarge the popup window to be able to use it again. My skills with css and html is very poor, so I think @azlm8t can get a solution faster than me.
History
Updated by Pablo R. about 6 years ago
I was talking to him about the size of the window since It cut the buttons below - on Spanish lang for example - and it was necessary to enlarge it. I hope he considers both proposals.
Updated by Em Smith about 6 years ago
I've been looking at it but can't yet determine why the epg dialog has a scrollbar (if you make the dialog smaller) but the dvr dialog doesn't.
The css overflow is the same for both (auto), and changing it in the debugger to values such as scroll doesn't seem to make any difference in the dvr dialog. The buttons (fbar) appear fixed to the bottom of the dialog and the dialog body overflows the dialog and footer. I tried removing the background image (using the debugger) but that didn't seem to make any difference to the dialog overflowing.
For the other problem of translated button toolbar width, I also tried a number of variants at the weekend to automatically size the dialog so the buttons are fully displayed for non-English translations. Unfortunately, I couldn't get the fbar to give a "natural" width that it would like to have which could be used for resizing the dialog width in an "afterlayout" callback.
I'm sure the solutions to both will be obvious after we work it out.
Updated by Pablo Zerón about 6 years ago
Both has scroll bar activated, but the epg tab don't use the "dvr-details-dialog" classes, so if you change the position from "absolute" to "relative" in the "dvr-details-dialog-content" class, the scroll bar appear, but by other side the background image lose it position showing it first and then the description.
I have tried differents aproach, but I'm no good with html and css, so no luck.
Updated by Em Smith about 6 years ago
I've submitted a PR that creates the scrollbar. I tested it by resizing the dialog to be too small for my existing text (since I have no programmes with as much text as yours!)
The text now scrolls (as you can see on the scrollbar on the right). The image still overlaps the buttonbar, but because it is transparent it's not as bad an issue (I think) and looks reasonable.
Updated by Em Smith about 6 years ago
Just tried it. If both are absolute then the scrollbar does not appear for the text.
Updated by Em Smith about 6 years ago
So, it seems that it only works with the text as relative, in which case the dialog can be resized and a scrollbar appears. (At least, it does on Firefox...)
Updated by Pablo Zerón about 6 years ago
It's ok, but when the image overflow the bbar, you still can't using the buttons like next, previous, etc., the strange thing is that you only can use the combobox.
Updated by Em Smith about 6 years ago
I've pushed an update which should stop the event being captured by the image. Can you test it works in your browser?
(Image still overflows but all buttons should not be clickable).
Updated by Em Smith about 6 years ago
- Status changed from New to Fixed
- % Done changed from 0 to 100
Applied in changeset commit:tvheadend|55f7bf00f826e816a1bf12e21bf33152cc7c809f.