firewall.cgi: Fix messy table striping

Signed-off-by: Michael Tremer <michael.tremer@ipfire.org>

diff --git a/html/cgi-bin/firewall.cgi b/html/cgi-bin/firewall.cgi
index 6d983cb23cb0d190a5f359c3c35ed9b5889b289f..e87a7fed02f3a7a17962e0f92f056a7b7919c33f 100644 (file)
--- a/html/cgi-bin/firewall.cgi
+++ b/html/cgi-bin/firewall.cgi
@@ -2484,7 +2484,8 @@ sub viewtablenew
        &General::readhasharray("$configsrvgrp", \%customservicegrp);
 
        &Header::openbox('100%', 'left', $title);
-       print "<table width='100%' cellspacing='0' class='tbl'>";
+
+       print "<table class='tbl'>";
 
        if (! -z $config) {
                my $count=0;
@@ -2581,19 +2582,20 @@ END
                        }
                        $$hash{'ACTIVE'}=$$hash{$key}[2];
                        $count++;
-                       if($coloryellow eq 'on'){
-                               $color="$color{'color14'}";
+
+                       if ($coloryellow eq 'on') {
+                               $color="is-warning";
                                $coloryellow='';
-                       }elsif($coloryellow eq ''){
-                               if ($count % 2){
-                                       $color="$color{'color22'}";
-                               }
-                               else{
-                                       $color="$color{'color20'}";
+                       } elsif($coloryellow eq '') {
+                               if ($count % 2) {
+                                       $color="is-even";
+                               } else {
+                                       $color="is-odd";
                                }
                        }
+
                        print<<END;
-                               <tr bgcolor='$color'>
+                               <tr class="$color">
 END
 
                        #RULETYPE (A,R,D)
@@ -2851,9 +2853,8 @@ END
                        #REMARK
                        if ($optionsfw{'SHOWREMARK'} eq 'on' && $$hash{$key}[16] ne ''){
                                print <<END;
-                                       <tr bgcolor='$color'>
-                                               <td>&nbsp;</td>
-                                               <td bgcolor='$rulecolor'></td>
+                                       <tr class="$color">
+                                               <td class='$rulecolor'></td>
                                                <td colspan='10'>
                                                        &nbsp; <em>$$hash{$key}[16]</em>
                                                </td>
@@ -2874,7 +2875,7 @@ END
                                        if($$hash{$key}[25] ne ''){push (@days,$Lang::tr{'fwdfw wd_sun'});}
                                        my $weekdays=join(",",@days);
                                        if (@days){
-                                               print"<tr bgcolor='$color'>";
+                                               print"<tr class='$color'>";
                                                print"<td>&nbsp;</td><td bgcolor='$rulecolor'></td><td align='left' colspan='10'>&nbsp; $weekdays &nbsp; $$hash{$key}[26] - $$hash{$key}[27]</td></tr>";
                                        }
                                }

diff --git a/html/html/themes/ipfire/include/css/style.css b/html/html/themes/ipfire/include/css/style.css
index 85a24deb0542f92f54112d20dc9eeadddea3aeb1..875064399d1283702705df7181a12a23fe4f0109 100644 (file)
--- a/html/html/themes/ipfire/include/css/style.css
+++ b/html/html/themes/ipfire/include/css/style.css
@@ -7,6 +7,8 @@
        --color-blue-invert    : #ffffff;
        --color-orange         : #ff9933;
        --color-orange-invert  : #ffffff;
+       --color-yellow         : #ffd700;
+       --color-yellow-invert  : #ffffff;
        --color-black          : #363636;
        --color-black-invert   : #ffffff;
        --color-grey           : #d6d6d6;
@@ -390,6 +392,21 @@ table.form tr.action td form {
        background-color: var(--color-light-grey);
 }
 
+/*
+       Classes to overwrite the automatic colouring
+*/
+.tbl tr.is-odd td {
+       background-color: var(--color-grey);
+}
+
+.tbl tr.is-even td {
+       background-color: var(--color-light-grey);
+}
+
+.tbl tr.is-warning td {
+       background-color: var(--color-yellow);
+}
+
 .tbl th:first-child {
        border-left: 1px solid #363636;
        border-top: 1px solid #363636;