diff --git a/resources/celerity/map.php b/resources/celerity/map.php index a38bcb01f0..13430be6f8 100644 --- a/resources/celerity/map.php +++ b/resources/celerity/map.php @@ -117,7 +117,7 @@ return array( 'rsrc/css/font/font-roboto-slab.css' => 'f24a53cb', 'rsrc/css/font/phui-font-icon-base.css' => '3dad2ae3', 'rsrc/css/layout/phabricator-filetree-view.css' => 'fccf9f82', - 'rsrc/css/layout/phabricator-hovercard-view.css' => '3a8553e7', + 'rsrc/css/layout/phabricator-hovercard-view.css' => '1239cd52', 'rsrc/css/layout/phabricator-side-menu-view.css' => 'bec2458e', 'rsrc/css/layout/phabricator-source-code-view.css' => '5e0178de', 'rsrc/css/phui/calendar/phui-calendar-day.css' => 'd1cf6f93', @@ -732,7 +732,7 @@ return array( 'phabricator-filetree-view-css' => 'fccf9f82', 'phabricator-flag-css' => '5337623f', 'phabricator-hovercard' => '14ac66f5', - 'phabricator-hovercard-view-css' => '3a8553e7', + 'phabricator-hovercard-view-css' => '1239cd52', 'phabricator-keyboard-shortcut' => '1ae869f2', 'phabricator-keyboard-shortcut-manager' => 'c1700f6f', 'phabricator-main-menu-view' => '2f670a96', diff --git a/src/applications/uiexample/examples/PhabricatorHovercardUIExample.php b/src/applications/uiexample/examples/PhabricatorHovercardUIExample.php index 2f841cdda4..3b3fc323d8 100644 --- a/src/applications/uiexample/examples/PhabricatorHovercardUIExample.php +++ b/src/applications/uiexample/examples/PhabricatorHovercardUIExample.php @@ -51,6 +51,14 @@ final class PhabricatorHovercardUIExample extends PhabricatorUIExample { ->addTag($tag)); $elements[] = $panel; + $badge1 = id(new PHUIBadgeMiniView()) + ->setIcon('fa-book') + ->setHeader(pht('Documenter')); + + $badge2 = id(new PHUIBadgeMiniView()) + ->setIcon('fa-star') + ->setHeader(pht('Contributor')); + $user_handle = $this->createBasicDummyHandle( 'gwashington', PhabricatorPeopleUserPHIDType::TYPECONST, @@ -63,6 +71,8 @@ final class PhabricatorHovercardUIExample extends PhabricatorUIExample { ->addField(pht('Status'), pht('Available')) ->addField(pht('Member since'), '30. February 1750') ->addAction(pht('Send a Message'), '/dev/null') + ->addBadge($badge1) + ->addBadge($badge2) ->setUser($user)); $elements[] = $panel; diff --git a/src/view/widget/hovercard/PhabricatorHovercardView.php b/src/view/widget/hovercard/PhabricatorHovercardView.php index 638e06b2cd..0da3aa9a0a 100644 --- a/src/view/widget/hovercard/PhabricatorHovercardView.php +++ b/src/view/widget/hovercard/PhabricatorHovercardView.php @@ -17,6 +17,7 @@ final class PhabricatorHovercardView extends AphrontView { private $tags = array(); private $fields = array(); private $actions = array(); + private $badges = array(); public function setObjectHandle(PhabricatorObjectHandle $handle) { $this->handle = $handle; @@ -64,6 +65,11 @@ final class PhabricatorHovercardView extends AphrontView { return $this; } + public function addBadge(PHUIBadgeMiniView $badge) { + $this->badges[] = $badge; + return $this; + } + public function render() { if (!$this->handle) { throw new PhutilInvalidStateException('setObjectHandle'); @@ -106,12 +112,24 @@ final class PhabricatorHovercardView extends AphrontView { foreach ($this->fields as $field) { $item = array( phutil_tag('strong', array(), $field['label']), - ' ', + ': ', phutil_tag('span', array(), $field['value']), ); $body[] = phutil_tag_div('phabricator-hovercard-body-item', $item); } + if ($this->badges) { + $badges = id(new PHUIBadgeBoxView()) + ->addItems($this->badges) + ->setCollapsed(true); + $body[] = phutil_tag( + 'div', + array( + 'class' => 'phabricator-hovercard-body-item hovercard-badges', + ), + $badges); + } + if ($handle->getImageURI()) { // Probably a user, we don't need to assume something else // "Prepend" the image by appending $body @@ -163,8 +181,6 @@ final class PhabricatorHovercardView extends AphrontView { $tail = phutil_tag_div('phabricator-hovercard-tail', $buttons); } - // Assemble container - // TODO: Add color support $hovercard = phutil_tag_div( 'phabricator-hovercard-container', array( @@ -173,8 +189,6 @@ final class PhabricatorHovercardView extends AphrontView { $tail, )); - // Wrap for thick border - // and later the tip at the bottom return phutil_tag_div('phabricator-hovercard-wrapper', $hovercard); } diff --git a/webroot/rsrc/css/layout/phabricator-hovercard-view.css b/webroot/rsrc/css/layout/phabricator-hovercard-view.css index 1785474ef1..23b3956763 100644 --- a/webroot/rsrc/css/layout/phabricator-hovercard-view.css +++ b/webroot/rsrc/css/layout/phabricator-hovercard-view.css @@ -56,7 +56,7 @@ } .phabricator-hovercard-body-item { - margin: 2px 0 0 0px; + margin: 4px 0 0 0; } .phabricator-hovercard-body-header { @@ -82,6 +82,15 @@ background-repeat: no-repeat; background-size: 100%; } + +.hovercard-badges { + margin: 8px 0 0 0; +} + +.hovercard-badges .phui-badge-flex-item { + float: left; +} + .phabricator-hovercard-tail { width: 396px; float: left;