PR https://github.com/mantisbt/mantisbt/pull/1967

@Alkante please review and test

I developed an other solution for this issue, I adapted the width of the box if the text is too long.
I wanted to PR but I think your solution is better.

Screenshot_2024-02-14_1.png (16,848 bytes)   

Screenshot_2024-02-14_1.png (16,848 bytes)   

Do you want to submit your approach as a separate PR for comparison, or should I merge mine ?

Yes I'd like to PR my approach. So I'll learn more about PR for later.

OK, let me know if you need help.
You can reach me here https://matrix.to/#/#mantisbt_mantisbt:gitter.im if you want to chat

PR https://github.com/mantisbt/mantisbt/pull/1968

Thanks for the pull request. We now have 2 distinct solutions for the same problem so a decision is needed on which one to implement:

1. Truncate text if bigger than fixed size menu item box https://github.com/mantisbt/mantisbt/pull/1967
2. Dynamically Increase menu box width to accept longer text https://github.com/mantisbt/mantisbt/pull/1968

Personally, I visually I like 1 better because all menu items have the same size, but the code is more complex (javascript to add the tooltip when text is truncated), so 2 is an acceptable solution too.

@atrol, @vboctor and anyone else, your opinion is welcome.

image.png (43,289 bytes)   

image.png (43,289 bytes)   

image-2.png (12,589 bytes)   

image-2.png (12,589 bytes)   

I'd prefer option 2 :-)

I prefer option 3 :-)
This would be option 2, but remove min-width: 176px;

If option 1 should be preferred, @dregad you would have to fix the JavaScript code.
I don't get the tool tip and see some error in browser console
Uncaught Error: Syntax error, unrecognized expression: ..sidebar.menu-min .nav-list > li > a > .menu-text

If option 1 should be preferred, @dregad you would have to fix the JavaScript code.
I don't get the tool tip and see some error in browser console
Uncaught Error: Syntax error, unrecognized expression: ..sidebar.menu-min .nav-list > li > a > .menu-text

Strange, I'm sure the tooltip was working when I tested (which is confirmed by the screenshot in my PR https://github.com/mantisbt/mantisbt/pull/1967), although I did miss the console error.

In any case, considering there seems to be a consensus for making the menu-text span wider, I'll just cancel my PR and won't bother with fixing that.

I prefer option 3 :-)
This would be option 2, but remove min-width: 176px;

That's a good suggestion, I like it.

I just noticed when testing @Alkante's PR https://github.com/mantisbt/mantisbt/pull/1968 that it does not completely fix the problem, which is still present in responsive mode with smaller resolutions.

Slightly different but related, the text also overflows in responsive mode with an expanded sidebar.

image-3.png (52,283 bytes)   

image-3.png (52,283 bytes)   

image-4.png (48,163 bytes)   

image-4.png (48,163 bytes)   

New PR https://github.com/mantisbt/mantisbt/pull/1969 implementing option 3 + additional fix mentioned in 0033651:0068557