From da7b4489655ee5d126a53e4209c61b436417de73 Mon Sep 17 00:00:00 2001
From: mikeTWC1984 <mikeTWC1984@gmail.com>
Date: Tue, 23 Apr 2024 22:51:01 -0400
Subject: [PATCH] final fixes 2

---
 htdocs/css/style.css                | 34 +++++++++++++++++++----------
 htdocs/js/pages/Home.class.js       |  2 +-
 htdocs/js/pages/JobDetails.class.js |  6 ++---
 3 files changed, 27 insertions(+), 15 deletions(-)

diff --git a/htdocs/css/style.css b/htdocs/css/style.css
index d58701d..f71c27f 100644
--- a/htdocs/css/style.css
+++ b/htdocs/css/style.css
@@ -867,17 +867,6 @@ td.table_label {
 			background-color: #cccccc26;
 		}
 
-		/* body.dark .stats.grid-item {
-			background-color: initial;
-		}
-		body.dark .stats.grid-item:hover {
-			color: #FFF;
-			background-color: initial;
-		}
-		.stats.grid-item:hover {
-			background-color: rgba(128,128,128, 0.1);
-		} */
-
 		@media (max-width: 1200px) { 
 			.stats.grid-container {
 				grid-template-columns: repeat(5, 1fr);
@@ -901,10 +890,25 @@ td.table_label {
 			border-radius: 0px;
         }
 
+		@media (max-width: 1200px) { 
+			.job-details.grid-container {
+				grid-template-columns: repeat(3, auto);
+				border-bottom: 1px solid var( --border-color);
+				border-top: 0px solid var( --border-color);
+			}
+		}
+
+
 		.job-details.grid-container.running {
 			grid-template-columns: repeat(6, auto);
 		}
 
+		@media (max-width: 1200px) { 
+			.job-details.grid-container.running {
+			    grid-template-columns: repeat(3, auto);
+			}
+		}
+
 		body.dark .job-details.grid-container {
 			background-color: var(--background-color);
 		}
@@ -921,6 +925,14 @@ td.table_label {
 			/* border-radius: 6px; */
 		}
 
+		@media (max-width: 1200px) { 
+			.job-details.grid-item {
+				justify-content:space-around;
+				border-bottom: 0px solid var( --border-color);
+				border-top: 1px solid var( --border-color);
+			}
+		}
+
 		body.dark .job-details.grid-item:hover div.info_value {
 			color: white;
 			text-shadow: none;
diff --git a/htdocs/js/pages/Home.class.js b/htdocs/js/pages/Home.class.js
index 9a9165e..87b47be 100644
--- a/htdocs/js/pages/Home.class.js
+++ b/htdocs/js/pages/Home.class.js
@@ -315,7 +315,7 @@ Class.subclass( Page.Base, "Page.Home", {
 		var col_width = Math.floor( ((size.width * 0.9) + 50) / 7 );
 		
 		var cols = ['Event Name', 'Category', 'Plugin', 'Target', 'Scheduled Time', 'Countdown', 'Actions'];
-		var limit = Math.round((window.innerWidth)/350)*4 // try to fit 4 rows
+		var limit = Math.round((window.innerWidth)/350)*(window.innerHeight < 800 ? 3 : 4) // upcoming 3 or 4 rows
 		
 		html += this.getPaginatedTable({
 			resp: {
diff --git a/htdocs/js/pages/JobDetails.class.js b/htdocs/js/pages/JobDetails.class.js
index 7f87720..350e44b 100644
--- a/htdocs/js/pages/JobDetails.class.js
+++ b/htdocs/js/pages/JobDetails.class.js
@@ -261,9 +261,9 @@ Class.subclass(Page.Base, "Page.JobDetails", {
 		    
 
 			<div class="job-details  grid-item"><div class="info_label">EVENT:</div><div class="info_value">${eventTitle}</div></div>
-			<div class="job-details  grid-item"><div class="info_label">ARG:</div><div class="info_value">${encode_entities(job.arg || '(no argument)')}</div></div>
+			<div class="job-details  grid-item"><div class="info_label">ARG:</div><div class="info_value">${encode_entities(job.arg || '(None)')}</div></div>
 			<div class="job-details  grid-item"><div class="info_label">PLUGIN:</div><div class="info_value">${jobPlugin}</div></div>
-			<div class="job-details  grid-item"><div class="info_label">MEMO:</div><div class="info_value">${job.memo || '(none)'}</div></div>
+			<div class="job-details  grid-item"><div class="info_label">MEMO:</div><div class="info_value">${job.memo || '(None)'}</div></div>
 		    <div class="job-details  grid-item"><div class="info_label">HOST:</div><div class="info_value">${this.getNiceGroup(null, job.hostname, col_width)}</div></div>
 		    <div class="job-details  grid-item"><div class="info_label">END:</div><div class="info_value">${get_nice_date_time(job.time_end, false, true)}</div></div>   				    			
 			<div class="job-details  grid-item"><div class="info_value">${jumpToHist }</div></div>
@@ -821,7 +821,7 @@ Class.subclass(Page.Base, "Page.JobDetails", {
 		  <div class="job-details  grid-item"><div class="info_label">START:</div><div class="info_value">${get_nice_date_time(job.time_start, false, true) }</div></div>
 
 		  <div class="job-details  grid-item"><div class="info_label">EVENT:</div><div class="info_value">${eventTitle}</div></div>
-		  <div class="job-details  grid-item"><div class="info_label">ARG:</div><div class="info_value">${encode_entities(job.arg || '(no argument)')}</div></div>
+		  <div class="job-details  grid-item"><div class="info_label">ARG:</div><div class="info_value">${encode_entities(job.arg || '(None)')}</div></div>
 		  <div class="job-details  grid-item"><div class="info_label">PLUGIN:</div><div class="info_value">${this.getNicePlugin(plugin, col_width)}</div></div>
 		  <div class="job-details  grid-item"><div class="info_label">HOST:</div><div class="info_value">${this.getNiceGroup(null, job.hostname, col_width)}</div></div>
 		  <div class="job-details  grid-item"><div class="info_label">ELAPSED TIME:</div><div id="d_live_elapsed" class="info_value">${get_text_from_seconds(elapsed, false, false)}</div></div>