From a14d5041b5c16ce96178f06113de462e5f45207a Mon Sep 17 00:00:00 2001
From: Kate Butler <kate@innocraft.com>
Date: Fri, 6 Dec 2019 11:07:16 +1300
Subject: Fix header alignment for multi-dimension reports (#15134)

---
 plugins/CoreHome/stylesheets/dataTable/_dataTable.less             | 7 +++++--
 plugins/CoreHome/templates/_dataTableHead.twig                     | 3 ++-
 plugins/CoreVisualizations/templates/_dataTableViz_htmlTable.twig  | 4 ++--
 tests/UI/expected-screenshots/Comparison_subtables_loaded.png      | 4 ++--
 .../expected-screenshots/ViewDataTableTest_dimension_columns.png   | 4 ++--
 .../UI/expected-screenshots/ViewDataTableTest_dimension_search.png | 4 ++--
 6 files changed, 15 insertions(+), 11 deletions(-)

diff --git a/plugins/CoreHome/stylesheets/dataTable/_dataTable.less b/plugins/CoreHome/stylesheets/dataTable/_dataTable.less
index 5db4177fa1..41c10bdf34 100644
--- a/plugins/CoreHome/stylesheets/dataTable/_dataTable.less
+++ b/plugins/CoreHome/stylesheets/dataTable/_dataTable.less
@@ -153,10 +153,13 @@ table.subActionsDataTable td.label,
 table.actionsDataTable td.label {
   border-top: 0;
   border-left: 0;
-  position: sticky; position: -webkit-sticky;
   left: 0;
   z-index: 1;
   background-clip: padding-box;
+
+  &.first {
+    position: sticky; position: -webkit-sticky;
+  }
 }
 
 .dataTableActions table.dataTable th.label {
@@ -663,6 +666,6 @@ div.dataTableScroller {
   table.dataTable td.label,
   table.subActionsDataTable td.label,
   table.actionsDataTable td.label {
-    position: static;
+    position: static !important;
   }
 }
diff --git a/plugins/CoreHome/templates/_dataTableHead.twig b/plugins/CoreHome/templates/_dataTableHead.twig
index d607f7ad04..9ef585c240 100644
--- a/plugins/CoreHome/templates/_dataTableHead.twig
+++ b/plugins/CoreHome/templates/_dataTableHead.twig
@@ -1,7 +1,8 @@
+{% set dimensions = dataTable.getMetadata('dimensions')|default([]) %}
 <thead>
    <tr>
        {% for column in properties.columns_to_display %}
-           <th class="{% if properties.enable_sort %}sortable{% endif %} {% if loop.first %}first{% elseif loop.last %}last{% endif %} {% if column == 'label' %}label{% endif %}" id="{{ column }}">
+           <th class="{% if properties.enable_sort %}sortable{% endif %} {% if loop.first %}first{% elseif loop.last %}last{% endif %} {% if column == 'label' or column in dimensions %}label{% endif %}" id="{{ column }}">
                {% if properties.metrics_documentation[column]|default is not empty %}
                    <div class="columnDocumentation">
                        <div class="columnDocumentationTitle">
diff --git a/plugins/CoreVisualizations/templates/_dataTableViz_htmlTable.twig b/plugins/CoreVisualizations/templates/_dataTableViz_htmlTable.twig
index a9ac3f4dae..6178e33cec 100644
--- a/plugins/CoreVisualizations/templates/_dataTableViz_htmlTable.twig
+++ b/plugins/CoreVisualizations/templates/_dataTableViz_htmlTable.twig
@@ -42,7 +42,7 @@
                     {% if rowHasSubtable %}title="{{ 'CoreHome_ClickRowToExpandOrContract'|translate }}"{% endif %}>
                     {% for column in properties.columns_to_display %}
                         {% set cellAttributes = visualization.getCellHtmlAttributes(row, column) %}
-                        <td class="{% if column =='label' or column in dimensions %}label{% else %}column{% endif %} {{ cellAttributes.class|default|e('html_attr') }}"
+                        <td class="{% if column =='label' or column in dimensions %}label{% else %}column{% endif %} {% if loop.first %}first{% endif %} {{ cellAttributes.class|default|e('html_attr') }}"
                             {% if cellAttributes is not empty %}{% for name, value in cellAttributes %}{{ name|e('html') }}="{{ value|e('html_attr') }}" {% endfor %}{% endif %}
                         >
                             {% if isComparing and column == 'label' %}
@@ -77,7 +77,7 @@
                 <tr class="{{ row.getMetadata('css_class') }} totalsRow"
                         title="Total values for this table">
                     {% for column in properties.columns_to_display %}
-                        <td class="{% if column =='label' %}label{% else %}column{% endif %}">
+                        <td class="{% if column =='label' %}label{% else %}column{% endif %} {% if loop.first %}first{% endif %}">
                             {% include "@CoreHome/_dataTableCell.twig" with properties %}
                         </td>
                     {% endfor %}
diff --git a/tests/UI/expected-screenshots/Comparison_subtables_loaded.png b/tests/UI/expected-screenshots/Comparison_subtables_loaded.png
index 3f556f0caa..365e2cf578 100644
--- a/tests/UI/expected-screenshots/Comparison_subtables_loaded.png
+++ b/tests/UI/expected-screenshots/Comparison_subtables_loaded.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:2e41435b877d39f3986f35213f946e3f3b4ea782c8bf36ebdf44c67cf7783778
-size 108480
+oid sha256:cd1ad294483afb555fabcdd2dec8393405ee9a88207779b70c44d03cfe22f6da
+size 108446
diff --git a/tests/UI/expected-screenshots/ViewDataTableTest_dimension_columns.png b/tests/UI/expected-screenshots/ViewDataTableTest_dimension_columns.png
index 50b6ce4c67..bd44254499 100644
--- a/tests/UI/expected-screenshots/ViewDataTableTest_dimension_columns.png
+++ b/tests/UI/expected-screenshots/ViewDataTableTest_dimension_columns.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:95015c748e903e88dbf8f49e9e51b0271534b81c50256b5acf7496a45560efca
-size 73203
+oid sha256:8345bcf2d3ab7c33964df63c22a580e2758ce86a29c2729a051921e9d65d4a30
+size 73262
diff --git a/tests/UI/expected-screenshots/ViewDataTableTest_dimension_search.png b/tests/UI/expected-screenshots/ViewDataTableTest_dimension_search.png
index 1aeef943d3..2d6faa7232 100644
--- a/tests/UI/expected-screenshots/ViewDataTableTest_dimension_search.png
+++ b/tests/UI/expected-screenshots/ViewDataTableTest_dimension_search.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:ca1e601e50ea1905c79c58f0e174fe45d6abc3c27934932d39374c1ac588aa3e
-size 43912
+oid sha256:ab2eaa24229ed56a0254ada9185d20c26c035d9a9175f4035fbfb27b80ee1418
+size 43975
-- 
cgit v1.2.3