[Redesign] Mobile/Phone design pass

Summary: Ref T8099, Quick descent pass at making header, object lists, tables, filter view, mobile friendly.

Test Plan:
Test home, differential diff, maniphest task, new task, search, and a few other views.

{F414034}

Reviewers: btrahan, epriestley

Reviewed By: epriestley

Subscribers: Korvin, epriestley

Maniphest Tasks: T8099

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

resources/celerity/map.php

@@ -7,20 +7,20 @@
  */
 return array(
   'names' => array(
-    'core.pkg.css' => '2ba05f62',
+    'core.pkg.css' => '979f9a16',
     'core.pkg.js' => '9db3e620',
     'darkconsole.pkg.js' => 'e7393ebb',
     'differential.pkg.css' => 'bb338e4b',
     'differential.pkg.js' => '63a77807',
     'diffusion.pkg.css' => '385e85b3',
     'diffusion.pkg.js' => '0115b37c',
-    'maniphest.pkg.css' => 'ddf93c68',
+    'maniphest.pkg.css' => 'e87fdd66',
     'maniphest.pkg.js' => '2f4f52c2',
     'rsrc/css/aphront/aphront-bars.css' => '231ac33c',
     'rsrc/css/aphront/dark-console.css' => '6378ef3d',
-    'rsrc/css/aphront/dialog-view.css' => '725f2f23',
+    'rsrc/css/aphront/dialog-view.css' => '8ea1b9cc',
     'rsrc/css/aphront/lightbox-attachment.css' => '7acac05d',
-    'rsrc/css/aphront/list-filter-view.css' => '1fb5cab3',
+    'rsrc/css/aphront/list-filter-view.css' => 'aa5ffcb9',
     'rsrc/css/aphront/multi-column.css' => 'fd18389d',
     'rsrc/css/aphront/notification.css' => '9c279160',
     'rsrc/css/aphront/pager-view.css' => '2e3539af',
@@ -46,7 +46,7 @@ return array(
     'rsrc/css/application/config/config-welcome.css' => '6abd79be',
     'rsrc/css/application/config/setup-issue.css' => '631c4e92',
     'rsrc/css/application/config/unhandled-exception.css' => '4c96257a',
-    'rsrc/css/application/conpherence/durable-column.css' => '0c23f069',
+    'rsrc/css/application/conpherence/durable-column.css' => '4cb8c197',
     'rsrc/css/application/conpherence/menu.css' => 'f9f1d143',
     'rsrc/css/application/conpherence/message-pane.css' => '7cbf4cbb',
     'rsrc/css/application/conpherence/notification.css' => '919974b6',
@@ -78,7 +78,7 @@ return array(
     'rsrc/css/application/maniphest/batch-editor.css' => '9a5ed9c1',
     'rsrc/css/application/maniphest/report.css' => 'f6931fdf',
     'rsrc/css/application/maniphest/task-edit.css' => '8e23031b',
-    'rsrc/css/application/maniphest/task-summary.css' => '307c88e9',
+    'rsrc/css/application/maniphest/task-summary.css' => '8795780d',
     'rsrc/css/application/objectselector/object-selector.css' => '029a133d',
     'rsrc/css/application/owners/owners-path-editor.css' => '2f00933b',
     'rsrc/css/application/paste/paste.css' => 'eb997ddd',
@@ -132,16 +132,16 @@ return array(
     'rsrc/css/phui/phui-document.css' => '8be7a5e3',
     'rsrc/css/phui/phui-feed-story.css' => 'c9f3a0b5',
     'rsrc/css/phui/phui-fontkit.css' => 'b664ac96',
-    'rsrc/css/phui/phui-form-view.css' => '526ee2ab',
+    'rsrc/css/phui/phui-form-view.css' => '87263b05',
     'rsrc/css/phui/phui-form.css' => 'f535f938',
-    'rsrc/css/phui/phui-header-view.css' => '99066800',
+    'rsrc/css/phui/phui-header-view.css' => '8ced06e4',
     'rsrc/css/phui/phui-icon.css' => '88ba9081',
     'rsrc/css/phui/phui-image-mask.css' => '5a8b09c8',
     'rsrc/css/phui/phui-info-panel.css' => '27ea50a1',
     'rsrc/css/phui/phui-info-view.css' => '33595731',
     'rsrc/css/phui/phui-list.css' => 'e448b6ba',
-    'rsrc/css/phui/phui-object-box.css' => '70285ee9',
+    'rsrc/css/phui/phui-object-box.css' => 'b9d566e3',
-    'rsrc/css/phui/phui-object-item-list-view.css' => '4be0645f',
+    'rsrc/css/phui/phui-object-item-list-view.css' => '2032bf8b',
     'rsrc/css/phui/phui-pinboard-view.css' => '22891c15',
     'rsrc/css/phui/phui-property-list-view.css' => 'd2d143ea',
     'rsrc/css/phui/phui-remarkup-preview.css' => '19ad512b',
@@ -479,8 +479,8 @@ return array(
     'almanac-css' => 'dbb9b3af',
     'aphront-bars' => '231ac33c',
     'aphront-dark-console-css' => '6378ef3d',
-    'aphront-dialog-view-css' => '725f2f23',
+    'aphront-dialog-view-css' => '8ea1b9cc',
-    'aphront-list-filter-view-css' => '1fb5cab3',
+    'aphront-list-filter-view-css' => 'aa5ffcb9',
     'aphront-multi-column-view-css' => 'fd18389d',
     'aphront-pager-view-css' => '2e3539af',
     'aphront-panel-view-css' => '8427b78d',
@@ -495,7 +495,7 @@ return array(
     'conduit-api-css' => '7bc725c4',
     'config-options-css' => '7fedf08b',
     'config-welcome-css' => '6abd79be',
-    'conpherence-durable-column-view' => '0c23f069',
+    'conpherence-durable-column-view' => '4cb8c197',
     'conpherence-menu-css' => 'f9f1d143',
     'conpherence-message-pane-css' => '7cbf4cbb',
     'conpherence-notification-css' => '919974b6',
@@ -689,7 +689,7 @@ return array(
     'maniphest-batch-editor' => '9a5ed9c1',
     'maniphest-report-css' => 'f6931fdf',
     'maniphest-task-edit-css' => '8e23031b',
-    'maniphest-task-summary-css' => '307c88e9',
+    'maniphest-task-summary-css' => '8795780d',
     'multirow-row-manager' => 'b5d57730',
     'owners-path-editor' => 'aa1733d0',
     'owners-path-editor-css' => '2f00933b',
@@ -768,16 +768,16 @@ return array(
     'phui-font-icon-base-css' => '3dad2ae3',
     'phui-fontkit-css' => 'b664ac96',
     'phui-form-css' => 'f535f938',
-    'phui-form-view-css' => '526ee2ab',
+    'phui-form-view-css' => '87263b05',
-    'phui-header-view-css' => '99066800',
+    'phui-header-view-css' => '8ced06e4',
     'phui-icon-view-css' => '88ba9081',
     'phui-image-mask-css' => '5a8b09c8',
     'phui-info-panel-css' => '27ea50a1',
     'phui-info-view-css' => '33595731',
     'phui-inline-comment-view-css' => '2174771a',
     'phui-list-view-css' => 'e448b6ba',
-    'phui-object-box-css' => '70285ee9',
+    'phui-object-box-css' => 'b9d566e3',
-    'phui-object-item-list-view-css' => '4be0645f',
+    'phui-object-item-list-view-css' => '2032bf8b',
     'phui-pinboard-view-css' => '22891c15',
     'phui-property-list-view-css' => 'd2d143ea',
     'phui-remarkup-preview-css' => '19ad512b',

src/applications/maniphest/view/ManiphestTaskResultListView.php

@@ -263,6 +263,8 @@ final class ManiphestTaskResultListView extends ManiphestView {
       ->setHeaderText(pht('Batch Task Editor'))
       ->appendChild($editor);
 
-    return $box;
+    $content = phutil_tag_div('maniphest-batch-editor', $box);
+
+    return $content;
   }
 }

webroot/rsrc/css/aphront/list-filter-view.css

@@ -14,12 +14,14 @@
 }
 
 .device-phone .aphront-list-filter-view {
-  padding: 0 8px 8px;
+  padding: 0;
 }
 
 .device-phone .aphront-list-filter-wrap {
   margin: 0;
   border: none;
+  border-radius: 0;
+  border-top: 1px solid {$lightblueborder};
   border-bottom: 1px solid {$lightblueborder};
 }
 
@@ -34,7 +36,7 @@
 }
 
 .device-phone .aphront-list-filter-view-content .phui-form-view {
-  padding: 0;
+  padding: 0 0 4px 4px;
 }
 
 /* When a list filter view contains two consecuitive forms, lay them out

webroot/rsrc/css/application/maniphest/task-summary.css

@@ -1,8 +1,7 @@
 /**
  * @provides maniphest-task-summary-css
  */
-
+.device-phone .maniphest-batch-editor,
-.device-phone .maniphest-task-batch,
 .device-phone .maniphest-task-updated {
   display: none;
 }

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

@@ -6,6 +6,10 @@
   padding: 16px;
 }
 
+.device-phone .phui-object-box .phui-form-view {
+  padding: 0;
+}
+
 .phui-form-view.phui-form-full-width {
   padding: 0;
 }

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

@@ -48,7 +48,7 @@ body .phui-header-shell.phui-bleed-header {
 body .phui-header-shell.phui-bleed-header
   .phui-header-view {
   padding: 8px 24px 8px 0;
-  color: {$bluetext};
+  color: {$darkbluetext};
 }
 
 .phui-header-shell + .phabricator-form-view {
@@ -66,6 +66,10 @@ body .phui-header-shell.phui-bleed-header
   position: relative;
 }
 
+.device-phone .phui-header-view {
+  font-size: 14px;
+}
+
 .phui-object-box .phui-header-tall h1.phui-header-view,
 .phui-document-view .phui-header-tall h1.phui-header-view {
   font-size: 18px;
@@ -101,10 +105,6 @@ body .phui-header-shell.phui-bleed-header
   color: {$lightbluetext};
 }
 
-body.device-phone .phui-header-view {
-  padding: 12px 8px;
-}
-
 .phui-header-tags {
   margin-left: 12px;
   font-size: 13px;

webroot/rsrc/css/phui/phui-object-box.css

@@ -11,10 +11,18 @@
   padding: 12px 0 0 0;
 }
 
+.device-phone .phui-object-box.phui-object-box-collapsed {
+  padding: 8px 0 0 0;
+}
+
 .phui-object-box.phui-object-box-collapsed .phui-header-shell {
   padding: 0 8px 12px 16px;
 }
 
+.device-phone .phui-object-box.phui-object-box-collapsed .phui-header-shell {
+  padding: 0 8px 8px;
+}
+
 div.phui-object-box.phui-object-box-flush {
   margin-top: 0;
 }
@@ -32,7 +40,12 @@ div.phui-object-box.phui-object-box-flush {
 }
 
 .device-phone .phui-object-box {
-  margin: 8px 8px 0 8px;
+  margin: 8px;
+  padding: 8px 8px 4px 8px;
+}
+
+.device-phone .phui-object-box .phui-header-shell {
+  padding-bottom: 8px;
 }
 
 /* - Object Box Colors ------------------------------------------------------ */

webroot/rsrc/css/phui/phui-object-item-list-view.css

@@ -152,6 +152,11 @@ ul.phui-object-item-list-view {
   vertical-align: middle;
 }
 
+.device-phone .phui-object-item-col0 {
+  vertical-align: top;
+  padding-top: 8px;
+}
+
 .phui-object-item-col1 {
   display: table-cell;
   vertical-align: top;