Update jobs page grid layout to 10 columns with dedicated progress column

- Change grid-template-columns to: 0.3fr 1fr 1fr 2fr 1fr 1fr 1fr 1fr 1fr 1fr
- Move job progress to dedicated column 10
- Increase minimum width to 1600px for 10-column layout
- Better proportional spacing with smaller Queue ID column (0.3fr)
- Job progress now has its own dedicated column space
parent 7619c1ba
...@@ -4,11 +4,11 @@ ...@@ -4,11 +4,11 @@
{% block head %} {% block head %}
<style> <style>
.container { max-width: 90vw; min-width: 1400px; margin: 2rem auto; padding: 0 2rem; } .container { max-width: 90vw; min-width: 1600px; margin: 2rem auto; padding: 0 2rem; }
.jobs-table { background: white; border-radius: 12px; box-shadow: 0 2px 10px rgba(0,0,0,0.05); overflow: hidden; } .jobs-table { background: white; border-radius: 12px; box-shadow: 0 2px 10px rgba(0,0,0,0.05); overflow: hidden; }
.table-header { padding: 2rem; border-bottom: 1px solid #e5e7eb; } .table-header { padding: 2rem; border-bottom: 1px solid #e5e7eb; }
.table-header h2 { margin: 0; color: #1e293b; } .table-header h2 { margin: 0; color: #1e293b; }
.job-row { display: grid; grid-template-columns: 80px 80px 1fr 2fr 1fr 1fr 100px 100px 120px; gap: 0.75rem; padding: 0.75rem 1.5rem; border-bottom: 1px solid #e5e7eb; align-items: center; } .job-row { display: grid; grid-template-columns: 0.3fr 1fr 1fr 2fr 1fr 1fr 1fr 1fr 1fr 1fr; gap: 0.75rem; padding: 0.75rem 1.5rem; border-bottom: 1px solid #e5e7eb; align-items: center; }
.job-row:last-child { border-bottom: none; } .job-row:last-child { border-bottom: none; }
.job-type { color: #374151; } .job-type { color: #374151; }
.job-row > div { padding: 0.25rem 0; } .job-row > div { padding: 0.25rem 0; }
...@@ -128,7 +128,7 @@ ...@@ -128,7 +128,7 @@
progressElement.className = 'job-progress'; progressElement.className = 'job-progress';
progressElement.style.fontSize = '0.8rem'; progressElement.style.fontSize = '0.8rem';
progressElement.style.color = '#6b7280'; progressElement.style.color = '#6b7280';
progressElement.style.gridColumn = '8'; // Position after status column progressElement.style.gridColumn = '10'; // Dedicated progress column
progressElement.style.marginTop = '0.25rem'; progressElement.style.marginTop = '0.25rem';
jobRow.appendChild(progressElement); jobRow.appendChild(progressElement);
} }
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment