Closed TheDutchJewel closed 4 years ago
The problem seems to be caused by the Vesta Webtrees Custom Module 'Classic Look & Feel'.
If I disable this module, everything looks fine:
I opened an issue on github/vesta-webtrees-2-custom-modules/vesta_classic_laf, hoping the author will look into it.
Hello,
This is not entirely due to the Vesta module, I can reproduce it when I reduce enough with some long names.
As mentioned by @ric2016 in https://github.com/vesta-webtrees-2-custom-modules/vesta_classic_laf/issues/11#issuecomment-643970204, the sidebar is a bit problematic, and I am not even sure there will be a good approach to it (the standard webtrees theme actually has the issue as well).
I can think of 2 attempts to fix it, but I am not really convinced by the outcome of any of them, which have impact even when there is enough space:
word-break: break-all;
overflow-y: auto;
I am happy to get your opinion on any of those options, but I think this is one I will leave as is, and accept the overflow.
I tried various options as well, I think a fixed table layout works best:
[dir] .wt-family-navigator-family {
table-layout: fixed;
}
[dir] .wt-family-navigator-family th {
width: 30%;
}
[dir] .wt-family-navigator-family .dropdown-toggle {
white-space: normal;
}
[dir] .wt-family-navigator-family .dropdown-item {
white-space: normal;
}
is what I ended up with. This breaks long names properly (only the family dropdown still is problematic), and the columbs align nicely across multiple tables.
I am happy to get your opinion on any of those options, but I think this is one I will leave as is, and accept the overflow.
Both have their own issues and none of them looks better than the overflow problem. If it can't be solved completely, I understand if you'll leave it as it is.
Thanks @ric2016 , your suggestion looks like a good compromise indeed. I will go for it.
When I adjust the size of the browser page with the
Windows key + the left arrow
, the right side of boxes with the family members, does not look good:Tested configuration Device: desktop pc OS: Windows10 x64 Home v1909 Browsers: Edge v83.0.478.45 and Firefox v77.0.1 webtrees: 2.0.5 PHP: 7.3.18