minor css updates

pradip-allwyn · Apr 27, 2024 · 6ad5f38 · 6ad5f38
1 parent cb53a8e
commit 6ad5f38
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 17 deletions.
diff --git a/htdocs/css/style.css b/htdocs/css/style.css
@@ -875,30 +875,22 @@ td.table_label {
 
 		.job-details.grid-container {
             display: grid;
-            /* grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));  */
 			grid-template-columns: repeat(7, auto);
 			align-items: center; 
             gap: 0px;
             padding: 0px;
-			/* padding-bottom: 12px; */
 			margin-top: 12px;
 			margin-bottom: 12px;
-			background-color: var(--background-color);
-			border: 1px solid var( --border-color);
-			border-bottom: 0px;
-			border-left: 0px;
-			border-radius: 0px;
+			background-color: var(--background-color);			
+			grid-gap: 1px;
         }
 
 		@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);
 		}
@@ -917,19 +909,20 @@ td.table_label {
 			display: flex;
 			align-items: baseline;
 			justify-content: space-evenly;
-			border-bottom: 1px solid var( --border-color);
-			border-left: 1px solid var( --border-color);
+			outline: 1px solid var( --border-color);
 			background-color: var(--background-color);
 			flex-wrap: wrap;
             padding-top: 8px;
 			/* border-radius: 6px; */
 		}
 
+		body.dark .job-details.grid-item:hover .info_label{
+			color: white;
+		}
+
 		@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);
 			}
 		}
 

diff --git a/htdocs/js/pages/JobDetails.class.js b/htdocs/js/pages/JobDetails.class.js
@@ -250,7 +250,8 @@ Class.subclass(Page.Base, "Page.JobDetails", {
 		let timing = summarize_event_timing(event.timing, event.timezone)
 
 		html += `
-		  <div class="job-details grid-container">
+		  <div class="job-details grid-container" style="font-size:1.1em">
+		    
 		    <div class="job-details  grid-item"><div class="info_label">JOB ID:</div><div class="info_value">${job.id}</div></div>
 			<div class="job-details  grid-item"><div class="info_label">PID:</div><div class="info_value">${(job.detached_pid || job.pid || '(Unknown)')}</div></div>
 		    <div class="job-details  grid-item"><div class="info_label">CAT:</div><div class="info_value">${jobCategory}</div></div>
@@ -259,8 +260,7 @@ Class.subclass(Page.Base, "Page.JobDetails", {
 		    <div class="job-details  grid-item"><div class="info_label">START:</div><div class="info_value">${jobStarted}</div></div>
 			<div class="job-details  grid-item"><div class="info_label">ELAPSED:</div><div class="info_value">${get_text_from_seconds(job.elapsed, false, false)}</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_value">${eventTitle}</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>