diff --git a/resources/celerity/map.php b/resources/celerity/map.php --- a/resources/celerity/map.php +++ b/resources/celerity/map.php @@ -9,7 +9,7 @@ 'names' => array( 'conpherence.pkg.css' => 'e68cf1fa', 'conpherence.pkg.js' => 'b5b51108', - 'core.pkg.css' => '291cbd98', + 'core.pkg.css' => 'b324663c', 'core.pkg.js' => '6c085267', 'darkconsole.pkg.js' => '1f9a31bc', 'differential.pkg.css' => '45951e9e', @@ -29,7 +29,7 @@ 'rsrc/css/aphront/dialog-view.css' => '6bfc244b', 'rsrc/css/aphront/list-filter-view.css' => '5d6f0526', 'rsrc/css/aphront/multi-column.css' => '84cc6640', - 'rsrc/css/aphront/notification.css' => '3f6c89c9', + 'rsrc/css/aphront/notification.css' => '457861ec', 'rsrc/css/aphront/panel-view.css' => '8427b78d', 'rsrc/css/aphront/phabricator-nav-view.css' => 'faf6a6fc', 'rsrc/css/aphront/table-view.css' => 'a3aa6910', @@ -40,7 +40,7 @@ 'rsrc/css/application/almanac/almanac.css' => 'dbb9b3af', 'rsrc/css/application/auth/auth.css' => '0877ed6e', 'rsrc/css/application/base/main-menu-view.css' => '1802a242', - 'rsrc/css/application/base/notification-menu.css' => '73fefdfa', + 'rsrc/css/application/base/notification-menu.css' => '10685bd4', 'rsrc/css/application/base/phui-theme.css' => '9f261c6b', 'rsrc/css/application/base/standard-page-view.css' => '34ee718b', 'rsrc/css/application/chatlog/chatlog.css' => 'd295b020', @@ -792,8 +792,8 @@ 'phabricator-main-menu-view' => '1802a242', 'phabricator-nav-view-css' => 'faf6a6fc', 'phabricator-notification' => '5c3349b2', - 'phabricator-notification-css' => '3f6c89c9', - 'phabricator-notification-menu-css' => '73fefdfa', + 'phabricator-notification-css' => '457861ec', + 'phabricator-notification-menu-css' => '10685bd4', 'phabricator-object-selector-css' => '85ee8ce6', 'phabricator-phtize' => 'd254d646', 'phabricator-prefab' => 'c5af80a2', diff --git a/src/view/phui/PHUIFeedStoryView.php b/src/view/phui/PHUIFeedStoryView.php --- a/src/view/phui/PHUIFeedStoryView.php +++ b/src/view/phui/PHUIFeedStoryView.php @@ -150,13 +150,25 @@ if ($this->getShowTimestamp()) { if ($this->epoch) { if ($user) { - $foot = phabricator_datetime($this->epoch, $user); + $marker = id(new PHUIIconView()) + ->setIcon('fa-circle') + ->addClass('phabricator-notification-status'); + $date = phabricator_datetime($this->epoch, $user); $foot = phutil_tag( 'span', array( 'class' => 'phabricator-notification-date', ), - $foot); + $date); + $foot = phutil_tag( + 'div', + array( + 'class' => 'phabricator-notification-foot', + ), + array( + $marker, + $date, + )); } else { $foot = null; } diff --git a/webroot/rsrc/css/aphront/notification.css b/webroot/rsrc/css/aphront/notification.css --- a/webroot/rsrc/css/aphront/notification.css +++ b/webroot/rsrc/css/aphront/notification.css @@ -11,7 +11,7 @@ .jx-notification { width: 240px; - padding: 8px 16px; + padding: 8px 12px; font-size: 11px; overflow: hidden; diff --git a/webroot/rsrc/css/application/base/notification-menu.css b/webroot/rsrc/css/application/base/notification-menu.css --- a/webroot/rsrc/css/application/base/notification-menu.css +++ b/webroot/rsrc/css/application/base/notification-menu.css @@ -4,7 +4,8 @@ .phabricator-notification-menu { background: {$page.content}; - font-size: {$smallestfontsize}; + font-size: {$smallerfontsize}; + line-height: 18px; word-wrap: break-word; overflow-y: auto; box-shadow: {$dropshadow}; @@ -12,9 +13,8 @@ border-radius: 3px; } -.phabricator-notification .phabricator-notification-date { - margin-left: 8px; - color: {$lightgreytext}; +.phabricator-notification { + padding: 8px 12px; } .phabricator-notification-menu-loading { @@ -44,11 +44,7 @@ } .phabricator-notification-list .phabricator-notification { - padding: 10px 4px; -} - -.phabricator-notification { - padding: 6px 8px; + padding: 8px; } .phabricator-notification-menu .phabricator-notification { @@ -56,7 +52,7 @@ } .device-desktop .phabricator-notification-menu .phabricator-notification:hover { - background: {$hoverblue}; + background: {$lightgreybackground}; } .device-desktop .phabricator-notification-menu @@ -81,9 +77,34 @@ color: {$lightgreytext}; } +.phabricator-notification-foot { + color: {$lightgreytext}; + font-size: {$smallestfontsize}; + line-height: 18px; + position: relative; +} + +.phabricator-notification-unread .phabricator-notification-foot { + padding-left: 10px; +} + +.phabricator-notification-foot .phabricator-notification-status { + display: none; +} + +.phabricator-notification-unread .phabricator-notification-foot + .phabricator-notification-status { + font-size: 7px; + color: {$lightgreytext}; + position: absolute; + display: inline-block; + top: 6px; + left: 0; +} + .phabricator-notification-header { font-weight: bold; - padding: 10px 8px; + padding: 10px 12px; font-size: {$smallerfontsize}; border-bottom: 1px solid {$thinblueborder}; }