Update Harbormaster for two column

Summary: Updates the Harbormaster UI to match the new two column everywhere else.

Test Plan: Did best I could, tested builds, plans, steps, buildables. Unable to test lint/unit locally, I need to set that up. Kick the tires for me pls. :3

Reviewers: epriestley

Reviewed By: epriestley

Subscribers: Korvin

Differential Revision: https://secure.phabricator.com/D15523

resources/celerity/map.php

@@ -7,7 +7,7 @@
  */
 return array(
   'names' => array(
-    'core.pkg.css' => 'befbf333',
+    'core.pkg.css' => '9acdee84',
     'core.pkg.js' => '7d8faf57',
     'darkconsole.pkg.js' => 'e7393ebb',
     'differential.pkg.css' => '7ba78475',
@@ -155,7 +155,7 @@ return array(
     'rsrc/css/phui/phui-spacing.css' => '042804d6',
     'rsrc/css/phui/phui-status.css' => '37309046',
     'rsrc/css/phui/phui-tag-view.css' => '6bbd83e2',
-    'rsrc/css/phui/phui-timeline-view.css' => 'a0173eba',
+    'rsrc/css/phui/phui-timeline-view.css' => '6e342216',
     'rsrc/css/phui/phui-two-column-view.css' => '9c43b599',
     'rsrc/css/phui/workboards/phui-workboard-color.css' => 'ac6fe6a7',
     'rsrc/css/phui/workboards/phui-workboard.css' => 'e6d89647',
@@ -845,7 +845,7 @@ return array(
     'phui-status-list-view-css' => '37309046',
     'phui-tag-view-css' => '6bbd83e2',
     'phui-theme-css' => '027ba77e',
-    'phui-timeline-view-css' => 'a0173eba',
+    'phui-timeline-view-css' => '6e342216',
     'phui-two-column-view-css' => '9c43b599',
     'phui-workboard-color-css' => 'ac6fe6a7',
     'phui-workboard-view-css' => 'e6d89647',

src/applications/differential/controller/DifferentialRevisionViewController.php

@@ -1166,7 +1166,6 @@ final class DifferentialRevisionViewController extends DifferentialController {
       ->setBuildable($diff->getBuildable())
       ->setUnitMessages($diff->getUnitMessages())
       ->setLimit(5)
-      ->setBackground(PHUIObjectBoxView::BLUE_PROPERTY)
       ->setShowViewAll(true);
   }
 

src/applications/harbormaster/controller/HarbormasterBuildViewController.php

@@ -22,30 +22,33 @@ final class HarbormasterBuildViewController
 
     $title = pht('Build %d', $id);
 
-    $header = id(new PHUIHeaderView())
+    $page_header = id(new PHUIHeaderView())
       ->setHeader($title)
       ->setUser($viewer)
-      ->setPolicyObject($build);
+      ->setPolicyObject($build)
+      ->setHeaderIcon('fa-cubes');
 
     if ($build->isRestarting()) {
-      $header->setStatus('fa-exclamation-triangle', 'red', pht('Restarting'));
+      $page_header->setStatus(
+        'fa-exclamation-triangle', 'red', pht('Restarting'));
     } else if ($build->isPausing()) {
-      $header->setStatus('fa-exclamation-triangle', 'red', pht('Pausing'));
+      $page_header->setStatus(
+        'fa-exclamation-triangle', 'red', pht('Pausing'));
     } else if ($build->isResuming()) {
-      $header->setStatus('fa-exclamation-triangle', 'red', pht('Resuming'));
+      $page_header->setStatus(
+        'fa-exclamation-triangle', 'red', pht('Resuming'));
     } else if ($build->isAborting()) {
-      $header->setStatus('fa-exclamation-triangle', 'red', pht('Aborting'));
+      $page_header->setStatus(
+        'fa-exclamation-triangle', 'red', pht('Aborting'));
     }
 
-    $box = id(new PHUIObjectBoxView())
+    $curtain = $this->buildCurtainView($build);
-      ->setHeader($header);
+    $properties = $this->buildPropertyList($build);
-
-    $actions = $this->buildActionList($build);
-    $this->buildPropertyLists($box, $build, $actions);
 
     $crumbs = $this->buildApplicationCrumbs();
     $this->addBuildableCrumb($crumbs, $build->getBuildable());
     $crumbs->addTextCrumb($title);
+    $crumbs->setBorder(true);
 
     if ($generation === null || $generation > $build->getBuildGeneration() ||
       $generation < 0) {
@@ -85,12 +88,14 @@ final class HarbormasterBuildViewController
     foreach ($build_targets as $build_target) {
       $header = id(new PHUIHeaderView())
         ->setHeader($build_target->getName())
-        ->setUser($viewer);
+        ->setUser($viewer)
+        ->setHeaderIcon('fa-bullseye');
 
       $target_box = id(new PHUIObjectBoxView())
+        ->setBackground(PHUIObjectBoxView::BLUE_PROPERTY)
         ->setHeader($header);
 
-      $properties = new PHUIPropertyListView();
+      $property_list = new PHUIPropertyListView();
 
       $target_artifacts = idx($artifacts, $build_target->getPHID(), array());
 
@@ -107,13 +112,12 @@ final class HarbormasterBuildViewController
 
       if ($links) {
         $links = phutil_implode_html(phutil_tag('br'), $links);
-        $properties->addProperty(
+        $property_list->addProperty(
           pht('External Link'),
           $links);
       }
 
       $status_view = new PHUIStatusListView();
-
       $item = new PHUIStatusItemView();
 
       $status = $build_target->getTargetStatus();
@@ -168,13 +172,13 @@ final class HarbormasterBuildViewController
         }
       }
 
-      $properties->addProperty(
+      $property_list->addProperty(
         pht('When'),
         phutil_implode_html(" \xC2\xB7 ", $when));
 
-      $properties->addProperty(pht('Status'), $status_view);
+      $property_list->addProperty(pht('Status'), $status_view);
 
-      $target_box->addPropertyList($properties, pht('Overview'));
+      $target_box->addPropertyList($property_list, pht('Overview'));
 
       $step = $build_target->getBuildStep();
 
@@ -182,9 +186,9 @@ final class HarbormasterBuildViewController
         $description = $step->getDescription();
         if ($description) {
           $description = new PHUIRemarkupView($viewer, $description);
-          $properties->addSectionHeader(
+          $property_list->addSectionHeader(
             pht('Description'), PHUIPropertyListView::ICON_SUMMARY);
-          $properties->addTextContent($description);
+          $property_list->addTextContent($description);
         }
       } else {
         $target_box->setFormErrors(
@@ -196,35 +200,35 @@ final class HarbormasterBuildViewController
       }
 
       $details = $build_target->getDetails();
-      $properties = new PHUIPropertyListView();
+      $property_list = new PHUIPropertyListView();
       foreach ($details as $key => $value) {
-        $properties->addProperty($key, $value);
+        $property_list->addProperty($key, $value);
       }
-      $target_box->addPropertyList($properties, pht('Configuration'));
+      $target_box->addPropertyList($property_list, pht('Configuration'));
 
       $variables = $build_target->getVariables();
-      $properties = new PHUIPropertyListView();
+      $property_list = new PHUIPropertyListView();
-      $properties->addRawContent($this->buildProperties($variables));
+      $property_list->addRawContent($this->buildProperties($variables));
-      $target_box->addPropertyList($properties, pht('Variables'));
+      $target_box->addPropertyList($property_list, pht('Variables'));
 
       $artifacts_tab = $this->buildArtifacts($build_target, $target_artifacts);
-      $properties = new PHUIPropertyListView();
+      $property_list = new PHUIPropertyListView();
-      $properties->addRawContent($artifacts_tab);
+      $property_list->addRawContent($artifacts_tab);
-      $target_box->addPropertyList($properties, pht('Artifacts'));
+      $target_box->addPropertyList($property_list, pht('Artifacts'));
 
       $build_messages = idx($messages, $build_target->getPHID(), array());
-      $properties = new PHUIPropertyListView();
+      $property_list = new PHUIPropertyListView();
-      $properties->addRawContent($this->buildMessages($build_messages));
+      $property_list->addRawContent($this->buildMessages($build_messages));
-      $target_box->addPropertyList($properties, pht('Messages'));
+      $target_box->addPropertyList($property_list, pht('Messages'));
 
-      $properties = new PHUIPropertyListView();
+      $property_list = new PHUIPropertyListView();
-      $properties->addProperty(
+      $property_list->addProperty(
         pht('Build Target ID'),
         $build_target->getID());
-      $properties->addProperty(
+      $property_list->addProperty(
         pht('Build Target PHID'),
         $build_target->getPHID());
-      $target_box->addPropertyList($properties, pht('Metadata'));
+      $target_box->addPropertyList($property_list, pht('Metadata'));
 
       $targets[] = $target_box;
 
@@ -236,16 +240,20 @@ final class HarbormasterBuildViewController
       new HarbormasterBuildTransactionQuery());
     $timeline->setShouldTerminate(true);
 
-    return $this->buildApplicationPage(
+    $view = id(new PHUITwoColumnView())
-      array(
+      ->setHeader($page_header)
-        $crumbs,
+      ->setCurtain($curtain)
-        $box,
+      ->setMainColumn(array(
+        $properties,
         $targets,
         $timeline,
-      ),
-      array(
-        'title' => $title,
       ));
+
+    return $this->newPage()
+      ->setTitle($title)
+      ->setCrumbs($crumbs)
+      ->appendChild($view);
+
   }
 
   private function buildArtifacts(
@@ -342,6 +350,7 @@ final class HarbormasterBuildViewController
 
       $log_box = id(new PHUIObjectBoxView())
         ->setHeader($header)
+        ->setBackground(PHUIObjectBoxView::BLUE_PROPERTY)
         ->setForm($log_view);
 
       if ($is_empty) {
@@ -432,14 +441,11 @@ final class HarbormasterBuildViewController
       ));
   }
 
-  private function buildActionList(HarbormasterBuild $build) {
+  private function buildCurtainView(HarbormasterBuild $build) {
-    $request = $this->getRequest();
+    $viewer = $this->getViewer();
-    $viewer = $request->getUser();
     $id = $build->getID();
 
-    $list = id(new PhabricatorActionListView())
+    $curtain = $this->newCurtainView($build);
-      ->setUser($viewer)
-      ->setObject($build);
 
     $can_restart =
       $build->canRestartBuild() &&
@@ -465,7 +471,7 @@ final class HarbormasterBuildViewController
         $viewer,
         HarbormasterBuildCommand::COMMAND_ABORT);
 
-    $list->addAction(
+    $curtain->addAction(
       id(new PhabricatorActionView())
         ->setName(pht('Restart Build'))
         ->setIcon('fa-repeat')
@@ -474,7 +480,7 @@ final class HarbormasterBuildViewController
         ->setWorkflow(true));
 
     if ($build->canResumeBuild()) {
-      $list->addAction(
+      $curtain->addAction(
         id(new PhabricatorActionView())
           ->setName(pht('Resume Build'))
           ->setIcon('fa-play')
@@ -482,7 +488,7 @@ final class HarbormasterBuildViewController
           ->setDisabled(!$can_resume)
           ->setWorkflow(true));
     } else {
-      $list->addAction(
+      $curtain->addAction(
         id(new PhabricatorActionView())
           ->setName(pht('Pause Build'))
           ->setIcon('fa-pause')
@@ -491,7 +497,7 @@ final class HarbormasterBuildViewController
           ->setWorkflow(true));
     }
 
-    $list->addAction(
+    $curtain->addAction(
       id(new PhabricatorActionView())
         ->setName(pht('Abort Build'))
         ->setIcon('fa-exclamation-triangle')
@@ -499,21 +505,14 @@ final class HarbormasterBuildViewController
         ->setDisabled(!$can_abort)
         ->setWorkflow(true));
 
-    return $list;
+    return $curtain;
   }
 
-  private function buildPropertyLists(
+  private function buildPropertyList(HarbormasterBuild $build) {
-    PHUIObjectBoxView $box,
+    $viewer = $this->getViewer();
-    HarbormasterBuild $build,
-    PhabricatorActionListView $actions) {
-    $request = $this->getRequest();
-    $viewer = $request->getUser();
 
     $properties = id(new PHUIPropertyListView())
-      ->setUser($viewer)
+      ->setUser($viewer);
-      ->setObject($build)
-      ->setActionList($actions);
-    $box->addPropertyList($properties);
 
     $handles = id(new PhabricatorHandleQuery())
       ->setViewer($viewer)
@@ -538,6 +537,12 @@ final class HarbormasterBuildViewController
     $properties->addProperty(
       pht('Status'),
       $this->getStatus($build));
+
+    return id(new PHUIObjectBoxView())
+      ->setHeaderText(pht('PROPERTIES'))
+      ->setBackground(PHUIObjectBoxView::BLUE_PROPERTY)
+      ->appendChild($properties);
+
   }
 
   private function getStatus(HarbormasterBuild $build) {

src/applications/harbormaster/controller/HarbormasterBuildableViewController.php

@@ -35,44 +35,44 @@ final class HarbormasterBuildableViewController
     $header = id(new PHUIHeaderView())
       ->setHeader($title)
       ->setUser($viewer)
-      ->setPolicyObject($buildable);
+      ->setPolicyObject($buildable)
-
+      ->setHeaderIcon('fa-recycle');
-    $box = id(new PHUIObjectBoxView())
-      ->setHeader($header);
 
     $timeline = $this->buildTransactionTimeline(
       $buildable,
       new HarbormasterBuildableTransactionQuery());
     $timeline->setShouldTerminate(true);
 
-    $actions = $this->buildActionList($buildable);
+    $curtain = $this->buildCurtainView($buildable);
-    $this->buildPropertyLists($box, $buildable, $actions);
+    $properties = $this->buildPropertyList($buildable);
 
     $crumbs = $this->buildApplicationCrumbs();
     $crumbs->addTextCrumb($buildable->getMonogram());
+    $crumbs->setBorder(true);
 
-    return $this->buildApplicationPage(
+    $view = id(new PHUITwoColumnView())
-      array(
+      ->setHeader($header)
-        $crumbs,
+      ->setCurtain($curtain)
-        $box,
+      ->setMainColumn(array(
+        $properties,
         $lint,
         $unit,
         $build_list,
         $timeline,
-      ),
-      array(
-        'title' => $title,
       ));
+
+    return $this->newPage()
+      ->setTitle($title)
+      ->setCrumbs($crumbs)
+      ->appendChild($view);
+
   }
 
-  private function buildActionList(HarbormasterBuildable $buildable) {
+  private function buildCurtainView(HarbormasterBuildable $buildable) {
-    $request = $this->getRequest();
+    $viewer = $this->getViewer();
-    $viewer = $request->getUser();
     $id = $buildable->getID();
 
-    $list = id(new PhabricatorActionListView())
+    $curtain = $this->newCurtainView($buildable);
-      ->setUser($viewer)
-      ->setObject($buildable);
 
     $can_edit = PhabricatorPolicyFilter::hasCapability(
       $viewer,
@@ -117,7 +117,7 @@ final class HarbormasterBuildableViewController
     $resume_uri = "buildable/{$id}/resume/";
     $abort_uri = "buildable/{$id}/abort/";
 
-    $list->addAction(
+    $curtain->addAction(
       id(new PhabricatorActionView())
         ->setIcon('fa-repeat')
         ->setName(pht('Restart All Builds'))
@@ -125,7 +125,7 @@ final class HarbormasterBuildableViewController
         ->setWorkflow(true)
         ->setDisabled(!$can_restart || !$can_edit));
 
-    $list->addAction(
+    $curtain->addAction(
       id(new PhabricatorActionView())
         ->setIcon('fa-pause')
         ->setName(pht('Pause All Builds'))
@@ -133,7 +133,7 @@ final class HarbormasterBuildableViewController
         ->setWorkflow(true)
         ->setDisabled(!$can_pause || !$can_edit));
 
-    $list->addAction(
+    $curtain->addAction(
       id(new PhabricatorActionView())
         ->setIcon('fa-play')
         ->setName(pht('Resume All Builds'))
@@ -141,7 +141,7 @@ final class HarbormasterBuildableViewController
         ->setWorkflow(true)
         ->setDisabled(!$can_resume || !$can_edit));
 
-    $list->addAction(
+    $curtain->addAction(
       id(new PhabricatorActionView())
         ->setIcon('fa-exclamation-triangle')
         ->setName(pht('Abort All Builds'))
@@ -149,21 +149,14 @@ final class HarbormasterBuildableViewController
         ->setWorkflow(true)
         ->setDisabled(!$can_abort || !$can_edit));
 
-    return $list;
+    return $curtain;
   }
 
-  private function buildPropertyLists(
+  private function buildPropertyList(HarbormasterBuildable $buildable) {
-    PHUIObjectBoxView $box,
+    $viewer = $this->getViewer();
-    HarbormasterBuildable $buildable,
-    PhabricatorActionListView $actions) {
-    $request = $this->getRequest();
-    $viewer = $request->getUser();
 
     $properties = id(new PHUIPropertyListView())
-      ->setUser($viewer)
+      ->setUser($viewer);
-      ->setObject($buildable)
-      ->setActionList($actions);
-    $box->addPropertyList($properties);
 
     $container_phid = $buildable->getContainerPHID();
     $buildable_phid = $buildable->getBuildablePHID();
@@ -184,6 +177,10 @@ final class HarbormasterBuildableViewController
         ? pht('Manual Buildable')
         : pht('Automatic Buildable'));
 
+    return id(new PHUIObjectBoxView())
+      ->setHeaderText(pht('PROPERTIES'))
+      ->setBackground(PHUIObjectBoxView::BLUE_PROPERTY)
+      ->appendChild($properties);
   }
 
   private function buildBuildList(HarbormasterBuildable $buildable) {
@@ -279,6 +276,7 @@ final class HarbormasterBuildableViewController
 
     $box = id(new PHUIObjectBoxView())
       ->setHeaderText(pht('Builds'))
+      ->setBackground(PHUIObjectBoxView::BLUE_PROPERTY)
       ->appendChild($build_list);
 
     return $box;
@@ -330,6 +328,7 @@ final class HarbormasterBuildableViewController
 
       $lint = id(new PHUIObjectBoxView())
         ->setHeader($lint_header)
+        ->setBackground(PHUIObjectBoxView::BLUE_PROPERTY)
         ->setTable($lint_table);
     } else {
       $lint = null;

src/applications/harbormaster/controller/HarbormasterLintMessagesController.php

@@ -45,20 +45,27 @@ final class HarbormasterLintMessagesController
     $crumbs = $this->buildApplicationCrumbs();
     $this->addBuildableCrumb($crumbs, $buildable);
     $crumbs->addTextCrumb(pht('Lint'));
+    $crumbs->setBorder(true);
 
     $title = array(
       $buildable->getMonogram(),
       pht('Lint'),
     );
 
-    return $this->buildApplicationPage(
+    $header = id(new PHUIHeaderView())
-      array(
+      ->setHeader($title);
-        $crumbs,
+
+    $view = id(new PHUITwoColumnView())
+      ->setHeader($header)
+      ->setFooter(array(
         $lint,
-      ),
-      array(
-        'title' => $title,
       ));
+
+    return $this->newPage()
+      ->setTitle($title)
+      ->setCrumbs($crumbs)
+      ->appendChild($view);
+
   }
 
 }

src/applications/harbormaster/controller/HarbormasterPlanViewController.php

@@ -24,50 +24,50 @@ final class HarbormasterPlanViewController extends HarbormasterPlanController {
     $header = id(new PHUIHeaderView())
       ->setHeader($plan->getName())
       ->setUser($viewer)
-      ->setPolicyObject($plan);
+      ->setPolicyObject($plan)
+      ->setHeaderIcon('fa-ship');
 
-    $box = id(new PHUIObjectBoxView())
+    $curtain = $this->buildCurtainView($plan);
-      ->setHeader($header);
-
-    $actions = $this->buildActionList($plan);
-    $this->buildPropertyLists($box, $plan, $actions);
 
     $crumbs = $this->buildApplicationCrumbs();
     $crumbs->addTextCrumb(pht('Plan %d', $id));
+    $crumbs->setBorder(true);
 
     list($step_list, $has_any_conflicts, $would_deadlock) =
       $this->buildStepList($plan);
 
+    $error = null;
     if ($would_deadlock) {
-      $box->setFormErrors(
+      $error = pht('This build plan will deadlock when executed, due to '.
-        array(
-          pht(
-            'This build plan will deadlock when executed, due to '.
                    'circular dependencies present in the build plan. '.
-            'Examine the step list and resolve the deadlock.'),
+                   'Examine the step list and resolve the deadlock.');
-        ));
     } else if ($has_any_conflicts) {
       // A deadlocking build will also cause all the artifacts to be
       // invalid, so we just skip showing this message if that's the
       // case.
-      $box->setFormErrors(
+      $error = pht('This build plan has conflicts in one or more build steps. '.
-        array(
+                   'Examine the step list and resolve the listed errors.');
-          pht(
-            'This build plan has conflicts in one or more build steps. '.
-            'Examine the step list and resolve the listed errors.'),
-        ));
     }
 
-    return $this->buildApplicationPage(
+    if ($error) {
-      array(
+      $error = id(new PHUIInfoView())
-        $crumbs,
+        ->setSeverity(PHUIInfoView::SEVERITY_WARNING)
-        $box,
+        ->appendChild($error);
+    }
+
+    $view = id(new PHUITwoColumnView())
+      ->setHeader($header)
+      ->setCurtain($curtain)
+      ->setMainColumn(array(
+        $error,
         $step_list,
         $timeline,
-      ),
-      array(
-        'title' => $title,
       ));
+
+    return $this->newPage()
+      ->setTitle($title)
+      ->setCrumbs($crumbs)
+      ->appendChild($view);
   }
 
   private function buildStepList(HarbormasterBuildPlan $plan) {
@@ -206,25 +206,24 @@ final class HarbormasterPlanViewController extends HarbormasterPlanController {
 
     $step_box = id(new PHUIObjectBoxView())
       ->setHeader($header)
+      ->setBackground(PHUIObjectBoxView::BLUE_PROPERTY)
       ->appendChild($step_list);
 
     return array($step_box, $has_any_conflicts, $is_deadlocking);
   }
 
-  private function buildActionList(HarbormasterBuildPlan $plan) {
+  private function buildCurtainView(HarbormasterBuildPlan $plan) {
     $viewer = $this->getViewer();
     $id = $plan->getID();
 
-    $list = id(new PhabricatorActionListView())
+    $curtain = $this->newCurtainView($plan);
-      ->setUser($viewer)
-      ->setObject($plan);
 
     $can_edit = PhabricatorPolicyFilter::hasCapability(
       $viewer,
       $plan,
       PhabricatorPolicyCapability::CAN_EDIT);
 
-    $list->addAction(
+    $curtain->addAction(
       id(new PhabricatorActionView())
         ->setName(pht('Edit Plan'))
         ->setHref($this->getApplicationURI("plan/edit/{$id}/"))
@@ -233,7 +232,7 @@ final class HarbormasterPlanViewController extends HarbormasterPlanController {
         ->setIcon('fa-pencil'));
 
     if ($plan->isDisabled()) {
-      $list->addAction(
+      $curtain->addAction(
         id(new PhabricatorActionView())
           ->setName(pht('Enable Plan'))
           ->setHref($this->getApplicationURI("plan/disable/{$id}/"))
@@ -241,7 +240,7 @@ final class HarbormasterPlanViewController extends HarbormasterPlanController {
           ->setDisabled(!$can_edit)
           ->setIcon('fa-check'));
     } else {
-      $list->addAction(
+      $curtain->addAction(
         id(new PhabricatorActionView())
           ->setName(pht('Disable Plan'))
           ->setHref($this->getApplicationURI("plan/disable/{$id}/"))
@@ -252,7 +251,7 @@ final class HarbormasterPlanViewController extends HarbormasterPlanController {
 
     $can_run = ($can_edit && $plan->canRunManually());
 
-    $list->addAction(
+    $curtain->addAction(
       id(new PhabricatorActionView())
         ->setName(pht('Run Plan Manually'))
         ->setHref($this->getApplicationURI("plan/run/{$id}/"))
@@ -260,26 +259,12 @@ final class HarbormasterPlanViewController extends HarbormasterPlanController {
         ->setDisabled(!$can_run)
         ->setIcon('fa-play-circle'));
 
-    return $list;
+    $curtain->addPanel(
-  }
+      id(new PHUICurtainPanelView())
-
+        ->setHeaderText(pht('Created'))
-  private function buildPropertyLists(
+        ->appendChild(phabricator_datetime($plan->getDateCreated(), $viewer)));
-    PHUIObjectBoxView $box,
-    HarbormasterBuildPlan $plan,
-    PhabricatorActionListView $actions) {
-    $request = $this->getRequest();
-    $viewer = $request->getUser();
-
-    $properties = id(new PHUIPropertyListView())
-      ->setUser($viewer)
-      ->setObject($plan)
-      ->setActionList($actions);
-    $box->addPropertyList($properties);
-
-    $properties->addProperty(
-      pht('Created'),
-      phabricator_datetime($plan->getDateCreated(), $viewer));
 
+    return $curtain;
   }
 
   private function buildArtifactList(

src/applications/harbormaster/controller/HarbormasterStepAddController.php

@@ -40,15 +40,13 @@ final class HarbormasterStepAddController
     }
 
     $groups = mgroup($all, 'getBuildStepGroupKey');
-    $lists = array();
+    $boxes = array();
 
     $enabled_groups = HarbormasterBuildStepGroup::getAllEnabledGroups();
     foreach ($enabled_groups as $group) {
       $list = id(new PHUIObjectItemListView())
-        ->setHeader($group->getGroupName())
         ->setNoDataString(
-          pht(
+          pht('This group has no available build steps.'));
-            'This group has no available build steps.'));
 
       $steps = idx($groups, $group->getGroupKey(), array());
 
@@ -76,28 +74,36 @@ final class HarbormasterStepAddController
         $list->addItem($item);
       }
 
-      $lists[] = $list;
+      $box = id(new PHUIObjectBoxView())
+        ->setHeaderText($group->getGroupName())
+        ->setBackground(PHUIObjectBoxView::BLUE_PROPERTY)
+        ->appendChild($list);
+
+      $boxes[] = $box;
     }
 
     $crumbs = $this->buildApplicationCrumbs()
       ->addTextCrumb($plan_title, $cancel_uri)
-      ->addTextCrumb(pht('Add Build Step'));
+      ->addTextCrumb(pht('Add Build Step'))
+      ->setBorder(true);
 
-    $box = id(new PHUIObjectBoxView())
+    $title = array($plan_title, pht('Add Build Step'));
-      ->setHeaderText(pht('Add Build Step'))
-      ->appendChild($lists);
 
-    return $this->buildApplicationPage(
+    $header = id(new PHUIHeaderView())
-      array(
+      ->setHeader(pht('Add Build Step'))
-        $crumbs,
+      ->setHeaderIcon('fa-plus-square');
-        $box,
+
-      ),
+    $view = id(new PHUITwoColumnView())
-      array(
+      ->setHeader($header)
-        'title' => array(
+      ->setFooter(array(
-          $plan_title,
+        $boxes,
-          pht('Add Build Step'),
-        ),
       ));
+
+    return $this->newPage()
+      ->setTitle($title)
+      ->setCrumbs($crumbs)
+      ->appendChild($view);
+
   }
 
 }

src/applications/harbormaster/controller/HarbormasterStepEditController.php

@@ -184,14 +184,19 @@ final class HarbormasterStepEditController
 
     if ($is_new) {
       $submit = pht('Create Build Step');
-      $header = pht('New Step: %s', $implementation->getName());
+      $header = id(new PHUIHeaderView())
+        ->setHeader(pht('New Step: %s', $implementation->getName()))
+        ->setHeaderIcon('fa-plus-square');
       $crumbs->addTextCrumb(pht('Add Step'));
     } else {
       $submit = pht('Save Build Step');
-      $header = pht('Edit Step: %s', $implementation->getName());
+      $header = id(new PHUIHeaderView())
+        ->setHeader(pht('Edit Step: %s', $implementation->getName()))
+        ->setHeaderIcon('fa-pencil');
       $crumbs->addTextCrumb(pht('Step %d', $step->getID()), $cancel_uri);
       $crumbs->addTextCrumb(pht('Edit Step'));
     }
+    $crumbs->setBorder(true);
 
     $form->appendChild(
       id(new AphrontFormSubmitControl())
@@ -199,8 +204,9 @@ final class HarbormasterStepEditController
         ->addCancelButton($cancel_uri));
 
     $box = id(new PHUIObjectBoxView())
-      ->setHeaderText($header)
+      ->setHeaderText(pht('Step'))
       ->setValidationException($validation_exception)
+      ->setBackground(PHUIObjectBoxView::BLUE_PROPERTY)
       ->setForm($form);
 
     $variables = $this->renderBuildVariablesTable();
@@ -215,16 +221,19 @@ final class HarbormasterStepEditController
       $timeline->setShouldTerminate(true);
     }
 
-    return $this->buildApplicationPage(
+    $view = id(new PHUITwoColumnView())
-      array(
+      ->setHeader($header)
-        $crumbs,
+      ->setFooter(array(
         $box,
         $variables,
         $timeline,
-      ),
-      array(
-        'title' => $implementation->getName(),
       ));
+
+    return $this->newPage()
+      ->setTitle($implementation->getName())
+      ->setCrumbs($crumbs)
+      ->appendChild($view);
+
   }
 
   private function renderBuildVariablesTable() {
@@ -254,6 +263,7 @@ final class HarbormasterStepEditController
 
     return id(new PHUIObjectBoxView())
       ->setHeaderText(pht('Build Variables'))
+      ->setBackground(PHUIObjectBoxView::BLUE_PROPERTY)
       ->appendChild($form);
   }
 

src/applications/harbormaster/controller/HarbormasterStepViewController.php

@@ -29,30 +29,33 @@ final class HarbormasterStepViewController
     $crumbs = $this->buildApplicationCrumbs();
     $crumbs->addTextCrumb(pht('Plan %d', $plan_id), $plan_uri);
     $crumbs->addTextCrumb(pht('Step %d', $id));
+    $crumbs->setBorder(true);
 
-    $box = id(new PHUIObjectBoxView())
+    $header = id(new PHUIHeaderView())
-      ->setHeaderText(pht('Build Step %d: %s', $id, $step->getName()));
+      ->setHeader(pht('Build Step %d: %s', $id, $step->getName()))
+      ->setHeaderIcon('fa-chevron-circle-right');
 
     $properties = $this->buildPropertyList($step, $field_list);
-    $actions = $this->buildActionList($step);
+    $curtain = $this->buildCurtainView($step);
-    $properties->setActionList($actions);
-
-    $box->addPropertyList($properties);
 
     $timeline = $this->buildTransactionTimeline(
       $step,
       new HarbormasterBuildStepTransactionQuery());
     $timeline->setShouldTerminate(true);
 
-    return $this->buildApplicationPage(
+    $view = id(new PHUITwoColumnView())
-      array(
+      ->setHeader($header)
-        $crumbs,
+      ->setCurtain($curtain)
-        $box,
+      ->setMainColumn(array(
+        $properties,
         $timeline,
-      ),
-      array(
-        'title' => pht('Step %d', $id),
       ));
+
+    return $this->newPage()
+      ->setTitle(pht('Step %d', $id))
+      ->setCrumbs($crumbs)
+      ->appendChild($view);
+
   }
 
   private function buildPropertyList(
@@ -61,8 +64,7 @@ final class HarbormasterStepViewController
     $viewer = $this->getViewer();
 
     $view = id(new PHUIPropertyListView())
-      ->setUser($viewer)
+      ->setUser($viewer);
-      ->setObject($step);
 
     try {
       $implementation = $step->getStepImplementation();
@@ -92,8 +94,6 @@ final class HarbormasterStepViewController
       $viewer,
       $view);
 
-    $view->invokeWillRenderEvent();
-
     $description = $step->getDescription();
     if (strlen($description)) {
       $view->addSectionHeader(
@@ -103,24 +103,25 @@ final class HarbormasterStepViewController
         new PHUIRemarkupView($viewer, $description));
     }
 
-    return $view;
+    return id(new PHUIObjectBoxView())
+      ->setHeaderText(pht('PROPERTIES'))
+      ->setBackground(PHUIObjectBoxView::BLUE_PROPERTY)
+      ->appendChild($view);
   }
 
 
-  private function buildActionList(HarbormasterBuildStep $step) {
+  private function buildCurtainView(HarbormasterBuildStep $step) {
     $viewer = $this->getViewer();
     $id = $step->getID();
 
-    $list = id(new PhabricatorActionListView())
+    $curtain = $this->newCurtainView($step);
-      ->setUser($viewer)
-      ->setObject($step);
 
     $can_edit = PhabricatorPolicyFilter::hasCapability(
       $viewer,
       $step,
       PhabricatorPolicyCapability::CAN_EDIT);
 
-    $list->addAction(
+    $curtain->addAction(
       id(new PhabricatorActionView())
         ->setName(pht('Edit Step'))
         ->setHref($this->getApplicationURI("step/edit/{$id}/"))
@@ -128,7 +129,7 @@ final class HarbormasterStepViewController
         ->setDisabled(!$can_edit)
         ->setIcon('fa-pencil'));
 
-    $list->addAction(
+    $curtain->addAction(
       id(new PhabricatorActionView())
         ->setName(pht('Delete Step'))
         ->setHref($this->getApplicationURI("step/delete/{$id}/"))
@@ -136,7 +137,7 @@ final class HarbormasterStepViewController
         ->setDisabled(!$can_edit)
         ->setIcon('fa-times'));
 
-    return $list;
+    return $curtain;
   }
 
 

src/applications/harbormaster/controller/HarbormasterUnitMessageListController.php

@@ -41,20 +41,27 @@ final class HarbormasterUnitMessageListController
     $crumbs = $this->buildApplicationCrumbs();
     $this->addBuildableCrumb($crumbs, $buildable);
     $crumbs->addTextCrumb(pht('Unit Tests'));
+    $crumbs->setBorder(true);
 
     $title = array(
       $buildable->getMonogram(),
       pht('Unit Tests'),
     );
 
-    return $this->buildApplicationPage(
+    $header = id(new PHUIHeaderView())
-      array(
+      ->setHeader($buildable->getMonogram().' '.pht('Unit Tests'));
-        $crumbs,
+
+    $view = id(new PHUITwoColumnView())
+      ->setHeader($header)
+      ->setFooter(array(
         $unit,
-      ),
-      array(
-        'title' => $title,
       ));
+
+    return $this->newPage()
+      ->setTitle($title)
+      ->setCrumbs($crumbs)
+      ->appendChild($view);
+
   }
 
 }

src/applications/harbormaster/controller/HarbormasterUnitMessageViewController.php

@@ -38,9 +38,7 @@ final class HarbormasterUnitMessageViewController
       ->setStatus($status_icon, $status_color, $status_label);
 
     $properties = $this->buildPropertyListView($message);
-    $actions = $this->buildActionView($message, $build);
+    $curtain = $this->buildCurtainView($message, $build);
-
-    $properties->setActionList($actions);
 
     $unit = id(new PHUIObjectBoxView())
       ->setHeader($header)
@@ -54,22 +52,29 @@ final class HarbormasterUnitMessageViewController
       "/harbormaster/unit/{$buildable_id}/");
 
     $crumbs->addTextCrumb(pht('Unit %d', $id));
+    $crumbs->setBorder(true);
 
     $title = array(
       $display_name,
       $buildable->getMonogram(),
     );
 
+    $view = id(new PHUITwoColumnView())
+      ->setHeader($header)
+      ->setCurtain($curtain)
+      ->setMainColumn(array(
+        $unit,
+      ));
+
     return $this->newPage()
       ->setTitle($title)
       ->setCrumbs($crumbs)
-      ->appendChild($unit);
+      ->appendChild($view);
   }
 
   private function buildPropertyListView(
     HarbormasterBuildUnitMessage $message) {
-    $request = $this->getRequest();
+    $viewer = $this->getViewer();
-    $viewer = $request->getUser();
 
     $view = id(new PHUIPropertyListView())
       ->setUser($viewer);
@@ -81,6 +86,7 @@ final class HarbormasterUnitMessageViewController
     $details = $message->getUnitMessageDetails();
     if (strlen($details)) {
       // TODO: Use the log view here, once it gets cleaned up.
+      // Shenanigans below.
       $details = phutil_tag(
         'div',
         array(
@@ -100,23 +106,24 @@ final class HarbormasterUnitMessageViewController
       PHUIPropertyListView::ICON_TESTPLAN);
     $view->addTextContent($details);
 
-    return $view;
+    return id(new PHUIObjectBoxView())
+      ->setHeaderText(pht('PROPERTIES'))
+      ->appendChild($view);
   }
 
-  private function buildActionView(
+  private function buildCurtainView(
     HarbormasterBuildUnitMessage $message,
     HarbormasterBuild $build) {
     $viewer = $this->getViewer();
 
-    $view = id(new PhabricatorActionListView())
+    $curtain = $this->newCurtainView($build);
-      ->setUser($viewer);
 
-    $view->addAction(
+    $curtain->addAction(
       id(new PhabricatorActionView())
         ->setName(pht('View Build'))
         ->setHref($build->getURI())
         ->setIcon('fa-wrench'));
 
-    return $view;
+    return $curtain;
   }
 }

src/applications/harbormaster/view/HarbormasterUnitSummaryView.php

@@ -7,7 +7,6 @@ final class HarbormasterUnitSummaryView extends AphrontView {
   private $limit;
   private $excuse;
   private $showViewAll;
-  private $background;
 
   public function setBuildable(HarbormasterBuildable $buildable) {
     $this->buildable = $buildable;
@@ -34,11 +33,6 @@ final class HarbormasterUnitSummaryView extends AphrontView {
     return $this;
   }
 
-  public function setBackground($background) {
-    $this->background = $background;
-    return $this;
-  }
-
   public function render() {
     $messages = $this->messages;
     $buildable = $this->buildable;
@@ -79,7 +73,8 @@ final class HarbormasterUnitSummaryView extends AphrontView {
     }
 
     $box = id(new PHUIObjectBoxView())
-      ->setHeader($header);
+      ->setHeader($header)
+      ->setBackground(PHUIObjectBoxView::BLUE_PROPERTY);
 
     $table = id(new HarbormasterUnitPropertyView())
       ->setUnitMessages($messages);
@@ -109,10 +104,6 @@ final class HarbormasterUnitSummaryView extends AphrontView {
 
     $box->setTable($table);
 
-    if ($this->background) {
-      $box->setBackground($this->background);
-    }
-
     return $box;
   }
 

webroot/rsrc/css/phui/phui-timeline-view.css

@@ -46,7 +46,7 @@
   width: 9px;
   height: 9px;
   border-radius: 2px;
-  margin-left: 74px;
+  margin-left: 76px;
 }
 
 .device-desktop .phui-timeline-wedge {