From a791dd86700abf8315441627042a45e60071c3ee Mon Sep 17 00:00:00 2001
From: Ken Dreyer <kdreyer@redhat.com>
Date: Nov 19 2021 21:29:45 +0000
Subject: [PATCH 1/2] www: fix alignments in channelinfo hosts table


Use the "data-list" classes to style the Hosts table in the channelinfo
page. This makes the header row stand out and easier to read, matching
the rest of the data tables in kojiweb.

This change also fixes a problem in some downstream themes. For example,
Fedora's theme and Brew's theme set "text-align: right" for all tbody.th
elements. These themes do this in order to control the larger parent
"info" table header cells, but it ends up mis-aligning un-classed
sub-tables like this one. With this change, the "list-header" class
left-aligns the header row text, and the "data-list" class left-aligns
the final text.

---

diff --git a/www/kojiweb/channelinfo.chtml b/www/kojiweb/channelinfo.chtml
index d056c6a..7aca22b 100644
--- a/www/kojiweb/channelinfo.chtml
+++ b/www/kojiweb/channelinfo.chtml
@@ -31,8 +31,8 @@
       <th>Hosts</th>
       <td>
       #if $len($hosts) > 0
-      <table>
-        <tr>
+      <table class="data-list">
+        <tr class="list-header">
           <th>Hostname</th>
           <th>Enabled</th>
           <th>Ready</th>

From 0323c4f98510e9567b4b8f0a739f8ca0bbff0e04 Mon Sep 17 00:00:00 2001
From: Ken Dreyer <kdreyer@redhat.com>
Date: Nov 19 2021 21:37:11 +0000
Subject: [PATCH 2/2] www: style channelinfo hosts table rows


Use the rowToggle helper to style the rows with alternating colors. This
makes this table easier to read.

---

diff --git a/www/kojiweb/channelinfo.chtml b/www/kojiweb/channelinfo.chtml
index 7aca22b..2207365 100644
--- a/www/kojiweb/channelinfo.chtml
+++ b/www/kojiweb/channelinfo.chtml
@@ -38,7 +38,7 @@
           <th>Ready</th>
         </tr>
       #for $host in $hosts
-        <tr>
+        <tr class="$util.rowToggle($self)">
           <td><a href="hostinfo?hostID=$host.id">$host.name</a></td>
           <td class="$str($bool($host.enabled)).lower()">#if $host.enabled then $util.imageTag('yes') else $util.imageTag('no')#</td>
           <td class="$str($bool($host.ready)).lower()">#if $host.ready then $util.imageTag('yes') else $util.imageTag('no')#</td>