Tweak job layout css in status page
Make the job lines fit better with long job names
Change-Id: I368bc17848aef5b6d2febf1b228a2f97837bcdc3
diff --git a/etc/status/public_html/app.js b/etc/status/public_html/app.js
index a74711e..9648f03 100644
--- a/etc/status/public_html/app.js
+++ b/etc/status/public_html/app.js
@@ -122,21 +122,34 @@
format: {
job: function(job) {
- var $job_line;
+ var $job_line = $('<span />');
+
if (job.url !== null) {
- $job_line = $('<a href="' + job.url + '" />');
+ $job_line.append(
+ $('<a />')
+ .addClass('zuul-job-name')
+ .attr('href', job.url)
+ .text(job.name)
+ );
}
- else{
- $job_line = $('<span />');
+ else {
+ $job_line.append(
+ $('<span />')
+ .addClass('zuul-job-name')
+ .text(job.name)
+ );
}
- $job_line.text(job.name)
- .append(zuul.format.job_status(job));
+
+ $job_line.append(zuul.format.job_status(job));
if (job.voting === false) {
$job_line.append(
- $(' <small />').text(' (non-voting)')
+ $(' <small />')
+ .addClass('zuul-non-voting-desc')
+ .text(' (non-voting)')
);
}
+
return $job_line;
},
diff --git a/etc/status/public_html/index.html b/etc/status/public_html/index.html
index f2ee00d..21d416f 100644
--- a/etc/status/public_html/index.html
+++ b/etc/status/public_html/index.html
@@ -34,7 +34,7 @@
float: right;
width: 70px;
height: 15px;
- margin: 0;
+ margin: 2px 0 0 0;
}
.zuul-change-total-result {
@@ -63,7 +63,15 @@
}
.zuul-change-job {
- padding: 5px 10px;
+ padding: 2px 8px;
+ }
+
+ .zuul-job-name {
+ font-size: small;
+ }
+
+ .zuul-non-voting-desc {
+ font-size: smaller;
}
</style>