manga-tracker icon indicating copy to clipboard operation
manga-tracker copied to clipboard

Use ellipsis on long titles to stop them going onto next line.

Open DakuTree opened this issue 7 years ago • 4 comments

Could show full title on hover.

Example:

DakuTree avatar Aug 12 '17 17:08 DakuTree

Whatever gets applied here should also be applied to chapter titles. In cases where the title is not parsed (EG Scans and Webtoons), the chapter titles become far too large for their respective columns. This is especially the case for Webtoons, where the entire episode name is shown, hyphens included. Alternatively, we could implement a parser for the episodes and semi-arbitrarily assign numbers.

Vesnyx avatar Aug 12 '17 20:08 Vesnyx

One more thing is that this affects mobile and or users with low screen widths. The ellipsis should be dynamically generated depending on the screen width.

Vesnyx avatar Aug 13 '17 20:08 Vesnyx

Here's the CSS type that adds ellipsis: .someclassname { overflow: hidden; text-overflow: ellipsis; white-space:nowrap; display: inline-block; }

There's a few more elements needed to insure compatibility with IE, but this should be fine for preliminary work.

Vesnyx avatar Aug 19 '17 22:08 Vesnyx

Here's the CSS type that adds ellipsis: .someclassname { overflow: hidden; text-overflow: ellipsis; white-space:nowrap; display: inline-block; }

This seems to cause the column to increase in width to fit the full title, even though it's hidden. The ellipsis is also added too early in the title. Not too sure what exactly is causing that..

Before:

After:

DakuTree avatar Aug 20 '17 11:08 DakuTree