Clean up more Quicksand

Summary: Creates a background that renders inside the Quicksand frame, through sorcery.

Test Plan: Turn on Quicksand, visit lots of pages. See correct background colors. This probably blows something up I'm not testing.

Reviewers: epriestley

Reviewed By: epriestley

Subscribers: Korvin

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

resources/celerity/map.php

@@ -9,7 +9,7 @@ return array(
   'names' => array(
     'conpherence.pkg.css' => 'b1547973',
     'conpherence.pkg.js' => '11f3e07e',
-    'core.pkg.css' => 'cfc3eabe',
+    'core.pkg.css' => 'ade19c40',
     'core.pkg.js' => '975d6a27',
     'darkconsole.pkg.js' => 'e7393ebb',
     'differential.pkg.css' => 'e1d704ce',
@@ -38,7 +38,7 @@ return array(
     'rsrc/css/application/base/notification-menu.css' => 'b3ab500d',
     'rsrc/css/application/base/phabricator-application-launch-view.css' => '95351601',
     'rsrc/css/application/base/phui-theme.css' => '027ba77e',
-    'rsrc/css/application/base/standard-page-view.css' => '79176f5a',
+    'rsrc/css/application/base/standard-page-view.css' => 'e5d90676',
     'rsrc/css/application/chatlog/chatlog.css' => 'd295b020',
     'rsrc/css/application/conduit/conduit-api.css' => '7bc725c4',
     'rsrc/css/application/config/config-options.css' => '0ede4c9b',
@@ -102,12 +102,12 @@ return array(
     'rsrc/css/application/releeph/releeph-preview-branch.css' => 'b7a6f4a5',
     'rsrc/css/application/releeph/releeph-request-differential-create-dialog.css' => '8d8b92cd',
     'rsrc/css/application/releeph/releeph-request-typeahead.css' => '667a48ae',
-    'rsrc/css/application/search/application-search-view.css' => 'be6454ec',
+    'rsrc/css/application/search/application-search-view.css' => '9c9bc8dc',
     'rsrc/css/application/search/search-results.css' => '7dea472c',
     'rsrc/css/application/slowvote/slowvote.css' => 'a94b7230',
     'rsrc/css/application/tokens/tokens.css' => '3d0f239e',
     'rsrc/css/application/uiexample/example.css' => '528b19de',
-    'rsrc/css/core/core.css' => 'd0801452',
+    'rsrc/css/core/core.css' => '4f5111ea',
     'rsrc/css/core/remarkup.css' => 'cd912f2c',
     'rsrc/css/core/syntax.css' => '769d3498',
     'rsrc/css/core/z-index.css' => '0d4e5558',
@@ -125,7 +125,7 @@ return array(
     'rsrc/css/phui/phui-action-list.css' => 'c5eba19d',
     'rsrc/css/phui/phui-action-panel.css' => '91c7b835',
     'rsrc/css/phui/phui-badge.css' => '3baef8db',
-    'rsrc/css/phui/phui-basic-nav-view.css' => '7093573b',
+    'rsrc/css/phui/phui-basic-nav-view.css' => 'c377093a',
     'rsrc/css/phui/phui-big-info-view.css' => 'bd903741',
     'rsrc/css/phui/phui-box.css' => '5c8387cf',
     'rsrc/css/phui/phui-button.css' => '4a5fbe3d',
@@ -163,8 +163,8 @@ return array(
     'rsrc/css/phui/phui-tag-view.css' => '6bbd83e2',
     'rsrc/css/phui/phui-timeline-view.css' => 'bc523970',
     'rsrc/css/phui/phui-two-column-view.css' => 'fcfbe347',
-    'rsrc/css/phui/workboards/phui-workboard-color.css' => 'ac6fe6a7',
+    'rsrc/css/phui/workboards/phui-workboard-color.css' => '6da20b15',
-    'rsrc/css/phui/workboards/phui-workboard.css' => 'e09eb53a',
+    'rsrc/css/phui/workboards/phui-workboard.css' => 'fe70ad9c',
     'rsrc/css/phui/workboards/phui-workcard.css' => '0c62d7c5',
     'rsrc/css/phui/workboards/phui-workpanel.css' => '92197373',
     'rsrc/css/sprite-login.css' => '6dbbbd97',
@@ -611,7 +611,7 @@ return array(
     'aphront-tokenizer-control-css' => '056da01b',
     'aphront-tooltip-css' => '1a07aea8',
     'aphront-typeahead-control-css' => 'd4f16145',
-    'application-search-view-css' => 'be6454ec',
+    'application-search-view-css' => '9c9bc8dc',
     'auth-css' => '0877ed6e',
     'bulk-job-css' => 'df9c1d4a',
     'changeset-view-manager' => 'a2828756',
@@ -844,7 +844,7 @@ return array(
     'phabricator-busy' => '59a7976a',
     'phabricator-chatlog-css' => 'd295b020',
     'phabricator-content-source-view-css' => '4b8b05d4',
-    'phabricator-core-css' => 'd0801452',
+    'phabricator-core-css' => '4f5111ea',
     'phabricator-countdown-css' => '16c52f5c',
     'phabricator-dashboard-css' => 'bc6f2127',
     'phabricator-drag-and-drop-file-upload' => '58dea2fa',
@@ -869,7 +869,7 @@ return array(
     'phabricator-shaped-request' => '7cbe244b',
     'phabricator-slowvote-css' => 'a94b7230',
     'phabricator-source-code-view-css' => 'cbeef983',
-    'phabricator-standard-page-view' => '79176f5a',
+    'phabricator-standard-page-view' => 'e5d90676',
     'phabricator-textareautils' => '320810c8',
     'phabricator-title' => 'df5e11d2',
     'phabricator-tooltip' => '6323f942',
@@ -896,7 +896,7 @@ return array(
     'phriction-document-css' => '4282e4ad',
     'phui-action-panel-css' => '91c7b835',
     'phui-badge-view-css' => '3baef8db',
-    'phui-basic-nav-view-css' => '7093573b',
+    'phui-basic-nav-view-css' => 'c377093a',
     'phui-big-info-view-css' => 'bd903741',
     'phui-box-css' => '5c8387cf',
     'phui-button-css' => '4a5fbe3d',
@@ -942,8 +942,8 @@ return array(
     'phui-theme-css' => '027ba77e',
     'phui-timeline-view-css' => 'bc523970',
     'phui-two-column-view-css' => 'fcfbe347',
-    'phui-workboard-color-css' => 'ac6fe6a7',
+    'phui-workboard-color-css' => '6da20b15',
-    'phui-workboard-view-css' => 'e09eb53a',
+    'phui-workboard-view-css' => 'fe70ad9c',
     'phui-workcard-view-css' => '0c62d7c5',
     'phui-workpanel-view-css' => '92197373',
     'phuix-action-list-view' => 'b5c256b8',

src/applications/config/controller/PhabricatorConfigAllController.php

@@ -71,7 +71,7 @@ final class PhabricatorConfigAllController
       ->setCrumbs($crumbs)
       ->setNavigation($nav)
       ->appendChild($content)
-      ->addClass('white-background');
+      ->addFrameClass('white-background');
 
   }
 

src/applications/config/controller/PhabricatorConfigApplicationController.php

@@ -32,7 +32,7 @@ final class PhabricatorConfigApplicationController
       ->setCrumbs($crumbs)
       ->setNavigation($nav)
       ->appendChild($content)
-      ->addClass('white-background');
+      ->addFrameClass('white-background');
   }
 
   private function buildConfigOptionsList(array $groups, $type) {

src/applications/config/controller/PhabricatorConfigCacheController.php

@@ -37,7 +37,7 @@ final class PhabricatorConfigCacheController
       ->setCrumbs($crumbs)
       ->setNavigation($nav)
       ->appendChild($content)
-      ->addClass('white-background');
+      ->addFrameClass('white-background');
   }
 
   private function renderCodeBox() {

src/applications/config/controller/PhabricatorConfigClusterDatabasesController.php

@@ -36,7 +36,7 @@ final class PhabricatorConfigClusterDatabasesController
       ->setCrumbs($crumbs)
       ->setNavigation($nav)
       ->appendChild($content)
-      ->addClass('white-background');
+      ->addFrameClass('white-background');
   }
 
   private function buildClusterDatabaseStatus() {

src/applications/config/controller/PhabricatorConfigClusterNotificationsController.php

@@ -36,7 +36,7 @@ final class PhabricatorConfigClusterNotificationsController
       ->setCrumbs($crumbs)
       ->setNavigation($nav)
       ->appendChild($content)
-      ->addClass('white-background');
+      ->addFrameClass('white-background');
   }
 
   private function buildClusterNotificationStatus() {

src/applications/config/controller/PhabricatorConfigClusterRepositoriesController.php

@@ -42,7 +42,7 @@ final class PhabricatorConfigClusterRepositoriesController
       ->setCrumbs($crumbs)
       ->setNavigation($nav)
       ->appendChild($content)
-      ->addClass('white-background');
+      ->addFrameClass('white-background');
   }
 
   private function buildClusterRepositoryStatus() {

src/applications/config/controller/PhabricatorConfigDatabaseIssueController.php

@@ -165,7 +165,7 @@ final class PhabricatorConfigDatabaseIssueController
       ->setCrumbs($crumbs)
       ->setNavigation($nav)
       ->appendChild($content)
-      ->addClass('white-background');
+      ->addFrameClass('white-background');
   }
 
 }

src/applications/config/controller/PhabricatorConfigDatabaseStatusController.php

@@ -117,7 +117,7 @@ final class PhabricatorConfigDatabaseStatusController
       ->setCrumbs($crumbs)
       ->setNavigation($nav)
       ->appendChild($content)
-      ->addClass('white-background');
+      ->addFrameClass('white-background');
   }
 
 

src/applications/config/controller/PhabricatorConfigGroupController.php

@@ -43,7 +43,7 @@ final class PhabricatorConfigGroupController
       ->setCrumbs($crumbs)
       ->setNavigation($nav)
       ->appendChild($content)
-      ->addClass('white-background');
+      ->addFrameClass('white-background');
   }
 
   private function buildOptionList(array $options) {

src/applications/config/controller/PhabricatorConfigHistoryController.php

@@ -50,7 +50,7 @@ final class PhabricatorConfigHistoryController
       ->setCrumbs($crumbs)
       ->setNavigation($nav)
       ->appendChild($content)
-      ->addClass('white-background');
+      ->addFrameClass('white-background');
   }
 
 }

src/applications/config/controller/PhabricatorConfigIssueListController.php

@@ -68,7 +68,7 @@ final class PhabricatorConfigIssueListController
       ->setCrumbs($crumbs)
       ->setNavigation($nav)
       ->appendChild($content)
-      ->addClass('white-background');
+      ->addFrameClass('white-background');
   }
 
   private function buildIssueList(array $issues, $group, $fonticon) {

src/applications/config/controller/PhabricatorConfigIssueViewController.php

@@ -46,7 +46,7 @@ final class PhabricatorConfigIssueViewController
       ->setCrumbs($crumbs)
       ->setNavigation($nav)
       ->appendChild($content)
-      ->addClass('white-background');
+      ->addFrameClass('white-background');
   }
 
   private function renderIssue(PhabricatorSetupIssue $issue) {

src/applications/config/controller/PhabricatorConfigListController.php

@@ -32,7 +32,7 @@ final class PhabricatorConfigListController
       ->setCrumbs($crumbs)
       ->setNavigation($nav)
       ->appendChild($content)
-      ->addClass('white-background');
+      ->addFrameClass('white-background');
   }
 
   private function buildConfigOptionsList(array $groups, $type) {

src/applications/config/controller/PhabricatorConfigModuleController.php

@@ -36,7 +36,7 @@ final class PhabricatorConfigModuleController
       ->setCrumbs($crumbs)
       ->setNavigation($nav)
       ->appendChild($content)
-      ->addClass('white-background');
+      ->addFrameClass('white-background');
   }
 
 }

src/applications/config/controller/PhabricatorConfigVersionController.php

@@ -31,7 +31,7 @@ final class PhabricatorConfigVersionController
       ->setCrumbs($crumbs)
       ->setNavigation($nav)
       ->appendChild($content)
-      ->addClass('white-background');
+      ->addFrameClass('white-background');
 
   }
 

src/applications/home/controller/PhabricatorHomeMainController.php

@@ -46,7 +46,7 @@ final class PhabricatorHomeMainController extends PhabricatorHomeController {
 
     return $this->newPage()
       ->setTitle('Phabricator')
-      ->addClass('phabricator-home')
+      ->addFrameClass('phabricator-home')
       ->appendChild($content);
 
   }

src/applications/project/controller/PhabricatorProjectBoardViewController.php

@@ -455,8 +455,8 @@ final class PhabricatorProjectBoardViewController
       require_celerity_resource('phui-workboard-color-css');
       $background_color_class = "phui-workboard-{$background}";
 
-      $page->addClass('phui-workboard-color');
+      $page->addFrameClass('phui-workboard-color');
-      $page->addClass($background_color_class);
+      $page->addFrameClass($background_color_class);
     }
 
     return $page;

src/applications/search/controller/PhabricatorApplicationSearchController.php

@@ -320,7 +320,6 @@ final class PhabricatorApplicationSearchController
       $crumbs->addTextCrumb($title);
     }
 
-    $nav->addClass('application-search-view');
     require_celerity_resource('application-search-view-css');
 
     return $this->newPage()
@@ -328,6 +327,7 @@ final class PhabricatorApplicationSearchController
       ->setTitle(pht('Query: %s', $title))
       ->setCrumbs($crumbs)
       ->setNavigation($nav)
+      ->addFrameClass('application-search-view')
       ->appendChild($body);
   }
 
@@ -419,7 +419,6 @@ final class PhabricatorApplicationSearchController
       ->setObjectList($list)
       ->addClass('application-search-results');
 
-    $nav->addClass('application-search-view');
     require_celerity_resource('application-search-view-css');
 
     return $this->newPage()
@@ -427,6 +426,7 @@ final class PhabricatorApplicationSearchController
       ->setTitle(pht('Saved Queries'))
       ->setCrumbs($crumbs)
       ->setNavigation($nav)
+      ->addFrameClass('application-search-view')
       ->appendChild($box);
   }
 

src/view/page/PhabricatorStandardPageView.php

@@ -13,6 +13,7 @@ final class PhabricatorStandardPageView extends PhabricatorBarePageView
   private $menuContent;
   private $showChrome = true;
   private $classes = array();
+  private $frameClasses = array();
   private $disableConsole;
   private $pageObjects = array();
   private $applicationMenu;
@@ -80,6 +81,11 @@ final class PhabricatorStandardPageView extends PhabricatorBarePageView
     return $this;
   }
 
+  public function addFrameClass($class) {
+    $this->frameClasses[] = $class;
+    return $this;
+  }
+
   public function setPageObjectPHIDs(array $phids) {
     $this->pageObjects = $phids;
     return $this;
@@ -528,7 +534,7 @@ final class PhabricatorStandardPageView extends PhabricatorBarePageView
       }
       $nav->appendChild($body);
       $nav->appendFooter($footer);
-      $content = phutil_implode_html('', array($nav->render()));
+      $content = $nav;
     } else {
       $content = array();
 
@@ -539,10 +545,18 @@ final class PhabricatorStandardPageView extends PhabricatorBarePageView
 
       $content[] = $body;
       $content[] = $footer;
-
-      $content = phutil_implode_html('', $content);
     }
 
+    $frame_classes = $this->frameClasses;
+    $frame_classes[] = 'main-page-background';
+
+    $content = phutil_tag(
+      'div',
+      array(
+        'class' => implode(' ', $frame_classes),
+      ),
+      $content);
+
     return array(
       ($console ? hsprintf('<darkconsole />') : null),
       $content,

webroot/rsrc/css/application/base/standard-page-view.css

@@ -17,7 +17,18 @@
   clear: both;
 }
 
-body.white-background {
+.main-page-background {
+  position: absolute;
+  top: 44px;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  overflow: scroll;
+  z-index: -1;
+  background: {$page.background};
+}
+
+.main-page-background.white-background {
   background: #fff;
 }
 

webroot/rsrc/css/application/search/application-search-view.css

@@ -11,6 +11,11 @@
   padding: 0 16px 24px;
 }
 
+.device-phone .application-search-view
+  .application-search-results.phui-object-box {
+    padding: 0 8px 24px;
+}
+
 .application-search-view .application-search-results .phui-profile-header {
   padding: 16px 8px;
   border-bottom: 1px solid {$thinblueborder};
@@ -53,3 +58,8 @@
 .device-phone .application-search-pager {
   margin: 12px;
 }
+
+.device-phone .application-search-view .application-search-results
+  .phui-profile-header {
+    padding-top: 12px;
+}

webroot/rsrc/css/core/core.css

@@ -42,12 +42,17 @@ h1, h2, h3, h4, h5, h6 {
   font-weight: bold;
 }
 
+html{
+  min-height: 100%;
+  position: relative;
+}
+
 body {
   font: {$basefont};
   direction: ltr;
   text-align: left;
   unicode-bidi: embed;
-  background: {$page.background};
+  height: 100%;
 
   /* By default, the iPhone zooms all text on the page by some percentage when
      you rotate from portrait mode to landscape mode. Disable this, since it

webroot/rsrc/css/phui/phui-basic-nav-view.css

@@ -3,19 +3,19 @@
  */
 
 .device-desktop .phui-navigation-shell,
-.phabricator-home.device .phui-navigation-shell {
+.device .phabricator-home .phui-navigation-shell {
   display: table;
   width: 100%;
   height: calc(100vh - {$menu.main.height});
 }
 
 .device-desktop .phui-navigation-shell .phabricator-nav,
-.phabricator-home.device .phui-navigation-shell .phabricator-nav {
+.device .phabricator-home .phui-navigation-shell .phabricator-nav {
   display: table-row;
 }
 
 .device-desktop .phui-navigation-shell .phabricator-nav-local,
-.phabricator-home.device .phui-navigation-shell .phabricator-nav-local {
+.device .phabricator-home .phui-navigation-shell .phabricator-nav-local {
   display: table-cell;
   position: relative;
   vertical-align: top;

webroot/rsrc/css/phui/workboards/phui-workboard-color.css

@@ -30,11 +30,11 @@
   background-color: rgba({$alphawhite},.6);
 }
 
-body.phui-workboard-color .phui-profile-menu .phabricator-side-menu {
+body .phui-workboard-color .phui-profile-menu .phabricator-side-menu {
   background-color: rgba({$alphagrey},.3);
 }
 
-body.phui-workboard-color .phabricator-side-menu .phui-profile-menu-footer-1 {
+body .phui-workboard-color .phabricator-side-menu .phui-profile-menu-footer-1 {
   background-color: transparent;
 }
 

webroot/rsrc/css/phui/workboards/phui-workboard.css

@@ -14,12 +14,11 @@
   overflow-x: auto;
   overflow-y: hidden;
   position: absolute;
-  top: 79px;
+  top: 32px;
   bottom: 0;
   left: 0;
   right: 0;
   padding: 16px;
-  background-color: #fff;
 }
 
 .phui-workboard-view-shadow::-webkit-scrollbar {
@@ -75,9 +74,13 @@
   display: none;
 }
 
+.device-desktop .phui-workboard-fullscreen .main-page-background {
+  top: 0;
+}
+
 .device-desktop .phui-workboard-fullscreen .phui-profile-menu
   .phui-workboard-view-shadow {
-    top: 35px;
+    top: 32px;
     left: 0;
 }