mirror of
https://we.phorge.it/source/phorge.git
synced 2024-11-22 23:02:42 +01:00
Diviner CSS tweaks
Summary: Update Diviner table layouts, make it purty. Test Plan: test many diviner pages Reviewers: epriestley, btrahan Reviewed By: epriestley CC: Korvin, aran Differential Revision: https://secure.phabricator.com/D6880
This commit is contained in:
parent
4252c93c8a
commit
589f1c7696
8 changed files with 142 additions and 72 deletions
|
@ -1149,7 +1149,7 @@ celerity_register_resource_map(array(
|
|||
),
|
||||
'diviner-shared-css' =>
|
||||
array(
|
||||
'uri' => '/res/c4527a99/rsrc/css/diviner/diviner-shared.css',
|
||||
'uri' => '/res/582ff299/rsrc/css/diviner/diviner-shared.css',
|
||||
'type' => 'css',
|
||||
'requires' =>
|
||||
array(
|
||||
|
@ -3182,7 +3182,7 @@ celerity_register_resource_map(array(
|
|||
),
|
||||
'phabricator-header-view-css' =>
|
||||
array(
|
||||
'uri' => '/res/822a9fc1/rsrc/css/layout/phabricator-header-view.css',
|
||||
'uri' => '/res/016b9d83/rsrc/css/layout/phabricator-header-view.css',
|
||||
'type' => 'css',
|
||||
'requires' =>
|
||||
array(
|
||||
|
@ -3385,7 +3385,7 @@ celerity_register_resource_map(array(
|
|||
),
|
||||
'phabricator-property-list-view-css' =>
|
||||
array(
|
||||
'uri' => '/res/34213162/rsrc/css/layout/phabricator-property-list-view.css',
|
||||
'uri' => '/res/145d1f9a/rsrc/css/layout/phabricator-property-list-view.css',
|
||||
'type' => 'css',
|
||||
'requires' =>
|
||||
array(
|
||||
|
@ -3774,7 +3774,7 @@ celerity_register_resource_map(array(
|
|||
),
|
||||
'phui-document-view-css' =>
|
||||
array(
|
||||
'uri' => '/res/0c895688/rsrc/css/phui/phui-document.css',
|
||||
'uri' => '/res/dd1ef24b/rsrc/css/phui/phui-document.css',
|
||||
'type' => 'css',
|
||||
'requires' =>
|
||||
array(
|
||||
|
@ -4171,7 +4171,7 @@ celerity_register_resource_map(array(
|
|||
), array(
|
||||
'packages' =>
|
||||
array(
|
||||
'd773a346' =>
|
||||
'5e2ee206' =>
|
||||
array(
|
||||
'name' => 'core.pkg.css',
|
||||
'symbols' =>
|
||||
|
@ -4218,7 +4218,7 @@ celerity_register_resource_map(array(
|
|||
39 => 'phabricator-property-list-view-css',
|
||||
40 => 'phabricator-tag-view-css',
|
||||
),
|
||||
'uri' => '/res/pkg/d773a346/core.pkg.css',
|
||||
'uri' => '/res/pkg/5e2ee206/core.pkg.css',
|
||||
'type' => 'css',
|
||||
),
|
||||
'8977e356' =>
|
||||
|
@ -4409,15 +4409,15 @@ celerity_register_resource_map(array(
|
|||
),
|
||||
'reverse' =>
|
||||
array(
|
||||
'aphront-dialog-view-css' => 'd773a346',
|
||||
'aphront-error-view-css' => 'd773a346',
|
||||
'aphront-list-filter-view-css' => 'd773a346',
|
||||
'aphront-pager-view-css' => 'd773a346',
|
||||
'aphront-panel-view-css' => 'd773a346',
|
||||
'aphront-table-view-css' => 'd773a346',
|
||||
'aphront-tokenizer-control-css' => 'd773a346',
|
||||
'aphront-tooltip-css' => 'd773a346',
|
||||
'aphront-typeahead-control-css' => 'd773a346',
|
||||
'aphront-dialog-view-css' => '5e2ee206',
|
||||
'aphront-error-view-css' => '5e2ee206',
|
||||
'aphront-list-filter-view-css' => '5e2ee206',
|
||||
'aphront-pager-view-css' => '5e2ee206',
|
||||
'aphront-panel-view-css' => '5e2ee206',
|
||||
'aphront-table-view-css' => '5e2ee206',
|
||||
'aphront-tokenizer-control-css' => '5e2ee206',
|
||||
'aphront-tooltip-css' => '5e2ee206',
|
||||
'aphront-typeahead-control-css' => '5e2ee206',
|
||||
'differential-changeset-view-css' => '44bfe40c',
|
||||
'differential-core-view-css' => '44bfe40c',
|
||||
'differential-inline-comment-editor' => 'd07a3bc2',
|
||||
|
@ -4431,7 +4431,7 @@ celerity_register_resource_map(array(
|
|||
'differential-table-of-contents-css' => '44bfe40c',
|
||||
'diffusion-commit-view-css' => 'c8ce2d88',
|
||||
'diffusion-icons-css' => 'c8ce2d88',
|
||||
'global-drag-and-drop-css' => 'd773a346',
|
||||
'global-drag-and-drop-css' => '5e2ee206',
|
||||
'inline-comment-summary-css' => '44bfe40c',
|
||||
'javelin-aphlict' => '8977e356',
|
||||
'javelin-behavior' => '2dbbb7d1',
|
||||
|
@ -4504,55 +4504,55 @@ celerity_register_resource_map(array(
|
|||
'javelin-util' => '2dbbb7d1',
|
||||
'javelin-vector' => '2dbbb7d1',
|
||||
'javelin-workflow' => '2dbbb7d1',
|
||||
'lightbox-attachment-css' => 'd773a346',
|
||||
'lightbox-attachment-css' => '5e2ee206',
|
||||
'maniphest-task-summary-css' => '0a9e494f',
|
||||
'maniphest-transaction-detail-css' => '0a9e494f',
|
||||
'phabricator-action-list-view-css' => 'd773a346',
|
||||
'phabricator-application-launch-view-css' => 'd773a346',
|
||||
'phabricator-action-list-view-css' => '5e2ee206',
|
||||
'phabricator-application-launch-view-css' => '5e2ee206',
|
||||
'phabricator-busy' => '8977e356',
|
||||
'phabricator-content-source-view-css' => '44bfe40c',
|
||||
'phabricator-core-css' => 'd773a346',
|
||||
'phabricator-crumbs-view-css' => 'd773a346',
|
||||
'phabricator-core-css' => '5e2ee206',
|
||||
'phabricator-crumbs-view-css' => '5e2ee206',
|
||||
'phabricator-drag-and-drop-file-upload' => 'd07a3bc2',
|
||||
'phabricator-dropdown-menu' => '8977e356',
|
||||
'phabricator-file-upload' => '8977e356',
|
||||
'phabricator-filetree-view-css' => 'd773a346',
|
||||
'phabricator-flag-css' => 'd773a346',
|
||||
'phabricator-header-view-css' => 'd773a346',
|
||||
'phabricator-filetree-view-css' => '5e2ee206',
|
||||
'phabricator-flag-css' => '5e2ee206',
|
||||
'phabricator-header-view-css' => '5e2ee206',
|
||||
'phabricator-hovercard' => '8977e356',
|
||||
'phabricator-jump-nav' => 'd773a346',
|
||||
'phabricator-jump-nav' => '5e2ee206',
|
||||
'phabricator-keyboard-shortcut' => '8977e356',
|
||||
'phabricator-keyboard-shortcut-manager' => '8977e356',
|
||||
'phabricator-main-menu-view' => 'd773a346',
|
||||
'phabricator-main-menu-view' => '5e2ee206',
|
||||
'phabricator-menu-item' => '8977e356',
|
||||
'phabricator-nav-view-css' => 'd773a346',
|
||||
'phabricator-nav-view-css' => '5e2ee206',
|
||||
'phabricator-notification' => '8977e356',
|
||||
'phabricator-notification-css' => 'd773a346',
|
||||
'phabricator-notification-menu-css' => 'd773a346',
|
||||
'phabricator-object-item-list-view-css' => 'd773a346',
|
||||
'phabricator-notification-css' => '5e2ee206',
|
||||
'phabricator-notification-menu-css' => '5e2ee206',
|
||||
'phabricator-object-item-list-view-css' => '5e2ee206',
|
||||
'phabricator-object-selector-css' => '44bfe40c',
|
||||
'phabricator-phtize' => '8977e356',
|
||||
'phabricator-prefab' => '8977e356',
|
||||
'phabricator-project-tag-css' => '0a9e494f',
|
||||
'phabricator-property-list-view-css' => 'd773a346',
|
||||
'phabricator-remarkup-css' => 'd773a346',
|
||||
'phabricator-property-list-view-css' => '5e2ee206',
|
||||
'phabricator-remarkup-css' => '5e2ee206',
|
||||
'phabricator-shaped-request' => 'd07a3bc2',
|
||||
'phabricator-side-menu-view-css' => 'd773a346',
|
||||
'phabricator-standard-page-view' => 'd773a346',
|
||||
'phabricator-tag-view-css' => 'd773a346',
|
||||
'phabricator-side-menu-view-css' => '5e2ee206',
|
||||
'phabricator-standard-page-view' => '5e2ee206',
|
||||
'phabricator-tag-view-css' => '5e2ee206',
|
||||
'phabricator-textareautils' => '8977e356',
|
||||
'phabricator-tooltip' => '8977e356',
|
||||
'phabricator-transaction-view-css' => 'd773a346',
|
||||
'phabricator-zindex-css' => 'd773a346',
|
||||
'phui-button-css' => 'd773a346',
|
||||
'phui-form-css' => 'd773a346',
|
||||
'phui-form-view-css' => 'd773a346',
|
||||
'phui-icon-view-css' => 'd773a346',
|
||||
'phui-spacing-css' => 'd773a346',
|
||||
'sprite-apps-large-css' => 'd773a346',
|
||||
'sprite-gradient-css' => 'd773a346',
|
||||
'sprite-icons-css' => 'd773a346',
|
||||
'sprite-menu-css' => 'd773a346',
|
||||
'syntax-highlighting-css' => 'd773a346',
|
||||
'phabricator-transaction-view-css' => '5e2ee206',
|
||||
'phabricator-zindex-css' => '5e2ee206',
|
||||
'phui-button-css' => '5e2ee206',
|
||||
'phui-form-css' => '5e2ee206',
|
||||
'phui-form-view-css' => '5e2ee206',
|
||||
'phui-icon-view-css' => '5e2ee206',
|
||||
'phui-spacing-css' => '5e2ee206',
|
||||
'sprite-apps-large-css' => '5e2ee206',
|
||||
'sprite-gradient-css' => '5e2ee206',
|
||||
'sprite-icons-css' => '5e2ee206',
|
||||
'sprite-menu-css' => '5e2ee206',
|
||||
'syntax-highlighting-css' => '5e2ee206',
|
||||
),
|
||||
));
|
||||
|
|
|
@ -490,10 +490,9 @@ final class DivinerAtomController extends DivinerController {
|
|||
}
|
||||
}
|
||||
|
||||
if ($parameters !== null) {
|
||||
$out[] = id(new PhabricatorHeaderView())
|
||||
->setHeader(pht('Parameters'));
|
||||
if (nonempty($parameters)) {
|
||||
$out[] = id(new DivinerParameterTableView())
|
||||
->setHeader(pht('Parameters'))
|
||||
->setParameters($parameters);
|
||||
}
|
||||
|
||||
|
@ -509,10 +508,9 @@ final class DivinerAtomController extends DivinerController {
|
|||
}
|
||||
}
|
||||
|
||||
if ($return !== null) {
|
||||
$out[] = id(new PhabricatorHeaderView())
|
||||
->setHeader(pht('Return'));
|
||||
if (nonempty($return)) {
|
||||
$out[] = id(new DivinerReturnTableView())
|
||||
->setHeader(pht('Return'))
|
||||
->setReturn($collected_return);
|
||||
}
|
||||
|
||||
|
|
|
@ -3,19 +3,25 @@
|
|||
final class DivinerParameterTableView extends AphrontTagView {
|
||||
|
||||
private $parameters;
|
||||
private $header;
|
||||
|
||||
public function setParameters(array $parameters) {
|
||||
$this->parameters = $parameters;
|
||||
return $this;
|
||||
}
|
||||
|
||||
public function setHeader($text) {
|
||||
$this->header = $text;
|
||||
return $this;
|
||||
}
|
||||
|
||||
public function getTagName() {
|
||||
return 'table';
|
||||
return 'div';
|
||||
}
|
||||
|
||||
public function getTagAttributes() {
|
||||
return array(
|
||||
'class' => 'diviner-parameter-table-view',
|
||||
'class' => 'diviner-table-view',
|
||||
);
|
||||
}
|
||||
|
||||
|
@ -58,7 +64,20 @@ final class DivinerParameterTableView extends AphrontTagView {
|
|||
$rows[] = phutil_tag('tr', array(), $cells);
|
||||
}
|
||||
|
||||
return $rows;
|
||||
$table = phutil_tag(
|
||||
'table',
|
||||
array(
|
||||
'class' => 'diviner-parameter-table-view'),
|
||||
$rows);
|
||||
|
||||
$header = phutil_tag(
|
||||
'span',
|
||||
array(
|
||||
'class' => 'diviner-table-header'
|
||||
),
|
||||
$this->header);
|
||||
|
||||
return array($header, $table);
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
@ -3,19 +3,25 @@
|
|||
final class DivinerReturnTableView extends AphrontTagView {
|
||||
|
||||
private $return;
|
||||
private $header;
|
||||
|
||||
public function setReturn(array $return) {
|
||||
$this->return = $return;
|
||||
return $this;
|
||||
}
|
||||
|
||||
public function setHeader($text) {
|
||||
$this->header = $text;
|
||||
return $this;
|
||||
}
|
||||
|
||||
public function getTagName() {
|
||||
return 'table';
|
||||
return 'div';
|
||||
}
|
||||
|
||||
public function getTagAttributes() {
|
||||
return array(
|
||||
'class' => 'diviner-return-table-view',
|
||||
'class' => 'diviner-table-view',
|
||||
);
|
||||
}
|
||||
|
||||
|
@ -47,7 +53,25 @@ final class DivinerReturnTableView extends AphrontTagView {
|
|||
),
|
||||
$docs);
|
||||
|
||||
return phutil_tag('tr', array(), $cells);
|
||||
$rows = phutil_tag(
|
||||
'tr',
|
||||
array(),
|
||||
$cells);
|
||||
|
||||
$table = phutil_tag(
|
||||
'table',
|
||||
array(
|
||||
'class' => 'diviner-return-table-view'),
|
||||
$rows);
|
||||
|
||||
$header = phutil_tag(
|
||||
'span',
|
||||
array(
|
||||
'class' => 'diviner-table-header'
|
||||
),
|
||||
$this->header);
|
||||
|
||||
return array($header, $table);
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
@ -7,32 +7,52 @@
|
|||
font-size: 13px;
|
||||
}
|
||||
|
||||
.diviner-table-view {
|
||||
margin: 0 16px 24px;
|
||||
}
|
||||
|
||||
.device-phone .diviner-table-view {
|
||||
margin: 0 8px 16px;
|
||||
}
|
||||
|
||||
.diviner-table-header {
|
||||
padding: 4px 16px;
|
||||
background-color: {$greybackground};
|
||||
border-left: 1px solid {$lightblueborder};
|
||||
border-right: 1px solid {$lightblueborder};
|
||||
border-top: 1px solid {$lightblueborder};
|
||||
display: inline-block;
|
||||
border-top-left-radius: 3px;
|
||||
border-top-right-radius: 3px;
|
||||
font-weight: bold;
|
||||
color: {$bluetext};
|
||||
}
|
||||
|
||||
.diviner-return-table-view,
|
||||
.diviner-parameter-table-view {
|
||||
width: 100%;
|
||||
margin: 0 0 16px;
|
||||
background: #f6f6f6;
|
||||
border-bottom: 1px solid #c0c5d1;
|
||||
width: 100%;
|
||||
background: {$lightgreybackground};
|
||||
border: 1px solid {$lightblueborder};
|
||||
}
|
||||
|
||||
.diviner-return-table-type,
|
||||
.diviner-parameter-table-type {
|
||||
padding: 4px 8px 4px 12px;
|
||||
padding: 6px 8px 6px 12px;
|
||||
white-space: nowrap;
|
||||
text-align: right;
|
||||
color: {$greytext};
|
||||
color: {$bluetext};
|
||||
width: 20%;
|
||||
}
|
||||
|
||||
.diviner-parameter-table-name {
|
||||
padding: 4px 8px;
|
||||
padding: 6px 8px;
|
||||
white-space: nowrap;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.diviner-return-table-docs,
|
||||
.diviner-parameter-table-docs {
|
||||
padding: 4px 12px 4px 8px;
|
||||
padding: 6px 12px 6px 8px;
|
||||
width: 80%;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
|
|
@ -20,6 +20,10 @@
|
|||
color: {$darkbluetext};
|
||||
}
|
||||
|
||||
body.device-phone .phabricator-header-view {
|
||||
padding: 12px 8px;
|
||||
}
|
||||
|
||||
.device-desktop .phabricator-header-view {
|
||||
width: 66%;
|
||||
}
|
||||
|
@ -44,7 +48,7 @@
|
|||
}
|
||||
|
||||
.phabricator-header-subheader {
|
||||
color: {$darkgreytext};
|
||||
color: {$lightbluetext};
|
||||
font-weight: normal;
|
||||
font-size: 13px;
|
||||
margin-top: 4px;
|
||||
|
|
|
@ -34,7 +34,7 @@
|
|||
}
|
||||
|
||||
.phabricator-property-list-key {
|
||||
color: {$darkbluetext};
|
||||
color: {$bluetext};
|
||||
font-weight: bold;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
|
@ -50,19 +50,20 @@
|
|||
}
|
||||
|
||||
.device .phabricator-property-list-key {
|
||||
padding-left: 16px;
|
||||
padding-left: 8px;
|
||||
}
|
||||
|
||||
.phabricator-property-list-value {
|
||||
color: {$darkgreytext};
|
||||
overflow: hidden;
|
||||
line-height: 17px;
|
||||
}
|
||||
|
||||
.device-desktop .phabricator-property-list-value {
|
||||
width: 50%;
|
||||
margin-left: 1%;
|
||||
float: left;
|
||||
margin-bottom: .5em;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
|
||||
.device .phabricator-property-list-value {
|
||||
|
|
|
@ -50,6 +50,10 @@
|
|||
border-bottom: 1px solid #BFCFDA;
|
||||
}
|
||||
|
||||
.device-phone .phui-document-bookname {
|
||||
padding: 8px;
|
||||
}
|
||||
|
||||
.phui-document-bookname .bookname {
|
||||
float: left;
|
||||
}
|
||||
|
@ -70,7 +74,7 @@
|
|||
}
|
||||
|
||||
.phui-document-content .phabricator-property-list-container {
|
||||
border-color: #BFCFDA;
|
||||
border-color: #dde8ef;
|
||||
}
|
||||
|
||||
.phui-document-content .phabricator-property-list-view {
|
||||
|
|
Loading…
Reference in a new issue