Page MenuHomePhabricator

Task title is truncated in task graph, even if there is enough space
Closed, ResolvedPublic

Description

In the task graph, task titles are always truncated (the complete title can be seen in the tooltip).

Using text-overflow: ellipsis would leave the complete title when enough space is available. Is that possible?

Event Timeline

epriestley added a subscriber: epriestley.

With text-overflow: ellipsis; and no truncation:

Screen Shot 2017-02-06 at 4.12.45 AM.png (342×1 px, 78 KB)

With text-overflow: ellipsis; and no overflow-x: auto; on the container:

Screen Shot 2017-02-06 at 4.15.50 AM.png (203×936 px, 51 KB)

And so on.

Feel free to submit a patch if you can get this working. Tricky cases to test: mobile, rows with no text, one very long word with no spaces ("MMMM").

The behavior you describe is desirable, but it isn't clear that it's achievable.

Thank you for your quick reply. Indeed, this is tricky. Apparently, max-width has to be set on cells for overflow to work.

Changing the classes with the following properties may be a solution:

.aphront-table-view {
    min-width: 500px;/* This should probably be responsive */
}

.aphront-table-view td.object-link {
    max-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

It overflows correctly and the whole table still has a minimum width so that it scrolls horizontally on mobile devices. I think that the min-width should be larger on mobile devices (using an @media rule) because they can't show the tooltip and have will have to scroll anyway.