@recaptime-dev's working patches + fork for Phorge, a community fork of Phabricator. (Upstream dev and stable branches are at upstream/main and upstream/stable respectively.) hq.recaptime.dev/wiki/Phorge
phorge phabricator
1
fork

Configure Feed

Select the types of activity you want to include in your feed.

Improve overflow/ellipsis behaivor for very wide task graphs

Summary:
See downstream <https://phabricator.wikimedia.org/T171648>. The `T123 Task Name` column in graphs can currently fold down to 0 pixels wide.

Although it's visually nice to render this element without a scroll bar when we don't really need one, the current behavior is excessive and not very useful.

Instead, tweak the CSS so:

- This cell is always at least 320px wide.
- After 320px, we'll overflow/ellipsis the cell on small screens.

This generally gives us better behavior:

- Small screens get a scrollbar to see a reasonable amount of content.
- The UI doesn't turn into a total mess if one task has a whole novel of text.

Test Plan:
Old behavior, note that there's no scrollbar and the cell is so narrow it is useless:

{F6320208}

New behavior, same default view, has a scrollbar:

{F6320209}

Scrolling over gives you this:

{F6320210}

On a wider screen (this wide or better), we don't need to scroll:

{F6320211}

Reviewers: amckinley

Reviewed By: amckinley

Differential Revision: https://secure.phabricator.com/D20345

+5 -4
+3 -3
resources/celerity/map.php
··· 9 9 'names' => array( 10 10 'conpherence.pkg.css' => '3c8a0668', 11 11 'conpherence.pkg.js' => '020aebcf', 12 - 'core.pkg.css' => '2dd936d6', 12 + 'core.pkg.css' => '7e6e954b', 13 13 'core.pkg.js' => 'a747b035', 14 14 'differential.pkg.css' => '8d8360fb', 15 15 'differential.pkg.js' => '67e02996', ··· 30 30 'rsrc/css/aphront/notification.css' => '30240bd2', 31 31 'rsrc/css/aphront/panel-view.css' => '46923d46', 32 32 'rsrc/css/aphront/phabricator-nav-view.css' => 'f8a0c1bf', 33 - 'rsrc/css/aphront/table-view.css' => '205053cd', 33 + 'rsrc/css/aphront/table-view.css' => '7dc3a9c2', 34 34 'rsrc/css/aphront/tokenizer.css' => 'b52d0668', 35 35 'rsrc/css/aphront/tooltip.css' => 'e3f2412f', 36 36 'rsrc/css/aphront/typeahead-browse.css' => 'b7ed02d2', ··· 531 531 'aphront-list-filter-view-css' => 'feb64255', 532 532 'aphront-multi-column-view-css' => 'fbc00ba3', 533 533 'aphront-panel-view-css' => '46923d46', 534 - 'aphront-table-view-css' => '205053cd', 534 + 'aphront-table-view-css' => '7dc3a9c2', 535 535 'aphront-tokenizer-control-css' => 'b52d0668', 536 536 'aphront-tooltip-css' => 'e3f2412f', 537 537 'aphront-typeahead-control-css' => '8779483d',
+2 -1
webroot/rsrc/css/aphront/table-view.css
··· 229 229 word-wrap: break-word; 230 230 overflow: hidden; 231 231 text-overflow: ellipsis; 232 - max-width: 0; 232 + min-width: 320px; 233 + max-width: 320px; 233 234 } 234 235 235 236 .aphront-table-view tr.closed td.object-link .object-name,