recaptime.dev / phorge
@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.

Fix content overflow in user hovercards

Summary:
Fixes T13273. This element is a bit weird, but I think I fixed it without breaking anything.

The CSS is used by project hovercards and user hovercards, but they each have a class which builds mostly-shared-but-not-really-identical CSS, instead of having a single `View` class with modes. So I'm not 100% sure I didn't break something obscure, but I couldn't find anything this breaks.

The major issue is that all the text content has "position: absolute". Instead, make the image "absolute" and the text actual positioned content. Then fix all the margins/padding/spacing/layout and add overflow. Seems to work?

Plus: hide availability for disabled users, for consistency with D20342.

Test Plan:
Before:

{F6320155}

After:

{F6320156}

I think this is pixel-exact except for the overflow behavior.

Also:

- Viewed some other user hovercards, including a disabled user. They all looked unchanged.
- Viewed some project hovercards. They all looked good, too.

Reviewers: amckinley

Reviewed By: amckinley

Maniphest Tasks: T13273

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

epriestley c4856c37 eecee172

+33 -16
+2 -2
resources/celerity/map.php
··· 99 99 'rsrc/css/application/policy/policy-transaction-detail.css' => 'c02b8384', 100 100 'rsrc/css/application/policy/policy.css' => 'ceb56a08', 101 101 'rsrc/css/application/ponder/ponder-view.css' => '05a09d0a', 102 - 'rsrc/css/application/project/project-card-view.css' => '3b1f7b20', 102 + 'rsrc/css/application/project/project-card-view.css' => '4e7371cd', 103 103 'rsrc/css/application/project/project-triggers.css' => 'cb866c2d', 104 104 'rsrc/css/application/project/project-view.css' => '567858b3', 105 105 'rsrc/css/application/releeph/releeph-core.css' => 'f81ff2db', ··· 881 881 'policy-edit-css' => '8794e2ed', 882 882 'policy-transaction-detail-css' => 'c02b8384', 883 883 'ponder-view-css' => '05a09d0a', 884 - 'project-card-view-css' => '3b1f7b20', 884 + 'project-card-view-css' => '4e7371cd', 885 885 'project-triggers-css' => 'cb866c2d', 886 886 'project-view-css' => '567858b3', 887 887 'releeph-core' => 'f81ff2db',
+12 -9
src/applications/people/view/PhabricatorUserCardView.php
··· 95 95 'fa-user-plus', 96 96 phabricator_date($user->getDateCreated(), $viewer)); 97 97 98 - if (PhabricatorApplication::isClassInstalledForViewer( 99 - 'PhabricatorCalendarApplication', 100 - $viewer)) { 101 - $body[] = $this->addItem( 102 - 'fa-calendar-o', 103 - id(new PHUIUserAvailabilityView()) 104 - ->setViewer($viewer) 105 - ->setAvailableUser($user)); 98 + $has_calendar = PhabricatorApplication::isClassInstalledForViewer( 99 + 'PhabricatorCalendarApplication', 100 + $viewer); 101 + if ($has_calendar) { 102 + if (!$user->getIsDisabled()) { 103 + $body[] = $this->addItem( 104 + 'fa-calendar-o', 105 + id(new PHUIUserAvailabilityView()) 106 + ->setViewer($viewer) 107 + ->setAvailableUser($user)); 108 + } 106 109 } 107 110 108 111 $classes[] = 'project-card-image'; ··· 150 153 'class' => 'project-card-inner', 151 154 ), 152 155 array( 153 - $image, 154 156 $header, 157 + $image, 155 158 )); 156 159 157 160 return $card;
+19 -5
webroot/rsrc/css/application/project/project-card-view.css
··· 36 36 } 37 37 38 38 .project-card-view .project-card-image { 39 + position: absolute; 39 40 height: 140px; 40 41 width: 140px; 41 - margin: 6px; 42 + top: 6px; 43 + left: 6px; 42 44 border-radius: 3px; 43 45 } 44 46 45 47 .project-card-view .project-card-image-href { 46 - display: inline-block; 48 + display: block; 47 49 } 48 50 49 51 .project-card-view .project-card-item div { 50 52 display: inline; 51 53 } 52 54 55 + .project-card-inner { 56 + position: relative; 57 + } 58 + 59 + .people-card-view .project-card-inner { 60 + padding: 6px; 61 + min-height: 140px; 62 + } 63 + 53 64 .project-card-view .project-card-item { 54 65 margin-bottom: 2px; 66 + white-space: nowrap; 67 + overflow: hidden; 68 + text-overflow: ellipsis; 55 69 } 56 70 57 71 .project-card-view .project-card-item-text { ··· 63 77 } 64 78 65 79 .project-card-view .project-card-header { 66 - position: absolute; 67 - top: 12px; 68 - left: 158px; 80 + margin-top: 6px; 81 + margin-left: 152px; 82 + overflow: hidden; 69 83 } 70 84 71 85 .project-card-header .project-card-name {