From f2a760f9787fc3ae9bd82e557a8a93d314bd03c4 Mon Sep 17 00:00:00 2001
From: Dmitry Litvintsev <litvinse@fnal.gov>
Date: Thu, 18 Jun 2026 16:02:34 -0500
Subject: [PATCH] httpd: restore some of the legacy color scheme and table
 layout

Motivation:
-----------
The patch 7e2040ecb81a24da4b5b7425d6c8eed213907013 introduced muted low
contrast colors that are harder to read. Plus table grid was removed
making it more difficult to find stuff when scrolling. Our admins voted
to bring old look&feel back.

Modification:
------------
This patch restores table look and feel and pool usage bars to their
original "bright" colors.

Result:
------
People seem happier :). Hopefully there is reasonable compromise as
the main page remained w/ "new" look&feel

Acked-by: Tigran
Target: trunk
Request: 11.2
Require-book: no
Require-notes: yes
---
 skel/share/httpd/static/styles/billing.css    |  8 +--
 skel/share/httpd/static/styles/common.css     | 58 +++++++------------
 skel/share/httpd/static/styles/poolinfo.css   | 14 +++--
 skel/share/httpd/static/styles/queueInfo.css  | 16 +++--
 .../httpd/static/styles/restoreHandler.css    |  1 +
 5 files changed, 45 insertions(+), 52 deletions(-)

diff --git a/skel/share/httpd/static/styles/billing.css b/skel/share/httpd/static/styles/billing.css
index 2b7bd1ca710..661c2946bbd 100644
--- a/skel/share/httpd/static/styles/billing.css
+++ b/skel/share/httpd/static/styles/billing.css
@@ -7,7 +7,7 @@
 h1, h2
 {
   text-align: center;
-  color: #3C3633;
+  color: blue;
 }
 
 table
@@ -19,13 +19,13 @@ table
 
 tr.total th, tr.total td
 {
-  background: #747264;
-  color: #EEEDEB;
+  background: #0000FF;
+  color: white;
 }
 
 a
 {
-  color: #EEEDEB;
+  color: white;
 }
 
 .action
diff --git a/skel/share/httpd/static/styles/common.css b/skel/share/httpd/static/styles/common.css
index 2d20ba0b29f..73eb6683699 100644
--- a/skel/share/httpd/static/styles/common.css
+++ b/skel/share/httpd/static/styles/common.css
@@ -1,22 +1,22 @@
 :root {
-  --v-page-background-color: #f1efed;
-  --v-page-text-color: #222831;
-  --v-table-border-color: rgba(64, 60, 56, 0.5);
-  --v-table-header-background-color: #403c38;
-  --v-tr-odd-background-color: #e9e9e9;
-  --v-tr-even-background-color: #f6f6f6;
-  --v-page-header-background-color: #403c38;
-  --v-page-header-text-color: #ffffff;
-  --v-page-header-separator-color: #e3513c;
+  --v-page-background-color: white;
+  --v-page-text-color: black;
+  --v-table-border-color: gray;
+  --v-table-header-background-color: #115259;
+  --v-tr-odd-background-color: #efefef;
+  --v-tr-even-background-color: #bebebe;
+  --v-page-header-background-color: transparent;
+  --v-page-header-text-color: red;
+  --v-page-header-separator-color: transparent;
 
   --v-index-container-background-color: #e9e9e9;
 
   --v-link-hover-color: #e3513c;
 
-  --v-space-precious: #F28585;
-  --v-space-sticky: #FFA447;
-  --v-space-cached: #FFFC9B;
-  --v-space-free: #B7E5B4;
+  --v-space-precious: red;
+  --v-space-sticky: magenta;
+  --v-space-cached: green;
+  --v-space-free: yellow;
 
 }
 
@@ -31,9 +31,7 @@
 
 body
 {
-  /*background: url("/images/bg.svg"); */
-  background-color: var(--v-page-background-color);
-  color: var(--v-page-text-color);
+  background: url("/images/bg.svg");
   margin: 0px;
 }
 
@@ -44,10 +42,8 @@ img
 
 #bird_small
 { 
-  color: var(--v-page-header-text-color);
-  background-color: var(--v-page-header-background-color);
-  padding: 1rem;
-  border-bottom: 4px solid var(--v-page-header-separator-color);
+  float: left;
+  color: red;
 }
 
 #bird_large
@@ -103,31 +99,19 @@ img
   width: 90%;
 }
 
-table, tr, th, td {
-  border-collapse: collapse;
-  border: 0px solid;
-  height: 3rem;
-}
-
 table
 {
-  border-collapse: separate;
+  border-collapse: collapse;
   border-spacing: 0;
-  outline: 1px solid var(--v-table-border-color);
-  overflow: hidden;
+  border: 1px solid var(--v-table-border-color);
   width: 100%;
   color: var(--v-page-text-color);
-  /*margin: 0 0 40px 0;*/
-};
-
+}
 
 td, th
 { 
-  padding: .5em 1em;
-  border: 0px solid gray;
-  margin-bottom: 10px;
-  padding: 0;
-  height: 6px;
+  padding: 4px;
+  border: 1px solid var(--v-table-border-color);
 }
 
 th
diff --git a/skel/share/httpd/static/styles/poolinfo.css b/skel/share/httpd/static/styles/poolinfo.css
index 2e73dc15cb1..a21a4706bf5 100644
--- a/skel/share/httpd/static/styles/poolinfo.css
+++ b/skel/share/httpd/static/styles/poolinfo.css
@@ -64,15 +64,19 @@ th
   font-weight: normal;
 }
 
-th.active, th.max, th.queued
+th.active, th.max
 {
-  background: #E0CCBE;
-  color: #3C3633;
+  background: #0099FF;
+}
+
+th.queued
+{
+  background: #00bbFF;
 }
 
 td.idle
 {
-  color: #3C3633;
+  color: #008080;
 }
 
 td.queued
@@ -82,6 +86,6 @@ td.queued
 
 tr.total th, tr.total td
 {
-  background: #747264;
+  background: #0000FF;
   color: white;
 }
diff --git a/skel/share/httpd/static/styles/queueInfo.css b/skel/share/httpd/static/styles/queueInfo.css
index b6528ebd666..85ce4844e25 100644
--- a/skel/share/httpd/static/styles/queueInfo.css
+++ b/skel/share/httpd/static/styles/queueInfo.css
@@ -3,15 +3,19 @@ th
   font-weight: normal;
 }
 
-th.active, th.max, th.queued
+th.active, th.max
 {
-  background: #FFA27F;
-  color: #3C3633;
+  background: #0099FF;
+}
+
+th.queued
+{
+  background: #00bbFF;
 }
 
 td.idle
 {
-  color: #3C3633;
+  color: #008080;
 }
 
 td.queued
@@ -21,6 +25,6 @@ td.queued
 
 tr.total th, tr.total td
 {
-  background: #FFE8C5;
-  color: #3C3633;
+  background: #0000FF;
+  color: white;
 }
diff --git a/skel/share/httpd/static/styles/restoreHandler.css b/skel/share/httpd/static/styles/restoreHandler.css
index 732eca6cbd9..24c5c71d57a 100644
--- a/skel/share/httpd/static/styles/restoreHandler.css
+++ b/skel/share/httpd/static/styles/restoreHandler.css
@@ -11,6 +11,7 @@
 h1, h2
 {
   text-align: center;
+  color: blue;
 }
 
 h1