Diviner CSS, layout updates

Summary: Moves book view to use PHUIDocument, fix some other spacing issues.

Test Plan: Review a number of pages in Diviner.

Reviewers: epriestley

Reviewed By: epriestley

CC: Korvin, aran

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

src/__celerity_resource_map__.php

@@ -1149,7 +1149,7 @@ celerity_register_resource_map(array(
   ),
   'diviner-shared-css' =>
   array(
-    'uri' => '/res/bcc425bb/rsrc/css/diviner/diviner-shared.css',
+    'uri' => '/res/7c3cca5f/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/83d195c2/rsrc/css/layout/phabricator-header-view.css',
+    'uri' => '/res/8b2bcc29/rsrc/css/layout/phabricator-header-view.css',
     'type' => 'css',
     'requires' =>
     array(
@@ -4171,7 +4171,7 @@ celerity_register_resource_map(array(
 ), array(
   'packages' =>
   array(
-    'f3475e6e' =>
+    '6d1ec88f' =>
     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/f3475e6e/core.pkg.css',
+      'uri' => '/res/pkg/6d1ec88f/core.pkg.css',
       'type' => 'css',
     ),
     '8977e356' =>
@@ -4409,15 +4409,15 @@ celerity_register_resource_map(array(
   ),
   'reverse' =>
   array(
-    'aphront-dialog-view-css' => 'f3475e6e',
-    'aphront-error-view-css' => 'f3475e6e',
-    'aphront-list-filter-view-css' => 'f3475e6e',
-    'aphront-pager-view-css' => 'f3475e6e',
-    'aphront-panel-view-css' => 'f3475e6e',
-    'aphront-table-view-css' => 'f3475e6e',
-    'aphront-tokenizer-control-css' => 'f3475e6e',
-    'aphront-tooltip-css' => 'f3475e6e',
-    'aphront-typeahead-control-css' => 'f3475e6e',
+    'aphront-dialog-view-css' => '6d1ec88f',
+    'aphront-error-view-css' => '6d1ec88f',
+    'aphront-list-filter-view-css' => '6d1ec88f',
+    'aphront-pager-view-css' => '6d1ec88f',
+    'aphront-panel-view-css' => '6d1ec88f',
+    'aphront-table-view-css' => '6d1ec88f',
+    'aphront-tokenizer-control-css' => '6d1ec88f',
+    'aphront-tooltip-css' => '6d1ec88f',
+    'aphront-typeahead-control-css' => '6d1ec88f',
     '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' => 'f3475e6e',
+    'global-drag-and-drop-css' => '6d1ec88f',
     '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' => 'f3475e6e',
+    'lightbox-attachment-css' => '6d1ec88f',
     'maniphest-task-summary-css' => '0a9e494f',
     'maniphest-transaction-detail-css' => '0a9e494f',
-    'phabricator-action-list-view-css' => 'f3475e6e',
-    'phabricator-application-launch-view-css' => 'f3475e6e',
+    'phabricator-action-list-view-css' => '6d1ec88f',
+    'phabricator-application-launch-view-css' => '6d1ec88f',
     'phabricator-busy' => '8977e356',
     'phabricator-content-source-view-css' => '44bfe40c',
-    'phabricator-core-css' => 'f3475e6e',
-    'phabricator-crumbs-view-css' => 'f3475e6e',
+    'phabricator-core-css' => '6d1ec88f',
+    'phabricator-crumbs-view-css' => '6d1ec88f',
     'phabricator-drag-and-drop-file-upload' => 'd07a3bc2',
     'phabricator-dropdown-menu' => '8977e356',
     'phabricator-file-upload' => '8977e356',
-    'phabricator-filetree-view-css' => 'f3475e6e',
-    'phabricator-flag-css' => 'f3475e6e',
-    'phabricator-header-view-css' => 'f3475e6e',
+    'phabricator-filetree-view-css' => '6d1ec88f',
+    'phabricator-flag-css' => '6d1ec88f',
+    'phabricator-header-view-css' => '6d1ec88f',
     'phabricator-hovercard' => '8977e356',
-    'phabricator-jump-nav' => 'f3475e6e',
+    'phabricator-jump-nav' => '6d1ec88f',
     'phabricator-keyboard-shortcut' => '8977e356',
     'phabricator-keyboard-shortcut-manager' => '8977e356',
-    'phabricator-main-menu-view' => 'f3475e6e',
+    'phabricator-main-menu-view' => '6d1ec88f',
     'phabricator-menu-item' => '8977e356',
-    'phabricator-nav-view-css' => 'f3475e6e',
+    'phabricator-nav-view-css' => '6d1ec88f',
     'phabricator-notification' => '8977e356',
-    'phabricator-notification-css' => 'f3475e6e',
-    'phabricator-notification-menu-css' => 'f3475e6e',
+    'phabricator-notification-css' => '6d1ec88f',
+    'phabricator-notification-menu-css' => '6d1ec88f',
     'phabricator-object-selector-css' => '44bfe40c',
     'phabricator-phtize' => '8977e356',
     'phabricator-prefab' => '8977e356',
     'phabricator-project-tag-css' => '0a9e494f',
-    'phabricator-property-list-view-css' => 'f3475e6e',
-    'phabricator-remarkup-css' => 'f3475e6e',
+    'phabricator-property-list-view-css' => '6d1ec88f',
+    'phabricator-remarkup-css' => '6d1ec88f',
     'phabricator-shaped-request' => 'd07a3bc2',
-    'phabricator-side-menu-view-css' => 'f3475e6e',
-    'phabricator-standard-page-view' => 'f3475e6e',
-    'phabricator-tag-view-css' => 'f3475e6e',
+    'phabricator-side-menu-view-css' => '6d1ec88f',
+    'phabricator-standard-page-view' => '6d1ec88f',
+    'phabricator-tag-view-css' => '6d1ec88f',
     'phabricator-textareautils' => '8977e356',
     'phabricator-tooltip' => '8977e356',
-    'phabricator-transaction-view-css' => 'f3475e6e',
-    'phabricator-zindex-css' => 'f3475e6e',
-    'phui-button-css' => 'f3475e6e',
-    'phui-form-css' => 'f3475e6e',
-    'phui-form-view-css' => 'f3475e6e',
-    'phui-icon-view-css' => 'f3475e6e',
-    'phui-object-item-list-view-css' => 'f3475e6e',
-    'phui-spacing-css' => 'f3475e6e',
-    'sprite-apps-large-css' => 'f3475e6e',
-    'sprite-gradient-css' => 'f3475e6e',
-    'sprite-icons-css' => 'f3475e6e',
-    'sprite-menu-css' => 'f3475e6e',
-    'syntax-highlighting-css' => 'f3475e6e',
+    'phabricator-transaction-view-css' => '6d1ec88f',
+    'phabricator-zindex-css' => '6d1ec88f',
+    'phui-button-css' => '6d1ec88f',
+    'phui-form-css' => '6d1ec88f',
+    'phui-form-view-css' => '6d1ec88f',
+    'phui-icon-view-css' => '6d1ec88f',
+    'phui-object-item-list-view-css' => '6d1ec88f',
+    'phui-spacing-css' => '6d1ec88f',
+    'sprite-apps-large-css' => '6d1ec88f',
+    'sprite-gradient-css' => '6d1ec88f',
+    'sprite-icons-css' => '6d1ec88f',
+    'sprite-menu-css' => '6d1ec88f',
+    'syntax-highlighting-css' => '6d1ec88f',
   ),
 ));

src/applications/diviner/application/PhabricatorApplicationDiviner.php

@@ -11,7 +11,7 @@ final class PhabricatorApplicationDiviner extends PhabricatorApplication {
   }
 
   public function getShortDescription() {
-    return 'Documentation';
+    return pht('Documentation');
   }
 
   public function getTitleGlyph() {

src/applications/diviner/controller/DivinerBookController.php

@@ -33,6 +33,9 @@ final class DivinerBookController extends DivinerController {
         ->setHref('/book/'.$book->getName().'/'));
 
     $header = id(new PhabricatorHeaderView())->setHeader($book->getTitle());
+    $document = new PHUIDocumentView();
+    $document->setHeader($header);
+
     $properties = $this->buildPropertyList($book);
 
     $atoms = id(new DivinerAtomQuery())
@@ -57,18 +60,18 @@ final class DivinerBookController extends DivinerController {
     $out = array();
     foreach ($groups as $group => $atoms) {
       $group_name = $book->getGroupName($group);
-
-      $out[] = id(new PhabricatorHeaderView())
+      $section = id(new DivinerSectionView())
           ->setHeader($group_name);
-      $out[] = $this->renderAtomList($atoms);
+      $section->addContent($this->renderAtomList($atoms));
+      $out[] = $section;
     }
+    $document->appendChild($properties);
+    $document->appendChild($out);
 
     return $this->buildApplicationPage(
       array(
         $crumbs,
-        $header,
-        $properties,
-        $out,
+        $document,
       ),
       array(
         'title' => $book->getTitle(),

src/applications/diviner/controller/DivinerController.php

@@ -28,7 +28,9 @@ abstract class DivinerController extends PhabricatorController {
     $user = $request->getUser();
 
     $list = id(new PHUIObjectItemListView())
-      ->setUser($user);
+      ->setUser($user)
+      ->setPlain(true)
+      ->setFlush(true);
 
     foreach ($symbols as $symbol) {
       $item = id(new PHUIObjectItemView())

src/view/phui/PHUIObjectItemListView.php

@@ -68,10 +68,7 @@ final class PHUIObjectItemListView extends AphrontTagView {
     if ($this->flush) {
       $classes[] = 'phui-object-list-flush';
     }
-    // If plain, drop all styles
     if ($this->plain) {
-      $classes = array();
-      $classes[] = 'phui-object-item-list-view';
       $classes[] = 'phui-object-list-plain';
     }
 

webroot/rsrc/css/diviner/diviner-shared.css

@@ -65,6 +65,10 @@
   padding: 0 8px 16px 0;
 }
 
+body .diviner-document-section .phabricator-header-view {
+  width: 100%;
+}
+
 .diviner-message-not-documented {
   color: {$lightgreytext};
   font-style: italic;
@@ -108,3 +112,8 @@
   padding-top: 0;
 }
 
+.diviner-list li {
+  line-height: 18px;
+  padding-bottom: 4px;
+}
+

webroot/rsrc/css/layout/phabricator-header-view.css

@@ -26,13 +26,17 @@ body .phabricator-header-shell.phabricator-bleed-header {
 body .phabricator-header-shell.phabricator-bleed-header
   .phabricator-header-view {
   padding: 8px 24px 8px 16px;
-  font-size: 18px;
+  color: {$bluetext};
 }
 
 .phabricator-header-shell + .phabricator-form-view {
   border-top-width: 0;
 }
 
+.phabricator-property-list-view + .diviner-document-section {
+  margin-top: -1px;
+}
+
 .phabricator-header-view {
   padding: 16px;
   font-size: 15px;