From 429543b6376fbe3a2a9bc1449951953e038577f6 Mon Sep 17 00:00:00 2001
From: epriestley <git@epriestley.com>
Date: Wed, 12 Aug 2020 08:48:25 -0700
Subject: [PATCH] Fix some content/background overflow issues with commit graph
 lists

Summary: Ref T13552. There are currently some content overflow issues on the graph view where the menu height can exceed the content height and the frame is drawn on a sub-element. Make the frame draw around all the content.

Test Plan: Viewed commit graph history view, saw more sensible UI.

Maniphest Tasks: T13552

Differential Revision: https://secure.phabricator.com/D21440
---
 resources/celerity/map.php                    |  6 ++--
 src/view/phui/PHUIObjectItemView.php          | 34 ++++++++++---------
 .../phui/object-item/phui-oi-list-view.css    |  5 ++-
 3 files changed, 23 insertions(+), 22 deletions(-)

diff --git a/resources/celerity/map.php b/resources/celerity/map.php
index 77b041e0fa..4bac12ed9e 100644
--- a/resources/celerity/map.php
+++ b/resources/celerity/map.php
@@ -9,7 +9,7 @@ return array(
   'names' => array(
     'conpherence.pkg.css' => '0e3cf785',
     'conpherence.pkg.js' => '020aebcf',
-    'core.pkg.css' => '2ffd6897',
+    'core.pkg.css' => 'b13bef94',
     'core.pkg.js' => 'adc34883',
     'dark-console.pkg.js' => '187792c2',
     'differential.pkg.css' => '5c459f92',
@@ -137,7 +137,7 @@ return array(
     'rsrc/css/phui/object-item/phui-oi-color.css' => 'b517bfa0',
     'rsrc/css/phui/object-item/phui-oi-drag-ui.css' => 'da15d3dc',
     'rsrc/css/phui/object-item/phui-oi-flush-ui.css' => '490e2e2e',
-    'rsrc/css/phui/object-item/phui-oi-list-view.css' => 'ecd651d5',
+    'rsrc/css/phui/object-item/phui-oi-list-view.css' => 'af98a277',
     'rsrc/css/phui/object-item/phui-oi-simple-ui.css' => '6a30fa46',
     'rsrc/css/phui/phui-action-list.css' => '1b0085b2',
     'rsrc/css/phui/phui-action-panel.css' => '6c386cbf',
@@ -874,7 +874,7 @@ return array(
     'phui-oi-color-css' => 'b517bfa0',
     'phui-oi-drag-ui-css' => 'da15d3dc',
     'phui-oi-flush-ui-css' => '490e2e2e',
-    'phui-oi-list-view-css' => 'ecd651d5',
+    'phui-oi-list-view-css' => 'af98a277',
     'phui-oi-simple-ui-css' => '6a30fa46',
     'phui-pager-css' => 'd022c7ad',
     'phui-pinboard-view-css' => '1f08f5d8',
diff --git a/src/view/phui/PHUIObjectItemView.php b/src/view/phui/PHUIObjectItemView.php
index 1dfa1a198e..c1974bdd33 100644
--- a/src/view/phui/PHUIObjectItemView.php
+++ b/src/view/phui/PHUIObjectItemView.php
@@ -816,6 +816,23 @@ final class PHUIObjectItemView extends AphrontTagView {
         $box,
       ));
 
+    if ($this->menu) {
+      $grid_view = id(new FuelGridView())
+        ->addClass('fuel-grid-tablet');
+      $grid_row = $grid_view->newRow();
+
+      $grid_row->newCell()
+        ->setContent($frame_content);
+
+      $menu = $this->menu;
+
+      $grid_row->newCell()
+        ->addClass('phui-oi-menu')
+        ->setContent($menu);
+
+      $frame_content = $grid_view;
+    }
+
     $frame_cover = null;
     if ($this->coverImage) {
       $cover_image = phutil_tag(
@@ -843,22 +860,7 @@ final class PHUIObjectItemView extends AphrontTagView {
         $frame_content,
       ));
 
-    $grid_view = id(new FuelGridView())
-      ->addClass('fuel-grid-tablet');
-    $grid_row = $grid_view->newRow();
-
-    $grid_row->newCell()
-      ->setContent($frame);
-
-    if ($this->menu) {
-      $menu = $this->menu;
-
-      $grid_row->newCell()
-        ->addClass('phui-oi-menu')
-        ->setContent($menu);
-    }
-
-    return $grid_view;
+    return $frame;
   }
 
   private function renderStatusIcon($icon, $label) {
diff --git a/webroot/rsrc/css/phui/object-item/phui-oi-list-view.css b/webroot/rsrc/css/phui/object-item/phui-oi-list-view.css
index ea04518bdf..e64989f8cd 100644
--- a/webroot/rsrc/css/phui/object-item/phui-oi-list-view.css
+++ b/webroot/rsrc/css/phui/object-item/phui-oi-list-view.css
@@ -736,10 +736,9 @@ ul.phui-oi-list-view .phui-oi-selectable
 .device-desktop .phui-oi-menu,
 .device-tablet .phui-oi-menu {
   width: 200px;
-  border-width: 0 0 1px 1px;
+  border-width: 0 0 0 1px;
 }
 
 .device-phone .phui-oi-menu {
-  border-width: 0 0 1px;
-  margin-bottom: 12px;
+  border-width: 1px 0 0;
 }