diff --git a/resources/celerity/map.php b/resources/celerity/map.php index b9cde6ad51..2f74d82db8 100644 --- a/resources/celerity/map.php +++ b/resources/celerity/map.php @@ -7,7 +7,7 @@ */ return array( 'names' => array( - 'core.pkg.css' => '80c32191', + 'core.pkg.css' => 'd5d34907', 'core.pkg.js' => '7d8faf57', 'darkconsole.pkg.js' => 'e7393ebb', 'differential.pkg.css' => '2de124c9', @@ -25,7 +25,7 @@ return array( 'rsrc/css/aphront/notification.css' => '7f684b62', 'rsrc/css/aphront/panel-view.css' => '8427b78d', 'rsrc/css/aphront/phabricator-nav-view.css' => 'ac79a758', - 'rsrc/css/aphront/table-view.css' => 'aba95954', + 'rsrc/css/aphront/table-view.css' => '036b6cdc', 'rsrc/css/aphront/tokenizer.css' => '056da01b', 'rsrc/css/aphront/tooltip.css' => '1a07aea8', 'rsrc/css/aphront/typeahead-browse.css' => 'd8581d2c', @@ -123,7 +123,7 @@ return array( 'rsrc/css/phui/phui-action-panel.css' => '91c7b835', 'rsrc/css/phui/phui-badge.css' => 'f25c3476', 'rsrc/css/phui/phui-big-info-view.css' => 'bd903741', - 'rsrc/css/phui/phui-box.css' => '348bd872', + 'rsrc/css/phui/phui-box.css' => 'c9e01148', 'rsrc/css/phui/phui-button.css' => 'a64a8de6', 'rsrc/css/phui/phui-chart.css' => '6bf6f78e', 'rsrc/css/phui/phui-crumbs-view.css' => '79d536e5', @@ -135,7 +135,7 @@ return array( 'rsrc/css/phui/phui-form-view.css' => '4a1a0f5e', 'rsrc/css/phui/phui-form.css' => 'aac1d51d', 'rsrc/css/phui/phui-head-thing.css' => '11731da0', - 'rsrc/css/phui/phui-header-view.css' => '6152c91b', + 'rsrc/css/phui/phui-header-view.css' => 'fc4acf14', 'rsrc/css/phui/phui-hovercard.css' => 'de1a2119', 'rsrc/css/phui/phui-icon-set-selector.css' => '1ab67aad', 'rsrc/css/phui/phui-icon.css' => '3f33ab57', @@ -155,7 +155,7 @@ return array( 'rsrc/css/phui/phui-status.css' => '888cedb8', 'rsrc/css/phui/phui-tag-view.css' => '9d5d4400', 'rsrc/css/phui/phui-timeline-view.css' => '2efceff8', - 'rsrc/css/phui/phui-two-column-view.css' => '7c5d0741', + 'rsrc/css/phui/phui-two-column-view.css' => 'cc0b8a09', 'rsrc/css/phui/workboards/phui-workboard-color.css' => 'ac6fe6a7', 'rsrc/css/phui/workboards/phui-workboard.css' => 'e6d89647', 'rsrc/css/phui/workboards/phui-workcard.css' => '3646fb96', @@ -524,7 +524,7 @@ return array( 'aphront-list-filter-view-css' => '5d6f0526', 'aphront-multi-column-view-css' => 'fd18389d', 'aphront-panel-view-css' => '8427b78d', - 'aphront-table-view-css' => 'aba95954', + 'aphront-table-view-css' => '036b6cdc', 'aphront-tokenizer-control-css' => '056da01b', 'aphront-tooltip-css' => '1a07aea8', 'aphront-typeahead-control-css' => 'd4f16145', @@ -803,7 +803,7 @@ return array( 'phui-action-panel-css' => '91c7b835', 'phui-badge-view-css' => 'f25c3476', 'phui-big-info-view-css' => 'bd903741', - 'phui-box-css' => '348bd872', + 'phui-box-css' => 'c9e01148', 'phui-button-css' => 'a64a8de6', 'phui-calendar-css' => 'ccabe893', 'phui-calendar-day-css' => 'd1cf6f93', @@ -820,7 +820,7 @@ return array( 'phui-form-css' => 'aac1d51d', 'phui-form-view-css' => '4a1a0f5e', 'phui-head-thing-view-css' => '11731da0', - 'phui-header-view-css' => '6152c91b', + 'phui-header-view-css' => 'fc4acf14', 'phui-hovercard' => '1bd28176', 'phui-hovercard-view-css' => 'de1a2119', 'phui-icon-set-selector-css' => '1ab67aad', @@ -843,7 +843,7 @@ return array( 'phui-tag-view-css' => '9d5d4400', 'phui-theme-css' => '027ba77e', 'phui-timeline-view-css' => '2efceff8', - 'phui-two-column-view-css' => '7c5d0741', + 'phui-two-column-view-css' => 'cc0b8a09', 'phui-workboard-color-css' => 'ac6fe6a7', 'phui-workboard-view-css' => 'e6d89647', 'phui-workcard-view-css' => '3646fb96', diff --git a/src/applications/almanac/controller/AlmanacController.php b/src/applications/almanac/controller/AlmanacController.php index 3b354b0803..c76fdf11b5 100644 --- a/src/applications/almanac/controller/AlmanacController.php +++ b/src/applications/almanac/controller/AlmanacController.php @@ -158,16 +158,16 @@ abstract class AlmanacController ->setIcon('fa-plus'); $header = id(new PHUIHeaderView()) - ->setHeader(pht('Properties')) + ->setHeader(pht('PROPERTIES')) ->addActionLink($add_button); return id(new PHUIObjectBoxView()) ->setHeader($header) + ->setBackground(PHUIObjectBoxView::BLUE_PROPERTY) ->setTable($table); } protected function addClusterMessage( - PHUIObjectBoxView $box, $positive, $negative) { @@ -194,14 +194,13 @@ abstract class AlmanacController $icon = id(new PHUIIconView()) ->setIcon('fa-sitemap'); - $error_view = id(new PHUIInfoView()) + return id(new PHUIInfoView()) ->setSeverity($severity) ->setErrors( array( array($icon, ' ', $message, ' ', $doc_link), )); - $box->setInfoView($error_view); } protected function getPropertyDeleteURI($object) { diff --git a/src/applications/almanac/controller/AlmanacDeviceViewController.php b/src/applications/almanac/controller/AlmanacDeviceViewController.php index 4836198763..f6bf697e31 100644 --- a/src/applications/almanac/controller/AlmanacDeviceViewController.php +++ b/src/applications/almanac/controller/AlmanacDeviceViewController.php @@ -23,22 +23,18 @@ final class AlmanacDeviceViewController $title = pht('Device %s', $device->getName()); - $property_list = $this->buildPropertyList($device); - $action_list = $this->buildActionList($device); - $property_list->setActionList($action_list); + $properties = $this->buildPropertyList($device); + $actions = $this->buildActionList($device); $header = id(new PHUIHeaderView()) ->setUser($viewer) ->setHeader($device->getName()) - ->setPolicyObject($device); - - $box = id(new PHUIObjectBoxView()) - ->setHeader($header) - ->addPropertyList($property_list); + ->setPolicyObject($device) + ->setHeaderIcon('fa-server'); + $issue = null; if ($device->isClusterDevice()) { - $this->addClusterMessage( - $box, + $issue = $this->addClusterMessage( pht('This device is bound to a cluster service.'), pht( 'This device is bound to a cluster service. You do not have '. @@ -50,24 +46,33 @@ final class AlmanacDeviceViewController $crumbs = $this->buildApplicationCrumbs(); $crumbs->addTextCrumb($device->getName()); + $crumbs->setBorder(true); $timeline = $this->buildTransactionTimeline( $device, new AlmanacDeviceTransactionQuery()); $timeline->setShouldTerminate(true); - return $this->newPage() - ->setTitle($title) - ->setCrumbs($crumbs) - ->appendChild( - array( - $box, + $view = id(new PHUITwoColumnView()) + ->setHeader($header) + ->setMainColumn(array( + $issue, $interfaces, $this->buildAlmanacPropertiesTable($device), $this->buildSSHKeysTable($device), $this->buildServicesTable($device), $timeline, - )); + )) + ->setPropertyList($properties) + ->setActionList($actions); + + return $this->newPage() + ->setTitle($title) + ->setCrumbs($crumbs) + ->appendChild( + array( + $view, + )); } private function buildPropertyList(AlmanacDevice $device) { @@ -123,7 +128,7 @@ final class AlmanacDeviceViewController ->setCanEdit($can_edit); $header = id(new PHUIHeaderView()) - ->setHeader(pht('Device Interfaces')) + ->setHeader(pht('DEVICE INTERFACES')) ->addActionLink( id(new PHUIButtonView()) ->setTag('a') @@ -135,6 +140,7 @@ final class AlmanacDeviceViewController return id(new PHUIObjectBoxView()) ->setHeader($header) + ->setBackground(PHUIObjectBoxView::BLUE_PROPERTY) ->setTable($table); } @@ -172,7 +178,7 @@ final class AlmanacDeviceViewController $upload_uri = '/auth/sshkey/upload/?objectPHID='.$device_phid; $header = id(new PHUIHeaderView()) - ->setHeader(pht('SSH Public Keys')) + ->setHeader(pht('SSH PUBLIC KEYS')) ->addActionLink( id(new PHUIButtonView()) ->setTag('a') @@ -196,9 +202,8 @@ final class AlmanacDeviceViewController return id(new PHUIObjectBoxView()) ->setHeader($header) + ->setBackground(PHUIObjectBoxView::BLUE_PROPERTY) ->setTable($table); - - } private function buildServicesTable(AlmanacDevice $device) { @@ -244,7 +249,8 @@ final class AlmanacDeviceViewController )); return id(new PHUIObjectBoxView()) - ->setHeaderText(pht('Bound Services')) + ->setHeaderText(pht('BOUND SERVICES')) + ->setBackground(PHUIObjectBoxView::BLUE_PROPERTY) ->setTable($table); } diff --git a/src/applications/almanac/controller/AlmanacNamespaceViewController.php b/src/applications/almanac/controller/AlmanacNamespaceViewController.php index 4f140683a2..b999f219fc 100644 --- a/src/applications/almanac/controller/AlmanacNamespaceViewController.php +++ b/src/applications/almanac/controller/AlmanacNamespaceViewController.php @@ -21,42 +21,49 @@ final class AlmanacNamespaceViewController $title = pht('Namespace %s', $namespace->getName()); - $property_list = $this->buildPropertyList($namespace); - $action_list = $this->buildActionList($namespace); - $property_list->setActionList($action_list); + $properties = $this->buildPropertyList($namespace); + $actions = $this->buildActionList($namespace); $header = id(new PHUIHeaderView()) ->setUser($viewer) ->setHeader($namespace->getName()) - ->setPolicyObject($namespace); - - $box = id(new PHUIObjectBoxView()) - ->setHeader($header) - ->addPropertyList($property_list); + ->setPolicyObject($namespace) + ->setHeaderIcon('fa-asterisk'); $crumbs = $this->buildApplicationCrumbs(); $crumbs->addTextCrumb($namespace->getName()); + $crumbs->setBorder(true); $timeline = $this->buildTransactionTimeline( $namespace, new AlmanacNamespaceTransactionQuery()); $timeline->setShouldTerminate(true); + $view = id(new PHUITwoColumnView()) + ->setHeader($header) + ->setMainColumn(array( + $timeline, + )) + ->setPropertyList($properties) + ->setActionList($actions); + return $this->newPage() ->setTitle($title) ->setCrumbs($crumbs) ->appendChild( array( - $box, - $timeline, - )); + $view, + )); } private function buildPropertyList(AlmanacNamespace $namespace) { $viewer = $this->getViewer(); $properties = id(new PHUIPropertyListView()) - ->setUser($viewer); + ->setUser($viewer) + ->setObject($namespace); + + $properties->invokeWillRenderEvent(); return $properties; } diff --git a/src/applications/almanac/controller/AlmanacNetworkViewController.php b/src/applications/almanac/controller/AlmanacNetworkViewController.php index 70bd0cb87e..11e6eaf799 100644 --- a/src/applications/almanac/controller/AlmanacNetworkViewController.php +++ b/src/applications/almanac/controller/AlmanacNetworkViewController.php @@ -21,34 +21,38 @@ final class AlmanacNetworkViewController $title = pht('Network %s', $network->getName()); - $property_list = $this->buildPropertyList($network); - $action_list = $this->buildActionList($network); - $property_list->setActionList($action_list); + $properties = $this->buildPropertyList($network); + $actions = $this->buildActionList($network); $header = id(new PHUIHeaderView()) ->setUser($viewer) ->setHeader($network->getName()) + ->setHeaderIcon('fa-globe') ->setPolicyObject($network); - $box = id(new PHUIObjectBoxView()) - ->setHeader($header) - ->addPropertyList($property_list); - $crumbs = $this->buildApplicationCrumbs(); $crumbs->addTextCrumb($network->getName()); + $crumbs->setBorder(true); $timeline = $this->buildTransactionTimeline( $network, new AlmanacNetworkTransactionQuery()); $timeline->setShouldTerminate(true); + $view = id(new PHUITwoColumnView()) + ->setHeader($header) + ->setMainColumn(array( + $timeline, + )) + ->setPropertyList($properties) + ->setActionList($actions); + return $this->newPage() ->setTitle($title) ->setCrumbs($crumbs) ->appendChild( array( - $box, - $timeline, + $view, )); } @@ -56,7 +60,10 @@ final class AlmanacNetworkViewController $viewer = $this->getViewer(); $properties = id(new PHUIPropertyListView()) - ->setUser($viewer); + ->setUser($viewer) + ->setObject($network); + + $properties->invokeWillRenderEvent(); return $properties; } diff --git a/src/applications/almanac/controller/AlmanacServiceViewController.php b/src/applications/almanac/controller/AlmanacServiceViewController.php index 68defec4b9..0b59a47442 100644 --- a/src/applications/almanac/controller/AlmanacServiceViewController.php +++ b/src/applications/almanac/controller/AlmanacServiceViewController.php @@ -23,22 +23,19 @@ final class AlmanacServiceViewController $title = pht('Service %s', $service->getName()); - $property_list = $this->buildPropertyList($service); - $action_list = $this->buildActionList($service); - $property_list->setActionList($action_list); + $properties = $this->buildPropertyList($service); + $actions = $this->buildActionList($service); + $details = $this->buildPropertySection($service); $header = id(new PHUIHeaderView()) ->setUser($viewer) ->setHeader($service->getName()) - ->setPolicyObject($service); - - $box = id(new PHUIObjectBoxView()) - ->setHeader($header) - ->addPropertyList($property_list); + ->setPolicyObject($service) + ->setHeaderIcon('fa-plug'); + $issue = null; if ($service->isClusterService()) { - $this->addClusterMessage( - $box, + $issue = $this->addClusterMessage( pht('This is a cluster service.'), pht( 'This service is a cluster service. You do not have permission to '. @@ -49,36 +46,62 @@ final class AlmanacServiceViewController $crumbs = $this->buildApplicationCrumbs(); $crumbs->addTextCrumb($service->getName()); + $crumbs->setBorder(true); $timeline = $this->buildTransactionTimeline( $service, new AlmanacServiceTransactionQuery()); $timeline->setShouldTerminate(true); + $view = id(new PHUITwoColumnView()) + ->setHeader($header) + ->setMainColumn(array( + $issue, + $details, + $bindings, + $this->buildAlmanacPropertiesTable($service), + $timeline, + )) + ->setPropertyList($properties) + ->setActionList($actions); + return $this->newPage() ->setTitle($title) ->setCrumbs($crumbs) ->appendChild( array( - $box, - $bindings, - $this->buildAlmanacPropertiesTable($service), - $timeline, - )); + $view, + )); } - private function buildPropertyList(AlmanacService $service) { + private function buildPropertyList( + AlmanacService $service) { + $viewer = $this->getViewer(); + + $view = id(new PHUIPropertyListView()) + ->setUser($viewer) + ->setObject($service); + + $view->invokeWillRenderEvent(); + + return $view; + } + + private function buildPropertySection( + AlmanacService $service) { $viewer = $this->getViewer(); $properties = id(new PHUIPropertyListView()) - ->setUser($viewer) - ->setObject($service); + ->setUser($viewer); $properties->addProperty( pht('Service Type'), $service->getServiceImplementation()->getServiceTypeShortName()); - return $properties; + return id(new PHUIObjectBoxView()) + ->setHeaderText(pht('DETAILS')) + ->setBackground(PHUIObjectBoxView::BLUE_PROPERTY) + ->appendChild($properties); } private function buildActionList(AlmanacService $service) { @@ -126,7 +149,7 @@ final class AlmanacServiceViewController ->setHideServiceColumn(true); $header = id(new PHUIHeaderView()) - ->setHeader(pht('Service Bindings')) + ->setHeader(pht('SERVICE BINDINGS')) ->addActionLink( id(new PHUIButtonView()) ->setTag('a') @@ -138,6 +161,7 @@ final class AlmanacServiceViewController return id(new PHUIObjectBoxView()) ->setHeader($header) + ->setBackground(PHUIObjectBoxView::BLUE_PROPERTY) ->setTable($table); } diff --git a/src/view/phui/PHUIHeaderView.php b/src/view/phui/PHUIHeaderView.php index 7227bed0a7..0e12bc9abe 100644 --- a/src/view/phui/PHUIHeaderView.php +++ b/src/view/phui/PHUIHeaderView.php @@ -313,10 +313,11 @@ final class PHUIHeaderView extends AphrontTagView { $action_list); } + $icon = null; if ($this->headerIcon) { $icon = id(new PHUIIconView()) - ->setIcon($this->headerIcon); - $left[] = $icon; + ->setIcon($this->headerIcon) + ->addClass('phui-header-icon'); } $header_content = $this->header; @@ -338,6 +339,7 @@ final class PHUIHeaderView extends AphrontTagView { ), array( $space_header, + $icon, $header_content, )); diff --git a/webroot/rsrc/css/aphront/table-view.css b/webroot/rsrc/css/aphront/table-view.css index 40dc1be987..b2efc8c3c0 100644 --- a/webroot/rsrc/css/aphront/table-view.css +++ b/webroot/rsrc/css/aphront/table-view.css @@ -248,10 +248,11 @@ span.single-display-line-content { } .aphront-table-view tr.no-data td { - padding: 12px; + padding: 16px; text-align: center; color: {$lightgreytext}; font-style: italic; + font-size: {$normalfontsize}; } .aphront-table-view td.thumb img { diff --git a/webroot/rsrc/css/phui/phui-box.css b/webroot/rsrc/css/phui/phui-box.css index 38ca1d7610..7eaca8b741 100644 --- a/webroot/rsrc/css/phui/phui-box.css +++ b/webroot/rsrc/css/phui/phui-box.css @@ -66,6 +66,11 @@ padding: 0; } +.phui-box.phui-box-blue-property .phui-header-action-link { + margin-top: 0; + margin-bottom: 0; +} + .device .phui-box.phui-box-blue-property { padding: 0; } diff --git a/webroot/rsrc/css/phui/phui-header-view.css b/webroot/rsrc/css/phui/phui-header-view.css index 1ce8efd9e2..cd4b7b1238 100644 --- a/webroot/rsrc/css/phui/phui-header-view.css +++ b/webroot/rsrc/css/phui/phui-header-view.css @@ -75,6 +75,11 @@ body .phui-header-shell.phui-bleed-header color: {$darkbluetext}; } +.phui-header-header .phui-header-icon { + margin-right: 8px; + color: {$lightbluetext}; +} + .phui-object-box .phui-header-tall .phui-header-header, .phui-document-view .phui-header-tall .phui-header-header { font-size: 18px; diff --git a/webroot/rsrc/css/phui/phui-two-column-view.css b/webroot/rsrc/css/phui/phui-two-column-view.css index 91e236ec6b..d0dd4eebdf 100644 --- a/webroot/rsrc/css/phui/phui-two-column-view.css +++ b/webroot/rsrc/css/phui/phui-two-column-view.css @@ -75,6 +75,10 @@ margin: 0 0 20px 0; } +.phui-two-column-view .phui-object-box.phui-object-box-collapsed { + padding: 0; +} + /* Timeline */ .phui-two-column-view .phui-timeline-view { @@ -112,6 +116,7 @@ .phui-two-column-properties .phabricator-action-list-view { padding-top: 4px; + padding-bottom: 12px; } .device-desktop .phui-two-column-view .phui-property-list-container { @@ -128,19 +133,19 @@ .phui-two-column-properties .phui-property-list-stacked .phui-property-list-properties .phui-property-list-key { - margin: 20px 0 8px 0; + margin: 4px 0 8px 0; padding: 20px 4px 0; border-top: 1px solid rgba({$alphablue}, .2); } .phui-two-column-properties .phui-property-list-stacked .phui-property-list-properties .phui-property-list-value { - margin: 0; + margin: 0 0 20px 0; padding: 0 4px; } .device-desktop .phui-two-column-properties .phui-property-list-container { - padding: 0 0 20px 0; + padding: 0; } .device .phui-two-column-properties .phui-property-list-stacked @@ -190,3 +195,9 @@ .device .phui-two-column-view .phui-property-list-text-content { margin: 0 8px; } + +/* Info View */ + +.phui-two-column-view .phui-two-column-content .phui-info-view { + margin: 0 0 20px 0; +}