Page MenuHomePhabricator
Files F14012087

D12171.id29291.diff
No OneTemporary
Actions

D12171.id29291.diff
View Options

diff --git a/resources/celerity/map.php b/resources/celerity/map.php
--- a/resources/celerity/map.php
+++ b/resources/celerity/map.php
@@ -7,10 +7,10 @@
*/
return array(
'names' => array(
- 'core.pkg.css' => '1601392f',
+ 'core.pkg.css' => '2ff29d1d',
'core.pkg.js' => '75599122',
'darkconsole.pkg.js' => '8ab24e01',
- 'differential.pkg.css' => '5a0b221c',
+ 'differential.pkg.css' => '571b1cc1',
'differential.pkg.js' => 'e324301d',
'diffusion.pkg.css' => '591664fa',
'diffusion.pkg.js' => 'bfc0737b',
@@ -54,11 +54,12 @@
'rsrc/css/application/countdown/timer.css' => '86b7b0a0',
'rsrc/css/application/dashboard/dashboard.css' => '17937d22',
'rsrc/css/application/diff/inline-comment-summary.css' => 'eb5f8e8c',
- 'rsrc/css/application/differential/add-comment.css' => 'c478bcaa',
- 'rsrc/css/application/differential/changeset-view.css' => 'c5d1e738',
+ 'rsrc/css/application/differential/add-comment.css' => 'c47f8c40',
+ 'rsrc/css/application/differential/changeset-view.css' => 'f36406b1',
'rsrc/css/application/differential/core.css' => '7ac3cabc',
+ 'rsrc/css/application/differential/phui-inline-comment.css' => '17e89126',
'rsrc/css/application/differential/results-table.css' => '181aa9d9',
- 'rsrc/css/application/differential/revision-comment.css' => '64603753',
+ 'rsrc/css/application/differential/revision-comment.css' => '024dda6b',
'rsrc/css/application/differential/revision-history.css' => '0e8eb855',
'rsrc/css/application/differential/revision-list.css' => 'f3c47d33',
'rsrc/css/application/differential/table-of-contents.css' => '63f3ef4a',
@@ -124,7 +125,7 @@
'rsrc/css/phui/phui-action-list.css' => '9ee9910a',
'rsrc/css/phui/phui-action-panel.css' => '3ee9afd5',
'rsrc/css/phui/phui-box.css' => '7b3a2eed',
- 'rsrc/css/phui/phui-button.css' => '57eaddc9',
+ 'rsrc/css/phui/phui-button.css' => '53f55a72',
'rsrc/css/phui/phui-crumbs-view.css' => '594d719e',
'rsrc/css/phui/phui-document.css' => '0f83a7df',
'rsrc/css/phui/phui-feed-story.css' => 'c9f3a0b5',
@@ -520,12 +521,12 @@
'conpherence-thread-manager' => 'bb928342',
'conpherence-update-css' => '1099a660',
'conpherence-widget-pane-css' => '1979ee8c',
- 'differential-changeset-view-css' => 'c5d1e738',
+ 'differential-changeset-view-css' => 'f36406b1',
'differential-core-view-css' => '7ac3cabc',
'differential-inline-comment-editor' => 'b3412377',
'differential-results-table-css' => '181aa9d9',
- 'differential-revision-add-comment-css' => 'c478bcaa',
- 'differential-revision-comment-css' => '64603753',
+ 'differential-revision-add-comment-css' => 'c47f8c40',
+ 'differential-revision-comment-css' => '024dda6b',
'differential-revision-history-css' => '0e8eb855',
'differential-revision-list-css' => 'f3c47d33',
'differential-table-of-contents-css' => '63f3ef4a',
@@ -772,7 +773,7 @@
'phui-action-header-view-css' => '89c497e7',
'phui-action-panel-css' => '3ee9afd5',
'phui-box-css' => '7b3a2eed',
- 'phui-button-css' => '57eaddc9',
+ 'phui-button-css' => '53f55a72',
'phui-calendar-css' => '8675968e',
'phui-calendar-day-css' => 'de035c8a',
'phui-calendar-list-css' => 'c1d0ca59',
@@ -789,6 +790,7 @@
'phui-image-mask-css' => '5a8b09c8',
'phui-info-panel-css' => '27ea50a1',
'phui-info-view-css' => 'c6f0aef8',
+ 'phui-inline-comment-view-css' => '17e89126',
'phui-list-view-css' => '2e25ebfb',
'phui-object-box-css' => 'd68ce5dc',
'phui-object-item-list-view-css' => '9db65899',
@@ -1921,6 +1923,9 @@
'multirow-row-manager',
'javelin-json',
),
+ 'f36406b1' => array(
+ 'phui-inline-comment-view-css',
+ ),
'f36e01af' => array(
'javelin-behavior',
'javelin-behavior-device',
diff --git a/src/infrastructure/diff/view/PHUIDiffInlineCommentDetailView.php b/src/infrastructure/diff/view/PHUIDiffInlineCommentDetailView.php
--- a/src/infrastructure/diff/view/PHUIDiffInlineCommentDetailView.php
+++ b/src/infrastructure/diff/view/PHUIDiffInlineCommentDetailView.php
@@ -71,20 +71,14 @@
return $this->objectOwnerPHID;
}
-
-
public function render() {
+ require_celerity_resource('phui-inline-comment-view-css');
$inline = $this->inlineComment;
- $start = $inline->getLineNumber();
- $length = $inline->getLineLength();
- if ($length) {
- $end = $start + $length;
- $line = 'Lines '.number_format($start).'-'.number_format($end);
- } else {
- $line = 'Line '.number_format($start);
- }
+ $classes = array(
+ 'differential-inline-comment',
+ );
$metadata = array(
'id' => $inline->getID(),
@@ -117,40 +111,54 @@
$is_synthetic = true;
}
- $is_draft = false;
- if ($inline->isDraft() && !$is_synthetic) {
- $links[] = pht('Not Submitted Yet');
- $is_draft = true;
+ $draft_text = null;
+ if (!$is_synthetic) {
+ // This display is controlled by CSS
+ $draft_text = id(new PHUITagView())
+ ->setType(PHUITagView::TYPE_SHADE)
+ ->setName(pht('Unsubmitted'))
+ ->setSlimShady(true)
+ ->setShade(PHUITagView::COLOR_RED)
+ ->addClass('mml inline-draft-text');
}
-
- // TODO: This stuff is nonfinal, just making it do something.
+ // I think this is unused
if ($inline->getHasReplies()) {
- $links[] = pht('Has Reply');
- $classes[] = 'inline-has-reply';
+ $classes[] = 'inline-comment-has-reply';
}
+ // I think this is unused
if ($inline->getReplyToCommentPHID()) {
- $links[] = pht('Is Reply');
+ $classes[] = 'inline-comment-is-reply';
+ }
+ // Might break?
+ if ($this->getCanMarkDone()) {
+ $classes[] = 'viewer-is-diff-author';
}
+ $action_buttons = new PHUIButtonBarView();
+ $action_buttons->addClass('mml');
+ $nextprev = null;
if (!$this->preview) {
- $links[] = javelin_tag(
- 'a',
- array(
- 'href' => '#',
- 'mustcapture' => true,
- 'sigil' => 'differential-inline-prev',
- ),
- pht('Previous'));
-
- $links[] = javelin_tag(
- 'a',
- array(
- 'href' => '#',
- 'mustcapture' => true,
- 'sigil' => 'differential-inline-next',
- ),
- pht('Next'));
+ $nextprev = new PHUIButtonBarView();
+ $nextprev->addClass('mml');
+ $up = id(new PHUIButtonView())
+ ->setTag('a')
+ ->setColor(PHUIButtonView::SIMPLE)
+ ->setTooltip(pht('Previous'))
+ ->setIconFont('fa-chevron-up')
+ ->addSigil('differential-inline-prev')
+ ->setMustCapture(true);
+
+ $down = id(new PHUIButtonView())
+ ->setTag('a')
+ ->setColor(PHUIButtonView::SIMPLE)
+ ->setTooltip(pht('Next'))
+ ->setIconFont('fa-chevron-down')
+ ->addSigil('differential-inline-next')
+ ->setMustCapture(true);
+
+ $nextprev->addButton($up);
+ $nextprev->addButton($down);
if ($this->allowReply) {
@@ -161,14 +169,14 @@
// file/line information, and synthetic comments don't have an inline
// comment ID.
- $links[] = javelin_tag(
- 'a',
- array(
- 'href' => '#',
- 'mustcapture' => true,
- 'sigil' => 'differential-inline-reply',
- ),
- pht('Reply'));
+ $reply_button = id(new PHUIButtonView())
+ ->setTag('a')
+ ->setColor(PHUIButtonView::SIMPLE)
+ ->setIconFont('fa-reply')
+ ->setTooltip(pht('Reply'))
+ ->addSigil('differential-inline-reply')
+ ->setMustCapture(true);
+ $action_buttons->addButton($reply_button);
}
}
@@ -177,42 +185,48 @@
$anchor_name = 'inline-'.$inline->getID();
if ($this->editable && !$this->preview) {
- $links[] = javelin_tag(
- 'a',
- array(
- 'href' => '#',
- 'mustcapture' => true,
- 'sigil' => 'differential-inline-edit',
- ),
- pht('Edit'));
- $links[] = javelin_tag(
- 'a',
- array(
- 'href' => '#',
- 'mustcapture' => true,
- 'sigil' => 'differential-inline-delete',
- ),
- pht('Delete'));
+ $edit_button = id(new PHUIButtonView())
+ ->setTag('a')
+ ->setColor(PHUIButtonView::SIMPLE)
+ ->setIconFont('fa-pencil')
+ ->setTooltip(pht('Edit'))
+ ->addSigil('differential-inline-edit')
+ ->setMustCapture(true);
+ $action_buttons->addButton($edit_button);
+
+ $delete_button = id(new PHUIButtonView())
+ ->setTag('a')
+ ->setColor(PHUIButtonView::SIMPLE)
+ ->setIconFont('fa-trash-o')
+ ->setTooltip(pht('Delete'))
+ ->addSigil('differential-inline-delete')
+ ->setMustCapture(true);
+ $action_buttons->addButton($delete_button);
+
} else if ($this->preview) {
$links[] = javelin_tag(
'a',
array(
+ 'class' => 'button simple',
'meta' => array(
'anchor' => $anchor_name,
),
'sigil' => 'differential-inline-preview-jump',
),
pht('Not Visible'));
- $links[] = javelin_tag(
- 'a',
- array(
- 'href' => '#',
- 'mustcapture' => true,
- 'sigil' => 'differential-inline-delete',
- ),
- pht('Delete'));
+
+ $delete_button = id(new PHUIButtonView())
+ ->setTag('a')
+ ->setColor(PHUIButtonView::SIMPLE)
+ ->setTooltip(pht('Delete'))
+ ->setIconFont('fa-trash-o')
+ ->addSigil('differential-inline-delete')
+ ->setMustCapture(true);
+ $action_buttons->addButton($delete_button);
}
+ $done_button = null;
+
if (!$is_synthetic) {
$draft_state = false;
switch ($inline->getFixedState()) {
@@ -241,7 +255,7 @@
$classes[] = 'inline-state-is-draft';
}
- $links[] = javelin_tag(
+ $done_input = javelin_tag(
'input',
array(
'type' => 'checkbox',
@@ -250,15 +264,16 @@
'class' => 'differential-inline-done',
'sigil' => 'differential-inline-done',
));
- }
-
- if ($links) {
- $links = phutil_tag(
- 'span',
- array('class' => 'differential-inline-comment-links'),
- phutil_implode_html(" \xC2\xB7 ", $links));
- } else {
- $links = null;
+ $done_button = phutil_tag(
+ 'label',
+ array(
+ 'class' => 'differential-inline-done-label '.
+ ($this->getCanMarkDone() ? null : 'done-is-disabled'),
+ ),
+ array(
+ $done_input,
+ pht('Done'),
+ ));
}
$content = $this->markupEngine->getOutput(
@@ -278,7 +293,7 @@
'');
}
- if ($is_draft) {
+ if ($inline->isDraft() && !$is_synthetic) {
$classes[] = 'differential-inline-comment-unsaved-draft';
}
if ($is_synthetic) {
@@ -286,16 +301,44 @@
}
$classes = implode(' ', $classes);
+ $author_owner = null;
if ($is_synthetic) {
$author = $inline->getSyntheticAuthor();
} else {
$author = $handles[$inline->getAuthorPHID()]->getName();
+ if ($inline->getAuthorPHID() == $this->objectOwnerPHID) {
+ $author_owner = id(new PHUITagView())
+ ->setType(PHUITagView::TYPE_SHADE)
+ ->setName(pht('Author'))
+ ->setSlimShady(true)
+ ->setShade(PHUITagView::COLOR_YELLOW)
+ ->addClass('mml');
+ }
}
- $line = phutil_tag(
- 'span',
- array('class' => 'differential-inline-comment-line'),
- $line);
+ $group_left = phutil_tag(
+ 'div',
+ array(
+ 'class' => 'inline-head-left',
+ ),
+ array(
+ $author,
+ $author_owner,
+ $draft_text,
+ ));
+
+ $group_right = phutil_tag(
+ 'div',
+ array(
+ 'class' => 'inline-head-right',
+ ),
+ array(
+ $anchor,
+ $links,
+ $nextprev,
+ $action_buttons,
+ $done_button,
+ ));
$markup = javelin_tag(
'div',
@@ -305,13 +348,9 @@
'meta' => $metadata,
),
array(
- phutil_tag_div('differential-inline-comment-head', array(
- $anchor,
- $links,
- ' ',
- $line,
- ' ',
- $author,
+ phutil_tag_div('differential-inline-comment-head grouped', array(
+ $group_left,
+ $group_right,
)),
phutil_tag_div(
'differential-inline-comment-content',
diff --git a/src/infrastructure/diff/view/PHUIDiffInlineCommentEditView.php b/src/infrastructure/diff/view/PHUIDiffInlineCommentEditView.php
--- a/src/infrastructure/diff/view/PHUIDiffInlineCommentEditView.php
+++ b/src/infrastructure/diff/view/PHUIDiffInlineCommentEditView.php
@@ -122,7 +122,7 @@
private function renderBody() {
$buttons = array();
- $buttons[] = phutil_tag('button', array(), pht('Ready'));
+ $buttons[] = phutil_tag('button', array(), pht('Save Draft'));
$buttons[] = javelin_tag(
'button',
array(
@@ -148,11 +148,10 @@
$edit = phutil_tag(
'div',
array(
- 'class' => 'differential-inline-comment-edit-buttons',
+ 'class' => 'differential-inline-comment-edit-buttons grouped',
),
array(
$buttons,
- phutil_tag('div', array('style' => 'clear: both'), ''),
));
return javelin_tag(
diff --git a/src/view/phui/PHUIButtonBarView.php b/src/view/phui/PHUIButtonBarView.php
--- a/src/view/phui/PHUIButtonBarView.php
+++ b/src/view/phui/PHUIButtonBarView.php
@@ -14,7 +14,7 @@
}
protected function getTagName() {
- return 'div';
+ return 'span';
}
protected function getTagContent() {
diff --git a/webroot/rsrc/css/application/differential/add-comment.css b/webroot/rsrc/css/application/differential/add-comment.css
--- a/webroot/rsrc/css/application/differential/add-comment.css
+++ b/webroot/rsrc/css/application/differential/add-comment.css
@@ -3,6 +3,15 @@
*/
#inline-comment-preview {
- margin-left: 60px;
- width: 550px;
+ margin-left: 62px;
+ width: 640px;
+}
+
+#inline-comment-preview .differential-inline-comment {
+ margin: 12px 0;
+}
+
+#inline-comment-preview
+ .differential-inline-comment + .differential-inline-comment {
+ margin: 0 0 12px 0;
}
diff --git a/webroot/rsrc/css/application/differential/changeset-view.css b/webroot/rsrc/css/application/differential/changeset-view.css
--- a/webroot/rsrc/css/application/differential/changeset-view.css
+++ b/webroot/rsrc/css/application/differential/changeset-view.css
@@ -1,5 +1,6 @@
/**
* @provides differential-changeset-view-css
+ * @requires phui-inline-comment-view-css
*/
.differential-changeset {
@@ -52,41 +53,45 @@
}
.differential-diff td {
- vertical-align: top;
- white-space: pre-wrap;
- word-wrap: break-word;
- padding: 0 8px 1px;
- line-height: 16px;
+ vertical-align: top;
+ white-space: pre-wrap;
+ word-wrap: break-word;
+ padding: 0 8px 1px;
+ line-height: 16px;
}
.device .differential-diff td {
padding: 0 4px 1px;
}
+.device .differential-diff .inline td {
+ padding: 4px;
+}
+
.differential-diff td .zwsp {
position: absolute;
width: 0;
}
.differential-diff th {
- text-align: right;
- padding: 2px 6px 0px 0px;
- vertical-align: top;
- background: {$lightbluebackground};
- color: {$bluetext};
- cursor: pointer;
- border-right: 1px solid {$thinblueborder};
- overflow: hidden;
-
- -moz-user-select: -moz-none;
- -khtml-user-select: none;
- -webkit-user-select: none;
- -ms-user-select: none;
- user-select: none;
+ text-align: right;
+ padding: 2px 6px 0px 0px;
+ vertical-align: top;
+ background: {$lightbluebackground};
+ color: {$bluetext};
+ cursor: pointer;
+ border-right: 1px solid {$thinblueborder};
+ overflow: hidden;
+
+ -moz-user-select: -moz-none;
+ -khtml-user-select: none;
+ -webkit-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
}
.differential-diff th.selected {
- background: {$hovergrey};
+ background-color: {$sh-yellowbackground};
}
.differential-changeset-immutable .differential-diff th {
@@ -202,7 +207,7 @@
.differential-diff td.show-more,
.differential-diff td.differential-shield {
font: {$basefont};
- font-size: 12px;
+ font-size: 12px;
white-space: normal;
}
@@ -244,9 +249,9 @@
}
.differential-meta-notice {
- border-top: 1px solid {$yellow};
- border-bottom: 1px solid {$yellow};
- background-color: {$lightyellow};
+ border-top: 1px solid {$sh-lightyellowborder};
+ border-bottom: 1px solid {$sh-lightyellowborder};
+ background-color: {$sh-yellowbackground};
padding: 12px;
}
@@ -266,90 +271,48 @@
}
.differential-reticle {
- background: {$lightyellow};
- border: 1px solid {$yellow};
+ background-color: {$sh-yellowbackground};
+ border: 1px solid {$sh-yellowborder};
position: absolute;
opacity: 0.5;
- top: 0px;
- left: 0px;
+ top: 0;
+ left: 0;
box-sizing: border-box;
}
-.differential-inline-comment,
-.differential-inline-comment-edit {
- background: #ffffee;
- border: 1px solid #ccccaa;
- font: {$basefont};
- font-size: 12px;
- margin: 6px 0px;
- padding: 8px 10px;
- width: 100%;
- -moz-box-sizing: border-box;
- -webkit-box-sizing: border-box;
- box-sizing: border-box;
- overflow: hidden;
- white-space: normal;
+.differential-diff .inline td {
+ padding: 8px 12px;
}
-.differential-inline-comment-edit .aphront-form-control-textarea {
- padding: 0;
-}
-
-.differential-inline-comment-unsaved-draft {
- background: #f1f1f1;
- border: 1px dashed {$greytext};
-}
-
-.differential-inline-comment-head {
- font-weight: bold;
- color: #333333;
- border-bottom: 1px solid rgba(204,204,170,0.37);
- padding-bottom: 4px;
- margin-bottom: 8px;
-}
-
-.differential-inline-comment-unsaved-draft .differential-inline-comment-head {
- border-bottom: 1px solid #aaaaaa;
+.differential-loading {
+ border-top: 1px solid {$yellow};
+ border-bottom: 1px solid {$yellow};
+ background-color: {$lightyellow};
+ padding: 12px;
+ text-align: center;
}
-.differential-inline-comment-synthetic {
- background: {$lightblue};
+.differential-collapse-undo {
+ color: {$darkbluetext};
+ padding: 12px;
border: 1px solid {$blue};
+ text-align: center;
+ background-color: {$lightblue};
}
-.differential-inline-comment-synthetic .differential-inline-comment-head {
- border-bottom: 1px solid {$blueborder};
-}
-
-
-.differential-inline-comment-links,
-.differential-inline-comment-line {
- font-weight: normal;
- font-style: italic;
- color: {$greytext};
- float: right;
- white-space: nowrap;
-}
-
-.differential-inline-comment-links {
- margin-left: 8px;
- font-style: normal;
-}
-
-input.differential-inline-done[type="checkbox"] {
- margin: 0;
- display: inline;
- cursor: pointer;
+.differential-collapse-undo a {
+ font-weight: bold;
}
-input.differential-inline-done[disabled="disabled"] {
- cursor: auto;
+.differential-file-icon-header .phui-icon-view {
+ display: inline-block;
+ margin: 0 6px 2px 0;
+ vertical-align: middle;
+ font-size: 14px;
}
-
-.differential-inline-comment-edit-body .aphront-form-input {
- margin: 0;
- width: 100%;
+.device-phone .differential-file-icon-header .phui-icon-view {
+ display: none;
}
.differential-changeset-buttons {
@@ -387,55 +350,6 @@
width: 50%;
}
-.differential-inline-undo {
- padding: 4px;
- text-align: center;
- background: {$lightyellow};
- border: 1px solid {$yellow};
- margin: 3px 0 1px;
- color: {$darkgreytext};
- font: {$basefont};
- font-size: 12px;
-}
-
-.differential-inline-undo a {
- font-weight: bold;
-}
-
-.differential-inline-comment-edit {
- padding: 10px;
-}
-
-.differential-inline-comment-edit-buttons {
- padding: 4px 0 0 0;
-}
-
-.differential-inline-comment-edit-buttons button {
- float: right;
- margin-left: 6px;
-}
-
-.differential-inline-comment-edit-title {
- font-weight: bold;
- color: #333333;
- padding-bottom: 2px;
- margin-bottom: 6px;
-}
-
-/* When the inline editor is active, disable all the other inline comment links
- on the page ("Edit", "Reply", "Delete", etc). The goal here is to prevent
- issues where you open up multiple editors and run into problems with
- assumptions about modalness. They are disabled explicitly by the JS, but
- render them in a disabled state as well.
-*/
-.inline-editor-active .differential-inline-comment-links a,
-.inline-editor-active .differential-inline-comment-links a:hover,
-.inline-editor-active .differential-inline-comment-links a:active {
- color: {$lightgreytext};
- cursor: normal;
- text-decoration: none;
-}
-
tr.differential-inline-hidden {
display: none;
}
@@ -443,57 +357,3 @@
tr.differential-inline-loading {
opacity: 0.5;
}
-
-
-/* In the document, the anchor is positioned inside the inline comment, but
- this makes the browser jump into the comment so the top isn't visible.
- Instead, artificially position it a bit above the comment so we'll jump a
- bit before the comment. This allows us to see the entire comment (and
- generally the commented-on lines, at least in the case of one or two-line
- comments) after the jump.
-*/
-.differential-inline-comment-anchor {
- position: absolute;
- display: block;
- margin-top: -72px;
-}
-
-.differential-loading {
- border-top: 1px solid {$yellow};
- border-bottom: 1px solid {$yellow};
- background-color: {$lightyellow};
- padding: 12px;
- text-align: center;
-}
-
-.differential-collapse-undo {
- background: #FFE;
- color: #000;
- padding: 1em 0em;
- border: 1px solid #CCA;
- text-align: center;
- background-color: #FFE;
-}
-
-.differential-collapse-undo a {
- font-weight: bold;
-}
-
-.differential-file-icon-header .phui-icon-view {
- display: inline-block;
- margin: 0 6px 2px 0;
- vertical-align: middle;
- font-size: 14px;
-}
-
-.device-phone .differential-file-icon-header .phui-icon-view {
- display: none;
-}
-
-.inline-is-done {
- opacity: 0.75;
-}
-
-.inline-state-is-draft input.differential-inline-done[type="checkbox"] {
- /* TODO: Possibly style this. */
-}
diff --git a/webroot/rsrc/css/application/differential/phui-inline-comment.css b/webroot/rsrc/css/application/differential/phui-inline-comment.css
new file mode 100644
--- /dev/null
+++ b/webroot/rsrc/css/application/differential/phui-inline-comment.css
@@ -0,0 +1,381 @@
+/**
+ * @provides phui-inline-comment-view-css
+ */
+
+.differential-comment-list .anchor-target {
+ background-color: #ffffdd;
+ border-color: #ffff00;
+}
+
+/* In the document, the anchor is positioned inside the inline comment, but
+ this makes the browser jump into the comment so the top isn't visible.
+ Instead, artificially position it a bit above the comment so we'll jump a
+ bit before the comment. This allows us to see the entire comment (and
+ generally the commented-on lines, at least in the case of one or two-line
+ comments) after the jump.
+*/
+.differential-inline-comment-anchor {
+ position: absolute;
+ display: block;
+ margin-top: -72px;
+}
+
+.differential-inline-comment-content {
+ overflow: auto;
+}
+
+.differential-inline-comment,
+.differential-inline-comment-edit {
+ background: #fff;
+ border: 1px solid {$sh-yellowborder};
+ font: {$basefont};
+ margin: 0;
+ width: 100%;
+ -moz-box-sizing: border-box;
+ -webkit-box-sizing: border-box;
+ box-sizing: border-box;
+ overflow: hidden;
+ white-space: normal;
+ border-radius: 3px;
+}
+
+.differential-inline-comment-unsaved-draft {
+ border: 1px solid {$lightgreyborder};
+}
+
+.differential-inline-comment-head {
+ font-weight: bold;
+ color: {$darkbluetext};
+ border-bottom: 1px solid {$sh-lightyellowborder};
+ padding: 4px 5px 2px 12px;
+ background-color: {$sh-yellowbackground};
+}
+
+.device-desktop .differential-inline-comment .button.simple:hover
+ .phui-icon-view,
+.device-desktop .differential-inline-comment .button.simple:hover {
+ color: {$sky};
+}
+
+.differential-inline-comment-content {
+ padding: 12px;
+}
+
+.differential-inline-comment-unsaved-draft .differential-inline-comment-head {
+ border-bottom: 1px solid {$lightgreyborder};
+ background-color: {$lightgreybackground};
+}
+
+/* Tighten up spacing on replies */
+.differential-inline-comment.inline-comment-is-reply {
+ margin-top: -4px;
+}
+
+.differential-inline-comment .inline-head-right {
+ float: right;
+}
+
+.differential-inline-comment .inline-head-right .button {
+ vertical-align: top;
+}
+
+.differential-inline-comment .inline-head-left {
+ float: left;
+ padding: 5px 0;
+}
+
+.device-phone .differential-inline-comment .inline-head-left {
+ float: none;
+}
+
+.device-phone .differential-inline-comment .inline-head-right {
+ float: none;
+}
+
+.device-phone .differential-inline-comment .inline-head-right .mml {
+ margin: 0 4px 0 0;
+}
+
+.device-phone .differential-inline-comment .differential-inline-comment-head {
+ padding: 0px 0px 4px 8px;
+}
+
+
+/* - Sythetic Comment ---------------------------------------------------------
+
+ Comments left by our robot overlords.
+
+*/
+
+.differential-inline-comment.differential-inline-comment-synthetic {
+ border: 1px solid {$blue};
+}
+
+.differential-inline-comment.differential-inline-comment-synthetic
+ .differential-inline-comment-head {
+ border-bottom: 1px solid {$blueborder};
+ background-color: {$lightblue};
+}
+
+.differential-inline-comment.differential-inline-comment-synthetic
+ .button.simple {
+ border-color: {$blue};
+}
+
+.differential-inline-comment.differential-inline-comment-synthetic
+ .button.simple .phui-icon-view {
+ color: {$blue};
+}
+
+.differential-inline-comment.differential-inline-comment-synthetic
+ .differential-inline-comment-head {
+ padding-bottom: 4px;
+}
+
+
+/* - New/Edit Inline Comment --------------------------------------------------
+
+ Styles for when you are creating or editing an inline comment.
+
+*/
+
+.differential-inline-comment-edit-body .aphront-form-input {
+ margin: 0;
+ width: 100%;
+}
+
+.differential-inline-comment-edit {
+ padding: 8px;
+}
+
+.differential-inline-comment-edit-buttons {
+ padding: 8px 0 0 0;
+}
+
+.differential-inline-comment-edit-buttons button {
+ float: right;
+ margin-left: 6px;
+}
+
+.differential-inline-comment-edit-title {
+ font-weight: bold;
+ color: {$darkbluetext};
+ padding: 4px 0 12px;
+ font-size: 14px;
+}
+
+.differential-inline-comment-unsaved-draft .phui-button-bar .button {
+ border-color: {$lightgreyborder};
+}
+
+.differential-inline-comment-unsaved-draft .phui-button-bar .phui-icon-view {
+ color: {$lightgreytext};
+}
+
+.differential-inline-comment-edit {
+ background-color: {$lightgreybackground};
+ border: 1px solid {$lightgreyborder};
+}
+
+.differential-inline-comment-edit .remarkup-assist-textarea {
+ border-left-color: {$lightgreyborder};
+ border-right-color: {$lightgreyborder};
+ border-bottom-color: {$greyborder};
+}
+
+.differential-inline-comment-edit .remarkup-assist-bar {
+ border-left-color: {$lightgreyborder};
+ border-right-color: {$lightgreyborder};
+ border-top-color: {$lightgreyborder};
+}
+
+.differential-inline-comment-edit .aphront-form-control-textarea {
+ padding: 0;
+}
+
+
+/* - Action Buttons -----------------------------------------------------------
+
+ Reply, Edit, Delete, View, Button Bars...
+
+*/
+
+.differential-inline-comment .differential-inline-done-label,
+.differential-inline-comment .button.simple {
+ border-color: {$sh-yellowborder};
+ color: {$sh-yellowicon};
+}
+
+.differential-inline-comment .button.simple .phui-icon-view {
+ color: {$sh-yellowicon};
+}
+
+.differential-inline-comment.differential-inline-comment-unsaved-draft
+ .differential-inline-done-label,
+.differential-inline-comment.differential-inline-comment-unsaved-draft
+ .button.simple {
+ border-color: {$lightgreyborder};
+ color: {$lightgreytext};
+}
+
+.differential-inline-comment.differential-inline-comment-unsaved-draft
+ .button.simple .phui-icon-view {
+ color: {$lightgreytext};
+}
+
+.device-desktop .differential-inline-comment-unsaved-draft
+ a.button.simple:hover {
+ border-color: {$lightgreyborder};
+}
+
+/* - Done Button --------------------------------------------------------------
+
+ Default colors, hovers, checked styles for the Done Button.
+
+*/
+
+.differential-inline-done-label {
+ border: 1px solid {$sh-yellowborder};
+ border-radius: 3px;
+ display: inline-block;
+ overflow: hidden;
+ margin-left: 8px;
+ padding: 3px 8px 4px;
+ cursor: pointer;
+}
+
+.differential-inline-done-label .differential-inline-done {
+ margin: 0 6px 0 0;
+ display: inline;
+ cursor: pointer;
+}
+
+input.differential-inline-done[disabled="disabled"] {
+ cursor: auto;
+}
+
+.device-desktop .differential-inline-comment.inline-is-done
+ .differential-inline-done-label:hover,
+.device-desktop .differential-inline-comment
+ .differential-inline-done-label:hover {
+ background-color: #fff;
+ color: {$sky};
+ border-color: {$lightblueborder};
+}
+
+.differential-inline-comment .differential-inline-comment-head
+ .differential-inline-done-label.done-is-disabled {
+ color: {$sh-yellowtext};
+ border-color: {$sh-yellowborder};
+ opacity: .5;
+}
+
+.differential-inline-comment.differential-inline-comment-unsaved-draft
+ .differential-inline-done-label.done-is-disabled {
+ color: {$lightgreytext};
+ border-color: {$lightgreyborder};
+ opacity: .5;
+}
+
+.device-desktop
+ .differential-inline-comment.differential-inline-comment-unsaved-draft
+ .differential-inline-done-label.done-is-disabled:hover {
+ background-color: transparent;
+ cursor: auto;
+}
+
+.differential-inline-comment
+ .differential-inline-done-label.done-is-disabled {
+ border-color: {$sh-lightyellowborder};
+ color: {$sh-yellowtext};
+}
+
+.device-desktop .differential-inline-comment
+ .differential-inline-done-label.done-is-disabled:hover {
+ background-color: transparent;
+ cursor: auto;
+}
+
+.differential-inline-comment.inline-is-done
+ .differential-inline-done-label {
+ background-color: #fff;
+ border-color: {$lightblueborder};
+ color: {$sky} !important;
+ opacity: 1;
+}
+
+.device-desktop .differential-inline-comment.inline-is-done
+ .differential-inline-done-label:hover {
+ background-color: #fff;
+ color: {$sky};
+}
+
+
+/* - Inline Is Done -----------------------------------------------------------
+
+ Is Done for Diff Author = grey, for Diff Viewer = yellow.
+
+*/
+
+.differential-inline-comment.inline-is-done {
+ border-color: {$lightgreyborder};
+}
+
+.differential-inline-comment.inline-is-done
+ .differential-inline-comment-head {
+ background-color: {$lightgreybackground};
+ border-bottom-color: {$lightgreyborder};
+}
+
+.differential-inline-comment.inline-is-done .differential-inline-comment-head
+ .button.simple,
+.differential-inline-comment.inline-is-done .differential-inline-comment-head
+ .differential-inline-done-label {
+ border-color: {$lightgreyborder};
+ color: {$lightgreytext};
+}
+
+.differential-inline-comment.inline-is-done
+ .button.simple .phui-icon-view {
+ color: {$lightgreytext};
+}
+
+
+
+/* - Unsaved Draft ------------------------------------------------------------
+
+ The Unsubmitted state of the comment / done checkbox styles.
+
+*/
+
+.differential-inline-comment .inline-draft-text {
+ display: none;
+}
+
+.differential-inline-comment.differential-inline-comment-unsaved-draft
+ .inline-draft-text {
+ display: inline-block;
+}
+
+
+/* - Undo ---------------------------------------------------------------------
+
+ A wild undo box appears!
+
+*/
+
+.differential-inline-undo {
+ padding: 8px;
+ text-align: center;
+ background: {$sh-yellowbackground};
+ border: 1px solid {$sh-yellowborder};
+ margin: 4px 0;
+ color: {$darkgreytext};
+ font: {$basefont};
+ font-size: 13px;
+ border-radius: 3px;
+}
+
+.differential-inline-undo a {
+ font-weight: bold;
+}
diff --git a/webroot/rsrc/css/application/differential/revision-comment.css b/webroot/rsrc/css/application/differential/revision-comment.css
--- a/webroot/rsrc/css/application/differential/revision-comment.css
+++ b/webroot/rsrc/css/application/differential/revision-comment.css
@@ -51,12 +51,3 @@
.differential-haunt-mode-1 {
padding-bottom: 250px;
}
-
-.differential-comment-list .anchor-target {
- background-color: #ffffdd;
- border-color: #ffff00;
-}
-
-.differential-inline-comment-content {
- overflow: auto;
-}
diff --git a/webroot/rsrc/css/phui/phui-button.css b/webroot/rsrc/css/phui/phui-button.css
--- a/webroot/rsrc/css/phui/phui-button.css
+++ b/webroot/rsrc/css/phui/phui-button.css
@@ -132,6 +132,11 @@
background-image: none;
border-bottom-color: {$darkblueborder};
box-shadow: none;
+ text-decoration: none;
+}
+
+a.button.simple .phui-icon-view {
+ border: none;
}
a.button.simple.phuix-dropdown-open {
@@ -299,7 +304,7 @@
}
.phui-button-bar .button .phui-icon-view {
- left: 12px;
+ left: 9px;
}
.button.has-icon .phui-button-text {
@@ -332,7 +337,7 @@
.phui-button-bar a.button.has-icon {
display: inline-block;
height: 16px;
- width: 12px;
+ width: 6px;
}
.phui-button-bar .phui-button-bar-first {

File Metadata

Mime Type
text/plain
Expires
Sat, Nov 2, 7:14 AM (1 w, 5 d ago)
Storage Engine
amazon-s3
Storage Format
Encrypted (AES-256-CBC)
Storage Handle
phabricator/secure/qx/rm/r2tz6v2xsxh4pilm
Default Alt Text
D12171.id29291.diff (33 KB)

Event Timeline

Phabricator · Built by Phacility