From 4120398f57fb3c3a197529157050e56c352bc810 Mon Sep 17 00:00:00 2001
From: Arlen Johnson <arlen@sphericalcowgroup.com>
Date: Thu, 10 Aug 2023 17:29:55 -0400
Subject: [PATCH] Improve index columns layout and correct empty table heading
 (CFM-223) (#116)

---
 app/templates/Standard/index.php | 2 +-
 app/templates/element/filter.php | 6 ++++--
 app/webroot/css/co-base.css      | 9 ++++++---
 3 files changed, 11 insertions(+), 6 deletions(-)

diff --git a/app/templates/Standard/index.php b/app/templates/Standard/index.php
index bfc62c035..6725109f6 100644
--- a/app/templates/Standard/index.php
+++ b/app/templates/Standard/index.php
@@ -179,7 +179,7 @@
     <thead>
       <tr>
         <?php if(!empty($rowActions)): ?>
-          <th class="actions"></th>
+          <td class="actions"></td>
         <?php endif; ?>
         <?php
           // The first heading will get the bulk select all checkbox.
diff --git a/app/templates/element/filter.php b/app/templates/element/filter.php
index a3f5098cb..c316e9e0f 100644
--- a/app/templates/element/filter.php
+++ b/app/templates/element/filter.php
@@ -92,8 +92,10 @@
 <div id="<?= $modelName . ucfirst($this->request->getParam('action')); ?>Search" class="top-filters">
   <fieldset>
     <legend id="top-filters-toggle">
-      <em class="material-icons" aria-hidden="true">search</em>
-      <?= __d('operation', 'filter'); ?>
+      <em class="material-icons top-filters-search-icon" aria-hidden="true">search</em>
+      <span class="top-filters-title">
+        <?= __d('operation', 'filter'); ?>
+      </span>
 
       <?php if(!empty($search_params)):?>
         <span id="top-filters-active-filters">
diff --git a/app/webroot/css/co-base.css b/app/webroot/css/co-base.css
index a2ff7122d..a38c0b881 100644
--- a/app/webroot/css/co-base.css
+++ b/app/webroot/css/co-base.css
@@ -756,9 +756,12 @@ ul.form-list li.alert-banner .co-alert {
   background-color: transparent;
 }
 #content .top-filters legend .material-icons {
-  font-size: 1.4em;
   color: var(--cmg-color-headings);
 }
+#content .top-filters legend .material-icons.top-filters-search-icon {
+  font-size: 1.4rem;
+  padding: 0 0.2rem 0 0.1rem;
+}
 #content .top-filters legend button.cm-toggle .material-icons {
   font-size: 34px;
   line-height: 17px;
@@ -766,7 +769,7 @@ ul.form-list li.alert-banner .co-alert {
 .top-filters fieldset {
   clear: both;
   position: relative;
-  padding: 0.5em 0.5em 0;
+  padding: 0.4rem 0.5rem 0;
   margin: 0;
   background-color: var(--cmg-color-bg-001);
 }
@@ -1558,7 +1561,7 @@ td {
 }
 th:first-child,
 td:first-child {
-  padding-left: 1.25em;
+  padding-left: 1rem;
 }
 table.list-mode th.actions:first-child,
 table.list-mode td.actions:first-child {