revi-archive/phorge-phorge
1
0
Fork 0
mirror of https://we.phorge.it/source/phorge.git synced 2024-11-09 16:32:39 +01:00
Code Issues Releases Wiki Activity

Show title entirely and cut of secondary information gracefully in typeahead results of main search

Browse source 
Summary:
This revision increases the usability of the typeahead results of the main search (on the right in the top bar).
The result texts wont't overflow in a reasonable way.

| Before    | After     |
|-----------|-----------|
| {F715296} | {F715385} |

The result title (red box) will now break so the user can read and understand it.
The result type (blue box) will be cut off inside the padding with an ellipsis.

See T15715

Test Plan:
Check it out and use the main search in the top bar to create typeahead result with very long titles ;)

Nothing changes for short titles.

Reviewers: O1 Blessed Committers, valerio.bozzolan, avivey

Reviewed By: O1 Blessed Committers, valerio.bozzolan, avivey

Subscribers: avivey, tobiaswiese, valerio.bozzolan, Matthew, Cigaryno

Maniphest Tasks: T15715

Differential Revision: https://we.phorge.it/D25520
This commit is contained in:
Benjamin Kausch 2024-01-22 17:33:49 +01:00
parent 2f1e271c5f
commit b035743ce3
2 changed files with 9 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
resources/celerity/map.php
View file

@ -9,7 +9,7 @@ return array(
'names' => array( 'names' => array(
'conpherence.pkg.css' => '2f25eb4f', 'conpherence.pkg.css' => '2f25eb4f',
'conpherence.pkg.js' => '020aebcf', 'conpherence.pkg.js' => '020aebcf',
'core.pkg.css' => '3b2df0d0', 'core.pkg.css' => '4e0e22fb',
'core.pkg.js' => '2eeda9e0', 'core.pkg.js' => '2eeda9e0',
'dark-console.pkg.js' => '187792c2', 'dark-console.pkg.js' => '187792c2',
'differential.pkg.css' => '2431def2', 'differential.pkg.css' => '2431def2',
@ -38,7 +38,7 @@ return array(
'rsrc/css/aphront/typeahead.css' => '8779483d', 'rsrc/css/aphront/typeahead.css' => '8779483d',
'rsrc/css/application/almanac/almanac.css' => '2e050f4f', 'rsrc/css/application/almanac/almanac.css' => '2e050f4f',
'rsrc/css/application/auth/auth.css' => 'c2f23d74', 'rsrc/css/application/auth/auth.css' => 'c2f23d74',
'rsrc/css/application/base/main-menu-view.css' => '5d673247', 'rsrc/css/application/base/main-menu-view.css' => '33820efe',
'rsrc/css/application/base/notification-menu.css' => '4df1ee30', 'rsrc/css/application/base/notification-menu.css' => '4df1ee30',
'rsrc/css/application/base/phui-theme.css' => '35883b37', 'rsrc/css/application/base/phui-theme.css' => '35883b37',
'rsrc/css/application/base/standard-page-view.css' => 'e08c7462', 'rsrc/css/application/base/standard-page-view.css' => 'e08c7462',
@ -790,7 +790,7 @@ return array(
'phabricator-flag-css' => '2b77be8d', 'phabricator-flag-css' => '2b77be8d',
'phabricator-keyboard-shortcut' => '1a844c06', 'phabricator-keyboard-shortcut' => '1a844c06',
'phabricator-keyboard-shortcut-manager' => '81debc48', 'phabricator-keyboard-shortcut-manager' => '81debc48',
'phabricator-main-menu-view' => '5d673247', 'phabricator-main-menu-view' => '33820efe',
'phabricator-nav-view-css' => '423f92cc', 'phabricator-nav-view-css' => '423f92cc',
'phabricator-notification' => 'a9b91e3f', 'phabricator-notification' => 'a9b91e3f',
'phabricator-notification-css' => '30240bd2', 'phabricator-notification-css' => '30240bd2',
@ -1211,6 +1211,9 @@ return array(
'javelin-dom', 'javelin-dom',
'phabricator-notification', 'phabricator-notification',
), ),
'33820efe' => array(
'phui-theme-css',
),
34450586 => array( 34450586 => array(
'javelin-color', 'javelin-color',
'javelin-install', 'javelin-install',
@ -1499,9 +1502,6 @@ return array(
'javelin-dom', 'javelin-dom',
'phuix-dropdown-menu', 'phuix-dropdown-menu',
), ),
'5d673247' => array(
'phui-theme-css',
),
'5d83623b' => array( '5d83623b' => array(
'javelin-dom', 'javelin-dom',
), ),

3
webroot/rsrc/css/application/base/main-menu-view.css
View file

@ -302,6 +302,8 @@ a.phabricator-core-user-menu .caret:before {
background-size: 30px 30px; background-size: 30px 30px;
background-repeat: no-repeat; background-repeat: no-repeat;
position: relative; position: relative;
overflow: hidden;
text-overflow: ellipsis;
} }
.phabricator-main-search-typeahead-result .result-name { .phabricator-main-search-typeahead-result .result-name {
@ -309,6 +311,7 @@ a.phabricator-core-user-menu .caret:before {
font-size: {$normalfontsize}; font-size: {$normalfontsize};
font-weight: bold; font-weight: bold;
color: {$darkgreytext}; color: {$darkgreytext};
white-space: normal;
} }
.phabricator-main-search-typeahead-result.result-closed { .phabricator-main-search-typeahead-result.result-closed {