[Content Server CSS] Language tag not displayed properly in tag browser when language name is long (in narrow screens)

Bug #1734119 reported by Israel V on 2017-11-23
6
This bug affects 1 person
Affects Status Importance Assigned to Milestone
calibre
Undecided
Unassigned

Bug Description

Calibre 3.12 on Windows 7 64 bits. Tested on Linux and the same happens.
Content Server client: Chrome/Android 8 (Lineage) on a Moto G (720x1280 px screen). Also tested on Chrome 62/Windows 7 64bits (with DevTools mobile view).

As can be seen in the attached screenshot, the .tag-menu div is hidden for tags (languages in this case) with long names. This happens in narrow screens, like smartphones.

A possible solution would be to set hyphenation for the language item, so it splits into a new line (I've tried a manual hyphen ­ and it works). Or else, to change/remove the max-width limit so that the "Swahili (macrolanguage)" tag would be in its own row.

Actually, it's weird why in the screenshot, the "Greek; Ancient (to 1453)" tag stands in its own row. Most probably it is because the following tag is also long and both have reached the relative max-width set, which might have been set to 100% or more (because of the box-sizing).

Israel V (isra00) wrote :
Kovid Goyal (kovid) wrote :

This should be easy to fix by setting word-break: break-all

However, that might cause less than optimum breaks in some situations. Unfortunately, I am too busy right now to try it out.

Kovid Goyal (kovid) wrote :

Or better, use overflow-wrap: break-word

Israel V (isra00) wrote :

I have tried some CSS tweaks, but the fact that CSS is mixed up with JS in index-generated.html makes it very, very annoying. Any plans, BTW, to improve the architecture of the Content Server interface? In the old Content Server it was easy to deploy a custom stylesheet.

The architecture of the current server is far superior to that of the
old one. And to test a change to the CSS you dont need to modify
index-generated.html just use devtools. Or run calibre from source and
modify the CSS in the book_list/search.pyj

Fixed in branch master. The fix will be in the next release. calibre is usually released every alternate Friday.

 status fixreleased

Changed in calibre:
status: New → Fix Released
Israel V (isra00) wrote :

That's great. Thank you Kovid!

To post a comment you must log in.
This report contains Public information  Edit
Everyone can see this information.

Other bug subscribers