From a46ead79800780dabebec7b49f84ced0378af563 Mon Sep 17 00:00:00 2001 From: Chad Little Date: Mon, 28 Apr 2014 19:43:00 -0700 Subject: [PATCH] Update inline-comment styles in Differential Summary: Moderize Inline Comment Display - Use standard colors - Better display with/without comment - OMG Icons Test Plan: {F148256} Test with and without main comment, test with many for few comments on 1-3 files. Reviewers: epriestley, btrahan Reviewed By: btrahan Subscribers: epriestley, Korvin Differential Revision: https://secure.phabricator.com/D8885 --- resources/celerity/map.php | 6 ++-- .../view/PhabricatorInlineSummaryView.php | 14 ++++++++- .../diff/inline-comment-summary.css | 31 ++++++++++++++----- 3 files changed, 40 insertions(+), 11 deletions(-) diff --git a/resources/celerity/map.php b/resources/celerity/map.php index 107bcfa0ef..96e6a03906 100644 --- a/resources/celerity/map.php +++ b/resources/celerity/map.php @@ -10,7 +10,7 @@ return array( 'core.pkg.css' => '9e7cce62', 'core.pkg.js' => '417722ff', 'darkconsole.pkg.js' => 'ca8671ce', - 'differential.pkg.css' => '12c11318', + 'differential.pkg.css' => '8a064eb7', 'differential.pkg.js' => '11a5b750', 'diffusion.pkg.css' => '3783278d', 'diffusion.pkg.js' => '5b4010f4', @@ -52,7 +52,7 @@ return array( 'rsrc/css/application/conpherence/widget-pane.css' => '87b12e0c', 'rsrc/css/application/contentsource/content-source-view.css' => '4b8b05d4', 'rsrc/css/application/countdown/timer.css' => '86b7b0a0', - 'rsrc/css/application/diff/inline-comment-summary.css' => '14a91639', + 'rsrc/css/application/diff/inline-comment-summary.css' => '3b2d1492', 'rsrc/css/application/differential/add-comment.css' => 'c478bcaa', 'rsrc/css/application/differential/changeset-view.css' => '1570a1ff', 'rsrc/css/application/differential/core.css' => '7ac3cabc', @@ -526,7 +526,7 @@ return array( 'herald-css' => 'c544dd1c', 'herald-rule-editor' => '22d2966a', 'herald-test-css' => '778b008e', - 'inline-comment-summary-css' => '14a91639', + 'inline-comment-summary-css' => '3b2d1492', 'javelin-aphlict' => '493665ee', 'javelin-behavior' => '8a3ed18b', 'javelin-behavior-aphlict-dropdown' => '2a2dba85', diff --git a/src/infrastructure/diff/view/PhabricatorInlineSummaryView.php b/src/infrastructure/diff/view/PhabricatorInlineSummaryView.php index 3e0def54b8..ab40c38264 100644 --- a/src/infrastructure/diff/view/PhabricatorInlineSummaryView.php +++ b/src/infrastructure/diff/view/PhabricatorInlineSummaryView.php @@ -19,7 +19,15 @@ final class PhabricatorInlineSummaryView extends AphrontView { } private function renderHeader() { - return phutil_tag_div('phabricator-inline-summary', pht('Inline Comments')); + $icon = id(new PHUIIconView()) + ->setIconFont('fa-comment bluegrey msr'); + + $header = phutil_tag_div( + 'phabricator-inline-summary', + array( + $icon, + pht('Inline Comments'))); + return $header; } private function renderTable() { @@ -59,6 +67,9 @@ final class PhabricatorInlineSummaryView extends AphrontView { } if ($href) { + $icon = id(new PHUIIconView()) + ->setIconFont('fa-share white msr'); + $lines = phutil_tag( 'a', array( @@ -67,6 +78,7 @@ final class PhabricatorInlineSummaryView extends AphrontView { 'class' => 'num', ), array( + $icon, $lines, $tail, )); diff --git a/webroot/rsrc/css/application/diff/inline-comment-summary.css b/webroot/rsrc/css/application/diff/inline-comment-summary.css index 70ddba71d8..1fea188e71 100644 --- a/webroot/rsrc/css/application/diff/inline-comment-summary.css +++ b/webroot/rsrc/css/application/diff/inline-comment-summary.css @@ -3,10 +3,17 @@ */ .phabricator-inline-summary { - margin: .75em 0 .5em; - font-size: 11px; - border-bottom: 1px solid #dddddd; - color: {$greytext}; + font-size: 12px; + text-transform: uppercase; + font-weight: bold; + color: {$bluetext}; + padding-top: 12px; + margin-top: 12px; + border-top: 1px solid {$thinblueborder}; +} + +.phabricator-remarkup + .phabricator-inline-summary { + padding-top: 16px; } .phabricator-inline-summary-table { @@ -15,17 +22,19 @@ .phabricator-inline-summary-table th { padding: 6px 0px; - color: {$darkgreytext}; + color: {$lightgreytext}; } .phabricator-inline-summary-table td { padding: 0px 4px 6px; white-space: nowrap; + color: {$darkbluetext}; } .phabricator-inline-summary-table td.inline-line-number { padding-left: 0px; width: 100px; + white-space: nowrap; } .phabricator-inline-summary-table td.inline-which-diff { @@ -43,13 +52,21 @@ target (by highlighting the entire cell). */ .phabricator-inline-summary-table td.inline-line-number a.num { - padding-left: 16px; + padding-left: 4px; display: block; font-weight: bold; + color: {$blue}; } .phabricator-inline-summary-table td.inline-line-number a.num:hover { - background: #3b5998; + background: {$blue}; + border-radius: 3px; color: white; text-decoration: none; } + +.phui-timeline-core-content .phabricator-inline-summary:first-child { + border: none; + margin-top: 0; + padding-top: 0; +}