Improve index columns layout and correct empty table heading (CFM-223) (

#116)
COmanage · Aug 10, 2023 · 4120398 · 4120398
1 parent 08e1973
commit 4120398
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 6 deletions.
diff --git 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
@@ -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
@@ -756,17 +756,20 @@ 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;
 }
 .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 {