1
0
Fork 0
mirror of https://we.phorge.it/source/phorge.git synced 2024-11-10 00:42:41 +01:00

Add a Stacked view for PropertyList

Summary: Turns a Property List into a stacked view like on tablet/mobile. Useful for where text is longer.

Test Plan:
Test a Herald Transcript page

{F148438}

{F148439}

Reviewers: btrahan, epriestley

Reviewed By: epriestley

Subscribers: epriestley, Korvin

Differential Revision: https://secure.phabricator.com/D8891
This commit is contained in:
Chad Little 2014-04-29 07:04:22 -07:00
parent b6fa4856d2
commit 3bc2db199a
4 changed files with 27 additions and 7 deletions

View file

@ -7,7 +7,7 @@
return array(
'names' =>
array(
'core.pkg.css' => '9e7cce62',
'core.pkg.css' => 'b39b2afb',
'core.pkg.js' => '417722ff',
'darkconsole.pkg.js' => 'ca8671ce',
'differential.pkg.css' => '8a064eb7',
@ -138,7 +138,7 @@ return array(
'rsrc/css/phui/phui-object-box.css' => 'ce92d8ec',
'rsrc/css/phui/phui-object-item-list-view.css' => '8b459abe',
'rsrc/css/phui/phui-pinboard-view.css' => '4b346c2a',
'rsrc/css/phui/phui-property-list-view.css' => 'dbf53b12',
'rsrc/css/phui/phui-property-list-view.css' => 'c4d44192',
'rsrc/css/phui/phui-remarkup-preview.css' => '19ad512b',
'rsrc/css/phui/phui-spacing.css' => '042804d6',
'rsrc/css/phui/phui-status.css' => '2f562399',
@ -760,7 +760,7 @@ return array(
'phui-object-box-css' => 'ce92d8ec',
'phui-object-item-list-view-css' => '8b459abe',
'phui-pinboard-view-css' => '4b346c2a',
'phui-property-list-view-css' => 'dbf53b12',
'phui-property-list-view-css' => 'c4d44192',
'phui-remarkup-preview-css' => '19ad512b',
'phui-spacing-css' => '042804d6',
'phui-status-list-view-css' => '2f562399',

View file

@ -511,6 +511,7 @@ final class HeraldTranscriptController extends HeraldController {
}
$property_list = new PHUIPropertyListView();
$property_list->setStacked(true);
foreach ($rows as $row) {
$property_list->addProperty($row[0], $row[1]);
}

View file

@ -8,6 +8,7 @@ final class PHUIPropertyListView extends AphrontView {
private $invokedWillRenderEvent;
private $actionList;
private $classes = array();
private $stacked;
const ICON_SUMMARY = 'pl-summary';
const ICON_TESTPLAN = 'pl-testplan';
@ -26,6 +27,11 @@ final class PHUIPropertyListView extends AphrontView {
return $this;
}
public function setStacked($stacked) {
$this->stacked = $stacked;
return $this;
}
public function addClass($class) {
$this->classes[] = $class;
return $this;
@ -158,10 +164,15 @@ final class PHUIPropertyListView extends AphrontView {
array($value, ' '));
}
$stacked = '';
if ($this->stacked) {
$stacked = 'phui-property-list-stacked';
}
$list = phutil_tag(
'dl',
array(
'class' => 'phui-property-list-properties',
'class' => 'phui-property-list-properties '.$stacked,
),
$items);

View file

@ -55,8 +55,13 @@
margin-bottom: 4px;
}
.device .phui-property-list-key {
padding-left: 8px;
.device .phui-property-list-key,
.phui-property-list-properties.phui-property-list-stacked
.phui-property-list-key {
padding-left: 12px;
text-align: left;
margin-left: 0;
width: 100%;
}
.phui-property-list-value {
@ -71,9 +76,12 @@
margin-bottom: 4px;
}
.device .phui-property-list-value {
.device .phui-property-list-value,
.phui-property-list-properties.phui-property-list-stacked
.phui-property-list-value {
padding-left: 16px;
margin-bottom: 8px;
width: 100%;
}
.phui-property-list-section-header {