From c6f04fbedc34b1101e836f1743c8570d2a8db9e9 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Maur=C3=ADcio=20Meneghini=20Fauth?= <mauricio@fauth.dev>
Date: Wed, 14 Jun 2023 09:55:29 -0300
Subject: [PATCH] Fix results table header with transparent background
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: Maurício Meneghini Fauth <mauricio@fauth.dev>
---
 libraries/classes/Display/Results.php                  | 10 +++++-----
 templates/display/results/table.twig                   |  8 +++++---
 .../display/results/table_headers_for_columns.twig     |  2 +-
 test/classes/Display/ResultsTest.php                   |  8 ++++----
 4 files changed, 15 insertions(+), 13 deletions(-)

diff --git a/libraries/classes/Display/Results.php b/libraries/classes/Display/Results.php
index d7e4e0984e..cc4a30664d 100644
--- a/libraries/classes/Display/Results.php
+++ b/libraries/classes/Display/Results.php
@@ -1067,7 +1067,7 @@ class Results
         $displayParams = $this->properties['display_params'];
 
         // 1. Displays the full/partial text button (part 1)...
-        $buttonHtml = '<thead><tr>' . "\n";
+        $buttonHtml = '';
 
         $emptyPreCondition = $displayParts->hasEditLink && $displayParts->deleteLink !== DeleteLinkEnum::NO_DELETE;
 
@@ -1087,7 +1087,7 @@ class Results
 
             $displayParams['emptypre'] = $emptyPreCondition ? 4 : 0;
 
-            $buttonHtml .= '<th class="column_action position-sticky d-print-none"' . $colspan
+            $buttonHtml .= '<th class="column_action position-sticky bg-body d-print-none"' . $colspan
                 . '>' . $fullOrPartialTextLink . '</th>';
         } elseif (
             $leftOrBoth
@@ -1101,7 +1101,7 @@ class Results
         } elseif ($GLOBALS['cfg']['RowActionLinks'] === self::POSITION_NONE) {
             // ... elseif display an empty column if the actions links are
             //  disabled to match the rest of the table
-            $buttonHtml .= '<th class="column_action position-sticky"></th>';
+            $buttonHtml .= '<th class="column_action position-sticky bg-body"></th>';
         }
 
         $this->properties['display_params'] = $displayParams;
@@ -1732,7 +1732,7 @@ class Results
                 && $displayParts->deleteLink !== DeleteLinkEnum::NO_DELETE ? 4 : 1;
 
             $rightColumnHtml .= "\n"
-                . '<th class="column_action d-print-none"' . $colspan . '>'
+                . '<th class="column_action position-sticky bg-body d-print-none"' . $colspan . '>'
                 . $fullOrPartialTextLink
                 . '</th>';
         } elseif (
@@ -1748,7 +1748,7 @@ class Results
             $displayParams['emptyafter'] = $displayParts->hasEditLink
                 && $displayParts->deleteLink !== DeleteLinkEnum::NO_DELETE ? 4 : 1;
 
-            $rightColumnHtml .= "\n" . '<td class="d-print-none"' . $colspan
+            $rightColumnHtml .= "\n" . '<td class="position-sticky bg-body d-print-none"' . $colspan
                 . '></td>';
         }
 
diff --git a/templates/display/results/table.twig b/templates/display/results/table.twig
index 3571a43abc..24d13ed343 100644
--- a/templates/display/results/table.twig
+++ b/templates/display/results/table.twig
@@ -293,10 +293,12 @@
 
   <div class="table-responsive-md">
     <table class="table table-striped table-hover table-sm table_results data ajax w-auto" data-uniqueId="{{ unique_id }}">
+      <thead>
+        <tr>
 
-      {{ headers.button|raw }}
-      {{ headers.table_headers_for_columns|raw }}
-      {{ headers.column_at_right_side|raw }}
+          {{ headers.button|raw }}
+          {{ headers.table_headers_for_columns|raw }}
+          {{ headers.column_at_right_side|raw }}
 
         </tr>
       </thead>
diff --git a/templates/display/results/table_headers_for_columns.twig b/templates/display/results/table_headers_for_columns.twig
index d030fbf740..962670b54b 100644
--- a/templates/display/results/table_headers_for_columns.twig
+++ b/templates/display/results/table_headers_for_columns.twig
@@ -1,5 +1,5 @@
 {% for column in columns %}
-  <th class="draggable position-sticky{{ column.is_column_numeric ? ' text-end' }}{{ column.is_column_hidden ? ' hide' -}}
+  <th class="draggable position-sticky bg-body{{ column.is_column_numeric ? ' text-end' }}{{ column.is_column_hidden ? ' hide' -}}
     {{- is_sortable ? ' column_heading' }}{{ is_sortable and column.is_browse_marker_enabled ? ' marker' }}{{ is_sortable and column.is_browse_pointer_enabled ? ' pointer' -}}
     {{- not is_sortable and column.has_condition ? ' condition' }}" data-column="{{ column.column_name }}">
     {% if is_sortable %}
diff --git a/test/classes/Display/ResultsTest.php b/test/classes/Display/ResultsTest.php
index 96b7b7ce64..c72e3a1d65 100644
--- a/test/classes/Display/ResultsTest.php
+++ b/test/classes/Display/ResultsTest.php
@@ -1353,9 +1353,9 @@ class ResultsTest extends AbstractTestCase
                 ],
                 'options' => '$optionsBlock',
                 'has_bulk_actions_form' => false,
-                'button' => '<thead><tr>' . "\n",
+                'button' => '',
                 'table_headers_for_columns' => $tableHeadersForColumns,
-                'column_at_right_side' => "\n" . '<td class="d-print-none"></td>',
+                'column_at_right_side' => "\n" . '<td class="position-sticky bg-body d-print-none"></td>',
             ],
             'body' => '<tr><td data-decimals="0" data-type="real" class="'
                 . 'text-end data not_null text-nowrap">1</td>' . "\n"
@@ -1583,9 +1583,9 @@ class ResultsTest extends AbstractTestCase
                 'column_order' => [],
                 'options' => '$optionsBlock',
                 'has_bulk_actions_form' => false,
-                'button' => '<thead><tr>' . "\n",
+                'button' => '',
                 'table_headers_for_columns' => $tableHeadersForColumns,
-                'column_at_right_side' => "\n" . '<td class="d-print-none"></td>',
+                'column_at_right_side' => "\n" . '<td class="position-sticky bg-body d-print-none"></td>',
             ],
             'body' => '<tr><td data-decimals="0" data-type="int" class="'
                 . 'text-end data not_null text-nowrap">2</td>' . "\n"