diff --git a/resources/celerity/map.php b/resources/celerity/map.php index df05681185..bba3e312b1 100644 --- a/resources/celerity/map.php +++ b/resources/celerity/map.php @@ -7,7 +7,7 @@ */ return array( 'names' => array( - 'core.pkg.css' => 'd3b3a609', + 'core.pkg.css' => '9c8e888d', 'core.pkg.js' => '7d8faf57', 'darkconsole.pkg.js' => 'e7393ebb', 'differential.pkg.css' => '2de124c9', @@ -149,14 +149,14 @@ return array( 'rsrc/css/phui/phui-pager.css' => 'bea33d23', 'rsrc/css/phui/phui-pinboard-view.css' => '2495140e', 'rsrc/css/phui/phui-profile-menu.css' => '7e92a89a', - 'rsrc/css/phui/phui-property-list-view.css' => '27b2849e', + 'rsrc/css/phui/phui-property-list-view.css' => 'b12e801c', 'rsrc/css/phui/phui-remarkup-preview.css' => '1a8f2591', 'rsrc/css/phui/phui-segment-bar-view.css' => '46342871', 'rsrc/css/phui/phui-spacing.css' => '042804d6', 'rsrc/css/phui/phui-status.css' => '37309046', 'rsrc/css/phui/phui-tag-view.css' => '6bbd83e2', - 'rsrc/css/phui/phui-timeline-view.css' => '2efceff8', - 'rsrc/css/phui/phui-two-column-view.css' => '38871c98', + 'rsrc/css/phui/phui-timeline-view.css' => 'a0173eba', + 'rsrc/css/phui/phui-two-column-view.css' => 'e6bf86b6', 'rsrc/css/phui/workboards/phui-workboard-color.css' => 'ac6fe6a7', 'rsrc/css/phui/workboards/phui-workboard.css' => 'e6d89647', 'rsrc/css/phui/workboards/phui-workcard.css' => '3646fb96', @@ -273,6 +273,7 @@ return array( 'rsrc/image/checker_dark.png' => 'd8e65881', 'rsrc/image/checker_light.png' => 'a0155918', 'rsrc/image/checker_lighter.png' => 'd5da91b6', + 'rsrc/image/d5d8e1.png' => '0c2a1497', 'rsrc/image/darkload.gif' => '1ffd3ec6', 'rsrc/image/divot.png' => '94dded62', 'rsrc/image/examples/hero.png' => '979a86ae', @@ -837,15 +838,15 @@ return array( 'phui-pager-css' => 'bea33d23', 'phui-pinboard-view-css' => '2495140e', 'phui-profile-menu-css' => '7e92a89a', - 'phui-property-list-view-css' => '27b2849e', + 'phui-property-list-view-css' => 'b12e801c', 'phui-remarkup-preview-css' => '1a8f2591', 'phui-segment-bar-view-css' => '46342871', 'phui-spacing-css' => '042804d6', 'phui-status-list-view-css' => '37309046', 'phui-tag-view-css' => '6bbd83e2', 'phui-theme-css' => '027ba77e', - 'phui-timeline-view-css' => '2efceff8', - 'phui-two-column-view-css' => '38871c98', + 'phui-timeline-view-css' => 'a0173eba', + 'phui-two-column-view-css' => 'e6bf86b6', 'phui-workboard-color-css' => 'ac6fe6a7', 'phui-workboard-view-css' => 'e6d89647', 'phui-workcard-view-css' => '3646fb96', diff --git a/src/applications/celerity/postprocessor/CelerityDefaultPostprocessor.php b/src/applications/celerity/postprocessor/CelerityDefaultPostprocessor.php index 13cef002cf..7d87d28ff2 100644 --- a/src/applications/celerity/postprocessor/CelerityDefaultPostprocessor.php +++ b/src/applications/celerity/postprocessor/CelerityDefaultPostprocessor.php @@ -71,6 +71,7 @@ final class CelerityDefaultPostprocessor 'hoverselectedgrey' => '#bbc4ca', 'hoverselectedblue' => '#e6e9ee', 'borderinset' => 'inset 0 0 0 1px rgba(55,55,55,.15)', + 'timeline' => '#d5d8e1', // Alphas 'alphawhite' => '255,255,255', diff --git a/src/applications/metamta/contentsource/PhabricatorContentSourceView.php b/src/applications/metamta/contentsource/PhabricatorContentSourceView.php index f159b2059d..5b19f41cb2 100644 --- a/src/applications/metamta/contentsource/PhabricatorContentSourceView.php +++ b/src/applications/metamta/contentsource/PhabricatorContentSourceView.php @@ -9,6 +9,13 @@ final class PhabricatorContentSourceView extends AphrontView { return $this; } + public function getSourceName() { + $map = PhabricatorContentSource::getSourceNameMap(); + $source = $this->contentSource->getSource(); + return idx($map, $source, null); + + } + public function render() { require_celerity_resource('phabricator-content-source-view-css'); diff --git a/src/view/phui/PHUITimelineEventView.php b/src/view/phui/PHUITimelineEventView.php index ecd9329860..0d9b75782f 100644 --- a/src/view/phui/PHUITimelineEventView.php +++ b/src/view/phui/PHUITimelineEventView.php @@ -232,11 +232,12 @@ final class PHUITimelineEventView extends AphrontView { $fill_classes = array(); $fill_classes[] = 'phui-timeline-icon-fill'; if ($this->color) { + $fill_classes[] = 'fill-has-color'; $fill_classes[] = 'phui-timeline-icon-fill-'.$this->color; } $icon = id(new PHUIIconView()) - ->setIcon($this->icon.' white') + ->setIcon($this->icon) ->addClass('phui-timeline-icon'); $icon = phutil_tag( @@ -504,11 +505,12 @@ final class PHUITimelineEventView extends AphrontView { } $source = $this->getContentSource(); + $content_source = null; if ($source) { - $extra[] = id(new PhabricatorContentSourceView()) + $content_source = id(new PhabricatorContentSourceView()) ->setContentSource($source) - ->setUser($this->getUser()) - ->render(); + ->setUser($this->getUser()); + $content_source = pht('Via %s', $content_source->getSourceName()); } $date_created = null; @@ -528,6 +530,7 @@ final class PHUITimelineEventView extends AphrontView { $this->getUser()); if ($this->anchor) { Javelin::initBehavior('phabricator-watch-anchor'); + Javelin::initBehavior('phabricator-tooltips'); $anchor = id(new PhabricatorAnchorView()) ->setAnchorName($this->anchor) @@ -535,10 +538,14 @@ final class PHUITimelineEventView extends AphrontView { $date = array( $anchor, - phutil_tag( + javelin_tag( 'a', array( 'href' => '#'.$this->anchor, + 'sigil' => 'has-tooltip', + 'meta' => array( + 'tip' => $content_source, + ), ), $date), ); diff --git a/webroot/rsrc/css/phui/phui-property-list-view.css b/webroot/rsrc/css/phui/phui-property-list-view.css index 3558bf7a9e..52e3ee0944 100644 --- a/webroot/rsrc/css/phui/phui-property-list-view.css +++ b/webroot/rsrc/css/phui/phui-property-list-view.css @@ -125,7 +125,7 @@ } .phui-property-list-text-content { - padding: 12px 4px; + padding: 16px 4px; overflow: hidden; } diff --git a/webroot/rsrc/css/phui/phui-timeline-view.css b/webroot/rsrc/css/phui/phui-timeline-view.css index d69df93953..ed4f77aa61 100644 --- a/webroot/rsrc/css/phui/phui-timeline-view.css +++ b/webroot/rsrc/css/phui/phui-timeline-view.css @@ -4,9 +4,9 @@ .phui-timeline-view { padding: 0 16px; - background-image: url('/rsrc/image/BFCFDA.png'); + background-image: url('/rsrc/image/d5d8e1.png'); background-repeat: repeat-y; - background-position: 94px; + background-position: 96px; } .device .phui-timeline-view { @@ -23,8 +23,8 @@ } .phui-timeline-major-event .phui-timeline-group { - border-left: 1px solid {$lightblueborder}; - border-right: 1px solid {$lightblueborder}; + border-left: 1px solid {$timeline}; + border-right: 1px solid {$timeline}; border-radius: 3px; } @@ -34,7 +34,7 @@ } .device-desktop .phui-timeline-event-view.phui-timeline-minor-event { - margin-left: 65px; + margin-left: 67px; } .device-desktop .phui-timeline-spacer { @@ -50,7 +50,7 @@ } .device-desktop .phui-timeline-wedge { - border-bottom: 1px solid {$lightblueborder}; + border-bottom: 1px solid {$timeline}; position: absolute; width: 12px; } @@ -61,25 +61,25 @@ } .phui-timeline-major-event .phui-timeline-content { - border-top: 1px solid {$lightblueborder}; - border-bottom: 1px solid {$lightblueborder}; + border-top: 1px solid {$timeline}; + border-bottom: 1px solid {$timeline}; border-radius: 3px; } .phui-timeline-title { - line-height: 22px; + line-height: 24px; min-height: 19px; position: relative; - color: {$bluetext}; + color: {$greytext}; } .phui-timeline-minor-event .phui-timeline-title { - padding: 4px 8px 4px 33px; + padding: 1px 8px 4px 33px; } .phui-timeline-title a { font-weight: bold; - color: {$darkbluetext}; + color: {$darkgreytext}; } .device-desktop .phui-timeline-wedge { @@ -91,7 +91,7 @@ } .device-desktop .phui-timeline-minor-event .phui-timeline-wedge { - top: 13px; + top: 12px; left: -18px; width: 20px; } @@ -100,7 +100,6 @@ background-repeat: no-repeat; position: absolute; border-radius: 3px; - box-shadow: {$borderinset}; background-size: 100%; display: block; } @@ -113,22 +112,29 @@ } .device-desktop .phui-timeline-minor-event .phui-timeline-image { - width: 28px; - height: 28px; - background-size: 28px auto; + width: 26px; + height: 26px; + background-size: 26px auto; left: -41px; } .phui-timeline-major-event .phui-timeline-title { - background: {$lightbluebackground}; + background: {$lightgreybackground}; min-height: 22px; border-top-right-radius: 3px; + border-top-left-radius: 3px; } -.phui-timeline-title + .phui-timeline-title { +.phui-timeline-major-event .phui-timeline-title + .phui-timeline-title { border-radius: 0; + padding-top: 0; } +.phui-timeline-major-event .phui-timeline-title + .phui-timeline-title + .phui-timeline-icon-fill { + margin-top: 0; + } + .phui-timeline-title { padding: 5px 8px; overflow-x: auto; @@ -136,7 +142,7 @@ } .phui-timeline-title-with-icon { - padding-left: 38px; + padding-left: 36px; } .phui-timeline-title-with-menu { @@ -170,9 +176,10 @@ .phui-timeline-major-event .phui-timeline-content .phui-timeline-core-content { - padding: 16px 12px; + padding: 16px; line-height: 18px; background: #fff; + border-top: 1px solid rgba({$alphablue},.1); border-bottom-left-radius: 3px; border-bottom-right-radius: 3px; } @@ -203,52 +210,49 @@ border-width: 0; } -.phui-timeline-spacer.phui-timeline-spacer-bold { - border-bottom: 4px solid {$lightblueborder}; - margin: 0; -} - -.phui-timeline-spacer-bold + .phui-timeline-spacer { - background-color: #ebecee; -} - .phui-timeline-icon-fill { position: absolute; - width: 32px; - height: 32px; - background-color: {$lightblueborder}; + width: 34px; + height: 34px; top: 0; left: 0; text-align: center; } -.phui-icon-view.phui-timeline-icon:before { - font-size: 15px; +.phui-timeline-icon { + color: {$sh-blueicon}; } -.phui-timeline-minor-event .phui-timeline-icon-fill { - height: 28px; - width: 28px; +.phui-icon-view.phui-timeline-icon { + font-size: 14px; +} + +.phui-timeline-icon-fill { + height: 26px; + width: 26px; border-radius: 3px; + background-color: #E6E9F1; +} + +.phui-timeline-major-event .phui-timeline-icon-fill { + margin: 4px; } .phui-timeline-icon-fill .phui-timeline-icon { - margin-top: 8px; -} - -.phui-timeline-minor-event .phui-timeline-icon-fill .phui-timeline-icon { - margin-top: 7px; + margin-top: 6px; } .phui-timeline-extra, .phui-timeline-extra .phabricator-content-source-view { - font-size: {$smallestfontsize}; + font-size: {$smallerfontsize}; font-weight: normal; - color: {$lightbluetext}; + color: {$lightgreytext}; + margin-left: 8px; } .phui-timeline-title .phui-timeline-extra a { font-weight: normal; + color: {$lightgreytext}; } .device-desktop .phui-timeline-extra { @@ -267,6 +271,10 @@ margin: 0; } +.phui-timeline-icon-fill.fill-has-color .phui-icon-view { + color: #fff; +} + .phui-timeline-icon-fill-red { background-color: {$red}; } @@ -304,7 +312,7 @@ } .phui-timeline-icon-fill-black { - background-color: #333; + background-color: #000; } .phui-timeline-shell.anchor-target { @@ -343,7 +351,7 @@ .phui-timeline-title .phui-timeline-extra-information a { font-weight: normal; - color: {$bluetext}; + color: {$greytext}; } .phui-timeline-comment-actions .phui-icon-view { @@ -359,11 +367,11 @@ right: 3px; top: 6px; width: 28px; - height: 22px; + height: 24px; text-align: center; line-height: 22px; - font-size: 15px; - border-left: 1px solid {$lightblueborder}; + font-size: 16px; + border-left: 1px solid {$thinblueborder}; } .phui-timeline-menu:focus { @@ -379,11 +387,13 @@ a.phui-timeline-menu .phui-icon-view { } .device-desktop a.phui-timeline-menu:hover .phui-icon-view { - color: {$darkgreytext}; + color: {$sky}; } .phui-timeline-menu.phuix-dropdown-open { - background: {$hovergrey}; + background: rgba({$alphablue},0.1); + border: none; + border-radius: 3px; } .phui-timeline-view + .phui-object-box { diff --git a/webroot/rsrc/css/phui/phui-two-column-view.css b/webroot/rsrc/css/phui/phui-two-column-view.css index 156b061c07..090fafb63a 100644 --- a/webroot/rsrc/css/phui/phui-two-column-view.css +++ b/webroot/rsrc/css/phui/phui-two-column-view.css @@ -87,7 +87,7 @@ .phui-two-column-view .phui-timeline-view { padding: 0; - background-position: 78px; + background-position: 80px; } .phui-two-column-view .phui-main-column .phui-object-box + .phui-timeline-view { @@ -107,6 +107,10 @@ border-top: 1px solid {$thinblueborder}; } +.device-phone .phui-main-column .phui-timeline-older-transactions-are-hidden { + margin: 0; +} + /* Main Column Properties */ .device-desktop .phui-main-column .phui-property-list-key { diff --git a/webroot/rsrc/image/d5d8e1.png b/webroot/rsrc/image/d5d8e1.png new file mode 100644 index 0000000000..352aeb61dc Binary files /dev/null and b/webroot/rsrc/image/d5d8e1.png differ