mirror of
https://we.phorge.it/source/phorge.git
synced 2025-02-05 03:18:25 +01:00
Tweak Maniphest CSS, fix remarkup in description change views
Summary: Various CSS tweaks and fixes: - Add remarkup styling to description change views, missed this before. - Fix CSS so that transactions with only one item (e.g., changed priority) don't have weird floater underneath them. - Add more space between transaction items. - Make default background color lighter and less heavy. - Use beigey color for comment form in Maniphest. - Share more CSS between Maniphest and Differential (previews, feedback). - Move "Leap Into Action" call to Differential, replace Maniphest with thematically-consistent "Weigh In" (obviously, Maniphest has a nautical theme). Test Plan: Browsed Maniphest and Differential in a couple browsers, styling all seems correct. Reviewed By: tomo Reviewers: tomo, aran, jungejason, tuomaspelkonen CC: anjali, aran, tomo Differential Revision: 328
This commit is contained in:
parent
b77e827bec
commit
3f11c8a602
11 changed files with 111 additions and 100 deletions
|
@ -81,7 +81,7 @@ celerity_register_resource_map(array(
|
|||
),
|
||||
'aphront-panel-view-css' =>
|
||||
array(
|
||||
'uri' => '/res/8cdfa52d/rsrc/css/aphront/panel-view.css',
|
||||
'uri' => '/res/5ca2f692/rsrc/css/aphront/panel-view.css',
|
||||
'type' => 'css',
|
||||
'requires' =>
|
||||
array(
|
||||
|
@ -145,7 +145,7 @@ celerity_register_resource_map(array(
|
|||
),
|
||||
'differential-core-view-css' =>
|
||||
array(
|
||||
'uri' => '/res/f67a5b9d/rsrc/css/application/differential/core.css',
|
||||
'uri' => '/res/d0ae90e5/rsrc/css/application/differential/core.css',
|
||||
'type' => 'css',
|
||||
'requires' =>
|
||||
array(
|
||||
|
@ -154,7 +154,7 @@ celerity_register_resource_map(array(
|
|||
),
|
||||
'differential-revision-add-comment-css' =>
|
||||
array(
|
||||
'uri' => '/res/070942f7/rsrc/css/application/differential/add-comment.css',
|
||||
'uri' => '/res/849748d3/rsrc/css/application/differential/add-comment.css',
|
||||
'type' => 'css',
|
||||
'requires' =>
|
||||
array(
|
||||
|
@ -750,7 +750,7 @@ celerity_register_resource_map(array(
|
|||
),
|
||||
'mainphest-task-detail-css' =>
|
||||
array(
|
||||
'uri' => '/res/fa248d0b/rsrc/css/application/maniphest/task-detail.css',
|
||||
'uri' => '/res/dbefc148/rsrc/css/application/maniphest/task-detail.css',
|
||||
'type' => 'css',
|
||||
'requires' =>
|
||||
array(
|
||||
|
@ -768,7 +768,7 @@ celerity_register_resource_map(array(
|
|||
),
|
||||
'maniphest-transaction-detail-css' =>
|
||||
array(
|
||||
'uri' => '/res/0a35f731/rsrc/css/application/maniphest/transaction-detail.css',
|
||||
'uri' => '/res/927f4430/rsrc/css/application/maniphest/transaction-detail.css',
|
||||
'type' => 'css',
|
||||
'requires' =>
|
||||
array(
|
||||
|
@ -933,19 +933,7 @@ celerity_register_resource_map(array(
|
|||
'uri' => '/res/pkg/03ef179e/diffusion.pkg.css',
|
||||
'type' => 'css',
|
||||
),
|
||||
'122a6b6d' =>
|
||||
array (
|
||||
'name' => 'workflow.pkg.js',
|
||||
'symbols' =>
|
||||
array (
|
||||
0 => 'javelin-mask',
|
||||
1 => 'javelin-workflow',
|
||||
2 => 'javelin-behavior-workflow',
|
||||
),
|
||||
'uri' => '/res/pkg/122a6b6d/workflow.pkg.js',
|
||||
'type' => 'js',
|
||||
),
|
||||
'1ef6c6f9' =>
|
||||
'0ab8eff6' =>
|
||||
array (
|
||||
'name' => 'core.pkg.css',
|
||||
'symbols' =>
|
||||
|
@ -966,10 +954,22 @@ celerity_register_resource_map(array(
|
|||
13 => 'phabricator-remarkup-css',
|
||||
14 => 'syntax-highlighting-css',
|
||||
),
|
||||
'uri' => '/res/pkg/1ef6c6f9/core.pkg.css',
|
||||
'uri' => '/res/pkg/0ab8eff6/core.pkg.css',
|
||||
'type' => 'css',
|
||||
),
|
||||
'314934dc' =>
|
||||
'122a6b6d' =>
|
||||
array (
|
||||
'name' => 'workflow.pkg.js',
|
||||
'symbols' =>
|
||||
array (
|
||||
0 => 'javelin-mask',
|
||||
1 => 'javelin-workflow',
|
||||
2 => 'javelin-behavior-workflow',
|
||||
),
|
||||
'uri' => '/res/pkg/122a6b6d/workflow.pkg.js',
|
||||
'type' => 'js',
|
||||
),
|
||||
'1ac25e8a' =>
|
||||
array (
|
||||
'name' => 'differential.pkg.css',
|
||||
'symbols' =>
|
||||
|
@ -983,7 +983,7 @@ celerity_register_resource_map(array(
|
|||
6 => 'differential-revision-add-comment-css',
|
||||
7 => 'differential-revision-comment-list-css',
|
||||
),
|
||||
'uri' => '/res/pkg/314934dc/differential.pkg.css',
|
||||
'uri' => '/res/pkg/1ac25e8a/differential.pkg.css',
|
||||
'type' => 'css',
|
||||
),
|
||||
'33f413ef' =>
|
||||
|
@ -1038,23 +1038,23 @@ celerity_register_resource_map(array(
|
|||
),
|
||||
'reverse' =>
|
||||
array (
|
||||
'aphront-crumbs-view-css' => '1ef6c6f9',
|
||||
'aphront-dialog-view-css' => '1ef6c6f9',
|
||||
'aphront-form-view-css' => '1ef6c6f9',
|
||||
'aphront-list-filter-view-css' => '1ef6c6f9',
|
||||
'aphront-panel-view-css' => '1ef6c6f9',
|
||||
'aphront-side-nav-view-css' => '1ef6c6f9',
|
||||
'aphront-table-view-css' => '1ef6c6f9',
|
||||
'aphront-tokenizer-control-css' => '1ef6c6f9',
|
||||
'aphront-typeahead-control-css' => '1ef6c6f9',
|
||||
'differential-changeset-view-css' => '314934dc',
|
||||
'differential-core-view-css' => '314934dc',
|
||||
'differential-revision-add-comment-css' => '314934dc',
|
||||
'differential-revision-comment-css' => '314934dc',
|
||||
'differential-revision-comment-list-css' => '314934dc',
|
||||
'differential-revision-detail-css' => '314934dc',
|
||||
'differential-revision-history-css' => '314934dc',
|
||||
'differential-table-of-contents-css' => '314934dc',
|
||||
'aphront-crumbs-view-css' => '0ab8eff6',
|
||||
'aphront-dialog-view-css' => '0ab8eff6',
|
||||
'aphront-form-view-css' => '0ab8eff6',
|
||||
'aphront-list-filter-view-css' => '0ab8eff6',
|
||||
'aphront-panel-view-css' => '0ab8eff6',
|
||||
'aphront-side-nav-view-css' => '0ab8eff6',
|
||||
'aphront-table-view-css' => '0ab8eff6',
|
||||
'aphront-tokenizer-control-css' => '0ab8eff6',
|
||||
'aphront-typeahead-control-css' => '0ab8eff6',
|
||||
'differential-changeset-view-css' => '1ac25e8a',
|
||||
'differential-core-view-css' => '1ac25e8a',
|
||||
'differential-revision-add-comment-css' => '1ac25e8a',
|
||||
'differential-revision-comment-css' => '1ac25e8a',
|
||||
'differential-revision-comment-list-css' => '1ac25e8a',
|
||||
'differential-revision-detail-css' => '1ac25e8a',
|
||||
'differential-revision-history-css' => '1ac25e8a',
|
||||
'differential-table-of-contents-css' => '1ac25e8a',
|
||||
'diffusion-commit-view-css' => '03ef179e',
|
||||
'javelin-behavior' => 'ce1d51a9',
|
||||
'javelin-behavior-aphront-basic-tokenizer' => '33f413ef',
|
||||
|
@ -1081,11 +1081,11 @@ celerity_register_resource_map(array(
|
|||
'javelin-util' => 'ce1d51a9',
|
||||
'javelin-vector' => 'ce1d51a9',
|
||||
'javelin-workflow' => '122a6b6d',
|
||||
'phabricator-core-buttons-css' => '1ef6c6f9',
|
||||
'phabricator-core-css' => '1ef6c6f9',
|
||||
'phabricator-directory-css' => '1ef6c6f9',
|
||||
'phabricator-remarkup-css' => '1ef6c6f9',
|
||||
'phabricator-standard-page-view' => '1ef6c6f9',
|
||||
'syntax-highlighting-css' => '1ef6c6f9',
|
||||
'phabricator-core-buttons-css' => '0ab8eff6',
|
||||
'phabricator-core-css' => '0ab8eff6',
|
||||
'phabricator-directory-css' => '0ab8eff6',
|
||||
'phabricator-remarkup-css' => '0ab8eff6',
|
||||
'phabricator-standard-page-view' => '0ab8eff6',
|
||||
'syntax-highlighting-css' => '0ab8eff6',
|
||||
),
|
||||
));
|
||||
|
|
|
@ -110,20 +110,21 @@ final class DifferentialAddCommentView extends AphrontView {
|
|||
'inline' => 'inline-comment-preview',
|
||||
));
|
||||
|
||||
$panel_view = new AphrontPanelView();
|
||||
$panel_view->appendChild($form);
|
||||
$panel_view->setHeader('Leap Into Action');
|
||||
$panel_view->addClass('aphront-panel-accent');
|
||||
$panel_view->addClass('aphront-panel-flush');
|
||||
|
||||
return
|
||||
'<div class="differential-add-comment-panel">'.
|
||||
'<div class="differential-panel">'.
|
||||
'<h1>Add Comment</h1>'.
|
||||
$form->render().
|
||||
$panel_view->render().
|
||||
'<div class="aphront-panel-preview aphront-panel-flush">'.
|
||||
'<div id="comment-preview">'.
|
||||
'<span class="aphront-panel-preview-loading-text">'.
|
||||
'Loading comment preview...'.
|
||||
'</span>'.
|
||||
'</div>'.
|
||||
'<div class="differential-comment-preview">'.
|
||||
'<div id="comment-preview">'.
|
||||
'<span class="differential-loading-text">'.
|
||||
'Loading comment preview...'.
|
||||
'</span>'.
|
||||
'</div>'.
|
||||
'<div id="inline-comment-preview">'.
|
||||
'</div>'.
|
||||
'<div id="inline-comment-preview">'.
|
||||
'</div>'.
|
||||
'</div>';
|
||||
}
|
||||
|
|
|
@ -15,6 +15,7 @@ phutil_require_module('phabricator', 'view/form/control/select');
|
|||
phutil_require_module('phabricator', 'view/form/control/submit');
|
||||
phutil_require_module('phabricator', 'view/form/control/textarea');
|
||||
phutil_require_module('phabricator', 'view/form/control/tokenizer');
|
||||
phutil_require_module('phabricator', 'view/layout/panel');
|
||||
|
||||
phutil_require_module('phutil', 'utils');
|
||||
|
||||
|
|
|
@ -331,12 +331,13 @@ class ManiphestTaskDetailController extends ManiphestController {
|
|||
|
||||
$comment_panel = new AphrontPanelView();
|
||||
$comment_panel->appendChild($comment_form);
|
||||
$comment_panel->setHeader('Leap Into Action');
|
||||
$comment_panel->setHeader('Weigh In');
|
||||
$comment_panel->addClass('aphront-panel-accent');
|
||||
|
||||
$preview_panel =
|
||||
'<div class="maniphest-transaction-preview">
|
||||
'<div class="aphront-panel-preview">
|
||||
<div id="transaction-preview">
|
||||
<div class="maniphest-loading-text">
|
||||
<div class="aphront-panel-preview-loading-text">
|
||||
Loading preview...
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -474,8 +474,16 @@ class ManiphestTransactionDetailView extends AphrontView {
|
|||
<th>New Description</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>'.$engine->markupText($old).'</td>
|
||||
<td>'.$engine->markupText($new).'</td>
|
||||
<td>
|
||||
<div class="phabricator-remarkup">'.
|
||||
$engine->markupText($old).
|
||||
'</div>
|
||||
</td>
|
||||
<td>
|
||||
<div class="phabricator-remarkup">'.
|
||||
$engine->markupText($new).
|
||||
'</div>
|
||||
</td>
|
||||
</tr>
|
||||
</table>';
|
||||
|
||||
|
|
|
@ -25,6 +25,7 @@ final class AphrontPanelView extends AphrontView {
|
|||
private $buttons = array();
|
||||
private $header;
|
||||
private $width;
|
||||
private $classes = array();
|
||||
|
||||
public function setCreateButton($create_button, $href) {
|
||||
$this->addButton(
|
||||
|
@ -39,6 +40,11 @@ final class AphrontPanelView extends AphrontView {
|
|||
return $this;
|
||||
}
|
||||
|
||||
public function addClass($class) {
|
||||
$this->classes[] = $class;
|
||||
return $this;
|
||||
}
|
||||
|
||||
public function addButton($button) {
|
||||
$this->buttons[] = $button;
|
||||
return $this;
|
||||
|
@ -73,13 +79,14 @@ final class AphrontPanelView extends AphrontView {
|
|||
|
||||
require_celerity_resource('aphront-panel-view-css');
|
||||
|
||||
$class = array('aphront-panel-view');
|
||||
$classes = $this->classes;
|
||||
$classes[] = 'aphront-panel-view';
|
||||
if ($this->width) {
|
||||
$class[] = 'aphront-panel-width-'.$this->width;
|
||||
$classes[] = 'aphront-panel-width-'.$this->width;
|
||||
}
|
||||
|
||||
return
|
||||
'<div class="'.implode(' ', $class).'">'.
|
||||
'<div class="'.implode(' ', $classes).'">'.
|
||||
$buttons.
|
||||
$header.
|
||||
$table.
|
||||
|
|
|
@ -37,3 +37,28 @@
|
|||
margin-right: auto;
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
.aphront-panel-accent {
|
||||
background: #efefdf;
|
||||
border: 1px solid #666622;
|
||||
}
|
||||
|
||||
.aphront-panel-accent .aphront-form-view {
|
||||
background: #fffff5;
|
||||
border: 1px solid #c4c4c0;
|
||||
}
|
||||
|
||||
.aphront-panel-preview {
|
||||
background: #fbfbfb;
|
||||
border-bottom: 1px solid #aaaaaa;
|
||||
margin: -1em 2em 2em;
|
||||
padding: 15px 20px;
|
||||
}
|
||||
|
||||
.aphront-panel-preview-loading-text {
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
.aphront-panel-flush {
|
||||
margin: 0;
|
||||
}
|
||||
|
|
|
@ -2,26 +2,6 @@
|
|||
* @provides differential-revision-add-comment-css
|
||||
*/
|
||||
|
||||
.differential-add-comment-panel .aphront-form-view {
|
||||
background: #fffff5;
|
||||
}
|
||||
|
||||
.differential-add-comment-panel .differential-panel {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.differential-comment-preview {
|
||||
background: #f0f0f0;
|
||||
border-bottom: 1px solid #aaaaaa;
|
||||
margin-bottom: 2em;
|
||||
max-width: 1120px;
|
||||
padding: 15px 20px;
|
||||
}
|
||||
|
||||
.differential-comment-preview .differential-loading-text {
|
||||
color: #aaaaaa;
|
||||
}
|
||||
|
||||
#inline-comment-preview {
|
||||
margin-left: 60px;
|
||||
width: 550px;
|
||||
|
|
|
@ -5,6 +5,7 @@
|
|||
.differential-primary-pane {
|
||||
margin: 0 40px;
|
||||
max-width: 1162px;
|
||||
padding-bottom: 2em;
|
||||
}
|
||||
|
||||
.differential-panel {
|
||||
|
|
|
@ -42,15 +42,3 @@
|
|||
.maniphest-task-detail-core {
|
||||
margin-right: 265px;
|
||||
}
|
||||
|
||||
.maniphest-transaction-preview {
|
||||
background: #f0f0f0;
|
||||
border-top: 1px solid #dddddd;
|
||||
border-bottom: 1px solid #aaaaaa;
|
||||
margin: -1em 2em 2em;
|
||||
padding: 15px 20px;
|
||||
}
|
||||
|
||||
.maniphest-loading-text {
|
||||
color: #666666;
|
||||
}
|
||||
|
|
|
@ -3,7 +3,7 @@
|
|||
*/
|
||||
|
||||
.maniphest-transaction-detail-container {
|
||||
margin: 2px 1em 3px;
|
||||
margin: 1em 1em 1.5em;
|
||||
background: 0px 0px no-repeat;
|
||||
min-height: 50px;
|
||||
}
|
||||
|
@ -45,7 +45,7 @@
|
|||
}
|
||||
|
||||
.maniphest-transaction-header {
|
||||
background: #e6e6e6;
|
||||
background: #f3f3f3;
|
||||
padding: 4px 1em;
|
||||
}
|
||||
|
||||
|
@ -55,10 +55,9 @@
|
|||
|
||||
.maniphest-transaction-detail-view {
|
||||
margin-left: 54px;
|
||||
border-color: #bbbbbb;
|
||||
border-color: #dddddd;
|
||||
border-width: 1px 10px;
|
||||
border-style: solid;
|
||||
min-height: 40px;
|
||||
}
|
||||
|
||||
.maniphest-transaction-timestamp {
|
||||
|
|
Loading…
Add table
Reference in a new issue