From 7250f5196d04c8827d24f82a7eb987e7264739e1 Mon Sep 17 00:00:00 2001
From: Alex Coles <alex@alexbcoles.com>
Date: Thu, 19 Jun 2014 20:15:12 +0200
Subject: [PATCH 1/2] Fix horizontal table scrolling within split view

Work packages table with a large number of columns was not scrollable
due to the use of `display: table`/`display: table-cell` on parent
divs with the wrong (default) value set for `table-layout` property.

See: https://developer.mozilla.org/en-US/docs/Web/CSS/table-layout#Values

Bug # 8234

[ci skip]

Signed-off-by: Alex Coles <alex@alexbcoles.com>
---
 .../stylesheets/content/_work_packages.sass   |  3 ++
 .../stylesheets/layout/_split_view.sass       |  1 +
 public/templates/work_packages.list.html      | 42 +++++++++----------
 3 files changed, 25 insertions(+), 21 deletions(-)

diff --git a/app/assets/stylesheets/content/_work_packages.sass b/app/assets/stylesheets/content/_work_packages.sass
index 217b915ddf..b661cb6b8d 100644
--- a/app/assets/stylesheets/content/_work_packages.sass
+++ b/app/assets/stylesheets/content/_work_packages.sass
@@ -35,6 +35,9 @@
 .work-packages--list
   @extend %panel
 
+.work-packages--list-scroll-area
+  overflow-x: scroll
+
 .work-packages--details
   @extend %panel
   padding: 0 1em 1em
diff --git a/app/assets/stylesheets/layout/_split_view.sass b/app/assets/stylesheets/layout/_split_view.sass
index 3d42aa6477..24bd6fad4a 100644
--- a/app/assets/stylesheets/layout/_split_view.sass
+++ b/app/assets/stylesheets/layout/_split_view.sass
@@ -23,6 +23,7 @@
   width: 100%
   clear: both
   display: table
+  table-layout: fixed
 
 .split-view %panel
   display: table-cell
diff --git a/public/templates/work_packages.list.html b/public/templates/work_packages.list.html
index bad86adcd9..b3ca014b6e 100644
--- a/public/templates/work_packages.list.html
+++ b/public/templates/work_packages.list.html
@@ -99,31 +99,31 @@
 <back-url></back-url>
 
 
-<div class="work-packages--split-view autoscroll">
+<div class="work-packages--split-view">
   <div class="work-packages--list" cg-busy="settingUpPage">
-    <work-packages-table ng-if="rows && columns"
-                         cg-busy="refreshWorkPackages"
-                         project-identifier="projectIdentifier"
-                         columns="columns"
-                         rows="rows"
-                         query="query"
-                         group-by="query.groupBy"
-                         group-by-column="groupByColumn"
-                         count-by-group="workPackageCountByGroup"
-                         display-sums="query.displaySums"
-                         total-sums="totalSums"
-                         group-sums="groupSums"
-                         update-results="updateResults()"
-                         update-back-url="updateBackUrl">
-    </work-packages-table>
-
-    <table-pagination total-entries="totalEntries"
-                      update-results="updateResults()">
-    </table-pagination>
+    <div class="work-packages--list-scroll-area">
+      <work-packages-table ng-if="rows && columns"
+                           cg-busy="refreshWorkPackages"
+                           project-identifier="projectIdentifier"
+                           columns="columns"
+                           rows="rows"
+                           query="query"
+                           group-by="query.groupBy"
+                           group-by-column="groupByColumn"
+                           count-by-group="workPackageCountByGroup"
+                           display-sums="query.displaySums"
+                           total-sums="totalSums"
+                           group-sums="groupSums"
+                           update-results="updateResults()"
+                           update-back-url="updateBackUrl">
+      </work-packages-table>
 
+      <table-pagination total-entries="totalEntries"
+                        update-results="updateResults()">
+      </table-pagination>
+    </div>
     <modal-loading>
     </modal-loading>
-
   </div>
   <div class="work-packages--details" ui-view
     feature-flag="detailsView"></div>

From 0815f376cf6a794e2f82b95d47ef42d0717566c7 Mon Sep 17 00:00:00 2001
From: Alex Coles <alex@alexbcoles.com>
Date: Fri, 20 Jun 2014 15:58:25 +0200
Subject: [PATCH 2/2] Ensure column context menus scroll with table

Signed-off-by: Alex Coles <alex@alexbcoles.com>
---
 .../javascripts/angular/work_packages/column-context-menu.js    | 2 +-
 app/assets/stylesheets/content/_work_packages.sass              | 1 +
 2 files changed, 2 insertions(+), 1 deletion(-)

diff --git a/app/assets/javascripts/angular/work_packages/column-context-menu.js b/app/assets/javascripts/angular/work_packages/column-context-menu.js
index 420cf7ab07..971fbcdac2 100644
--- a/app/assets/javascripts/angular/work_packages/column-context-menu.js
+++ b/app/assets/javascripts/angular/work_packages/column-context-menu.js
@@ -36,7 +36,7 @@ angular.module('openproject.workPackages')
     controller: 'ColumnContextMenuController',
     controllerAs: 'contextMenu',
     templateUrl: '/templates/work_packages/column_context_menu.html',
-    container: '.work-packages--list'
+    container: '.work-packages--list-scroll-area'
   });
 }])
 
diff --git a/app/assets/stylesheets/content/_work_packages.sass b/app/assets/stylesheets/content/_work_packages.sass
index b661cb6b8d..13934c5c65 100644
--- a/app/assets/stylesheets/content/_work_packages.sass
+++ b/app/assets/stylesheets/content/_work_packages.sass
@@ -37,6 +37,7 @@
 
 .work-packages--list-scroll-area
   overflow-x: scroll
+  position: relative
 
 .work-packages--details
   @extend %panel